@azure/communication-react 1.14.0-beta.2 → 1.14.1-alpha-202403210013

package/dist/dist-esm/react-composites/src/composites/CallComposite/utils/spotlightUtils.js

@@ -0,0 +1,136 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+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());
+    });
+};
+/* @conditional-compile-remove(spotlight) */
+import { useMemo } from 'react';
+/* @conditional-compile-remove(spotlight) */
+import { useLocale } from '../../localization';
+/* @conditional-compile-remove(spotlight) */
+/**
+ * @internal
+ */
+export const useLocalSpotlightCallbacksWithPrompt = (onStartLocalSpotlight, onStopLocalSpotlight, setIsPromptOpen, setPromptProps) => {
+    const strings = useLocale().strings.call;
+    return useMemo(() => {
+        if (!setIsPromptOpen || !setPromptProps) {
+            return {
+                onStartLocalSpotlightWithPrompt: onStartLocalSpotlight,
+                onStopLocalSpotlightWithPrompt: onStopLocalSpotlight
+            };
+        }
+        return {
+            onStartLocalSpotlightWithPrompt: onStartLocalSpotlight
+                ? getStartLocalSpotlightWithPromptCallback(onStartLocalSpotlight, setIsPromptOpen, setPromptProps, strings)
+                : undefined,
+            onStopLocalSpotlightWithPrompt: onStopLocalSpotlight
+                ? getStopLocalSpotlightWithPromptCallback(onStopLocalSpotlight, setIsPromptOpen, setPromptProps, strings)
+                : undefined
+        };
+    }, [onStartLocalSpotlight, onStopLocalSpotlight, setIsPromptOpen, setPromptProps, strings]);
+};
+/* @conditional-compile-remove(spotlight) */
+const getStartLocalSpotlightWithPromptCallback = (onStartSpotlight, setIsPromptOpen, setPromptProps, strings) => {
+    return () => __awaiter(void 0, void 0, void 0, function* () {
+        setPromptProps({
+            heading: strings.spotlightPrompt.startSpotlightHeading,
+            text: strings.spotlightPrompt.startSpotlightOnSelfText,
+            confirmButtonLabel: strings.spotlightPrompt.startSpotlightConfirmButtonLabel,
+            cancelButtonLabel: strings.spotlightPrompt.startSpotlightCancelButtonLabel,
+            onConfirm: () => {
+                onStartSpotlight();
+                setIsPromptOpen(false);
+            },
+            onCancel: () => setIsPromptOpen(false)
+        });
+        setIsPromptOpen(true);
+    });
+};
+/* @conditional-compile-remove(spotlight) */
+const getStopLocalSpotlightWithPromptCallback = (onStopSpotlight, setIsPromptOpen, setPromptProps, strings) => {
+    return () => __awaiter(void 0, void 0, void 0, function* () {
+        setPromptProps({
+            heading: strings.spotlightPrompt.stopSpotlightOnSelfHeading,
+            text: strings.spotlightPrompt.stopSpotlightOnSelfText,
+            confirmButtonLabel: strings.spotlightPrompt.stopSpotlightOnSelfConfirmButtonLabel,
+            cancelButtonLabel: strings.spotlightPrompt.stopSpotlightCancelButtonLabel,
+            onConfirm: () => {
+                onStopSpotlight();
+                setIsPromptOpen(false);
+            },
+            onCancel: () => setIsPromptOpen(false)
+        });
+        setIsPromptOpen(true);
+    });
+};
+/* @conditional-compile-remove(spotlight) */
+/**
+ * @internal
+ */
+export const useRemoteSpotlightCallbacksWithPrompt = (onStartRemoteSpotlight, onStopRemoteSpotlight, setIsPromptOpen, setPromptProps) => {
+    const strings = useLocale().strings.call;
+    return useMemo(() => {
+        if (!setIsPromptOpen || !setPromptProps) {
+            return {
+                onStartRemoteSpotlightWithPrompt: onStartRemoteSpotlight,
+                onStopRemoteSpotlightWithPrompt: onStopRemoteSpotlight
+            };
+        }
+        return {
+            onStartRemoteSpotlightWithPrompt: onStartRemoteSpotlight
+                ? getStartRemoteSpotlightWithPromptCallback(onStartRemoteSpotlight, setIsPromptOpen, setPromptProps, strings)
+                : undefined,
+            onStopRemoteSpotlightWithPrompt: onStopRemoteSpotlight
+                ? getStopRemoteSpotlightWithPromptCallback(onStopRemoteSpotlight, setIsPromptOpen, setPromptProps, strings)
+                : undefined
+        };
+    }, [onStartRemoteSpotlight, onStopRemoteSpotlight, setIsPromptOpen, setPromptProps, strings]);
+};
+/* @conditional-compile-remove(spotlight) */
+const getStartRemoteSpotlightWithPromptCallback = (onStartSpotlight, setIsPromptOpen, setPromptProps, strings) => {
+    return (userIds) => __awaiter(void 0, void 0, void 0, function* () {
+        if (userIds.length > 1) {
+            onStartSpotlight(userIds);
+        }
+        setPromptProps({
+            heading: strings.spotlightPrompt.startSpotlightHeading,
+            text: strings.spotlightPrompt.startSpotlightText,
+            confirmButtonLabel: strings.spotlightPrompt.startSpotlightConfirmButtonLabel,
+            cancelButtonLabel: strings.spotlightPrompt.startSpotlightCancelButtonLabel,
+            onConfirm: () => {
+                onStartSpotlight(userIds);
+                setIsPromptOpen(false);
+            },
+            onCancel: () => setIsPromptOpen(false)
+        });
+        setIsPromptOpen(true);
+    });
+};
+/* @conditional-compile-remove(spotlight) */
+const getStopRemoteSpotlightWithPromptCallback = (onStopSpotlight, setIsPromptOpen, setPromptProps, strings) => {
+    return (userIds) => __awaiter(void 0, void 0, void 0, function* () {
+        if (userIds.length > 1) {
+            onStopSpotlight(userIds);
+        }
+        setPromptProps({
+            heading: strings.spotlightPrompt.stopSpotlightHeading,
+            text: strings.spotlightPrompt.stopSpotlightText,
+            confirmButtonLabel: strings.spotlightPrompt.stopSpotlightConfirmButtonLabel,
+            cancelButtonLabel: strings.spotlightPrompt.stopSpotlightCancelButtonLabel,
+            onConfirm: () => {
+                onStopSpotlight(userIds);
+                setIsPromptOpen(false);
+            },
+            onCancel: () => setIsPromptOpen(false)
+        });
+        setIsPromptOpen(true);
+    });
+};
+//# sourceMappingURL=spotlightUtils.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/utils/spotlightUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spotlightUtils.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/utils/spotlightUtils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(spotlight) */\nimport { useMemo } from 'react';\n/* @conditional-compile-remove(spotlight) */\nimport { CallCompositeStrings } from '../Strings';\n/* @conditional-compile-remove(spotlight) */\nimport { PromptProps } from '../components/Prompt';\n/* @conditional-compile-remove(spotlight) */\nimport { useLocale } from '../../localization';\n\n/* @conditional-compile-remove(spotlight) */\n/**\n * @internal\n */\nexport const useLocalSpotlightCallbacksWithPrompt = (\n  onStartLocalSpotlight?: () => Promise<void>,\n  onStopLocalSpotlight?: () => Promise<void>,\n  setIsPromptOpen?: (isOpen: boolean) => void,\n  setPromptProps?: (promptProps: PromptProps) => void\n): {\n  onStartLocalSpotlightWithPrompt?: () => Promise<void>;\n  onStopLocalSpotlightWithPrompt?: () => Promise<void>;\n} => {\n  const strings = useLocale().strings.call;\n\n  return useMemo(() => {\n    if (!setIsPromptOpen || !setPromptProps) {\n      return {\n        onStartLocalSpotlightWithPrompt: onStartLocalSpotlight,\n        onStopLocalSpotlightWithPrompt: onStopLocalSpotlight\n      };\n    }\n    return {\n      onStartLocalSpotlightWithPrompt: onStartLocalSpotlight\n        ? getStartLocalSpotlightWithPromptCallback(onStartLocalSpotlight, setIsPromptOpen, setPromptProps, strings)\n        : undefined,\n      onStopLocalSpotlightWithPrompt: onStopLocalSpotlight\n        ? getStopLocalSpotlightWithPromptCallback(onStopLocalSpotlight, setIsPromptOpen, setPromptProps, strings)\n        : undefined\n    };\n  }, [onStartLocalSpotlight, onStopLocalSpotlight, setIsPromptOpen, setPromptProps, strings]);\n};\n\n/* @conditional-compile-remove(spotlight) */\nconst getStartLocalSpotlightWithPromptCallback = (\n  onStartSpotlight: (userIds?: string[]) => void,\n  setIsPromptOpen: (isOpen: boolean) => void,\n  setPromptProps: (promptProps: PromptProps) => void,\n  strings: CallCompositeStrings\n): ((userIds?: string[]) => Promise<void>) => {\n  return async (): Promise<void> => {\n    setPromptProps({\n      heading: strings.spotlightPrompt.startSpotlightHeading,\n      text: strings.spotlightPrompt.startSpotlightOnSelfText,\n      confirmButtonLabel: strings.spotlightPrompt.startSpotlightConfirmButtonLabel,\n      cancelButtonLabel: strings.spotlightPrompt.startSpotlightCancelButtonLabel,\n      onConfirm: () => {\n        onStartSpotlight();\n        setIsPromptOpen(false);\n      },\n      onCancel: () => setIsPromptOpen(false)\n    });\n    setIsPromptOpen(true);\n  };\n};\n\n/* @conditional-compile-remove(spotlight) */\nconst getStopLocalSpotlightWithPromptCallback = (\n  onStopSpotlight: () => void,\n  setIsPromptOpen: (isOpen: boolean) => void,\n  setPromptProps: (promptProps: PromptProps) => void,\n  strings: CallCompositeStrings\n): (() => Promise<void>) => {\n  return async (): Promise<void> => {\n    setPromptProps({\n      heading: strings.spotlightPrompt.stopSpotlightOnSelfHeading,\n      text: strings.spotlightPrompt.stopSpotlightOnSelfText,\n      confirmButtonLabel: strings.spotlightPrompt.stopSpotlightOnSelfConfirmButtonLabel,\n      cancelButtonLabel: strings.spotlightPrompt.stopSpotlightCancelButtonLabel,\n      onConfirm: () => {\n        onStopSpotlight();\n        setIsPromptOpen(false);\n      },\n      onCancel: () => setIsPromptOpen(false)\n    });\n    setIsPromptOpen(true);\n  };\n};\n\n/* @conditional-compile-remove(spotlight) */\n/**\n * @internal\n */\nexport const useRemoteSpotlightCallbacksWithPrompt = (\n  onStartRemoteSpotlight?: (userIds: string[]) => Promise<void>,\n  onStopRemoteSpotlight?: (userIds: string[]) => Promise<void>,\n  setIsPromptOpen?: (isOpen: boolean) => void,\n  setPromptProps?: (promptProps: PromptProps) => void\n): {\n  onStartRemoteSpotlightWithPrompt?: (userIds: string[]) => Promise<void>;\n  onStopRemoteSpotlightWithPrompt?: (userIds: string[]) => Promise<void>;\n} => {\n  const strings = useLocale().strings.call;\n\n  return useMemo(() => {\n    if (!setIsPromptOpen || !setPromptProps) {\n      return {\n        onStartRemoteSpotlightWithPrompt: onStartRemoteSpotlight,\n        onStopRemoteSpotlightWithPrompt: onStopRemoteSpotlight\n      };\n    }\n    return {\n      onStartRemoteSpotlightWithPrompt: onStartRemoteSpotlight\n        ? getStartRemoteSpotlightWithPromptCallback(onStartRemoteSpotlight, setIsPromptOpen, setPromptProps, strings)\n        : undefined,\n      onStopRemoteSpotlightWithPrompt: onStopRemoteSpotlight\n        ? getStopRemoteSpotlightWithPromptCallback(onStopRemoteSpotlight, setIsPromptOpen, setPromptProps, strings)\n        : undefined\n    };\n  }, [onStartRemoteSpotlight, onStopRemoteSpotlight, setIsPromptOpen, setPromptProps, strings]);\n};\n\n/* @conditional-compile-remove(spotlight) */\nconst getStartRemoteSpotlightWithPromptCallback = (\n  onStartSpotlight: (userIds: string[]) => void,\n  setIsPromptOpen: (isOpen: boolean) => void,\n  setPromptProps: (promptProps: PromptProps) => void,\n  strings: CallCompositeStrings\n): ((userIds: string[]) => Promise<void>) => {\n  return async (userIds: string[]): Promise<void> => {\n    if (userIds.length > 1) {\n      onStartSpotlight(userIds);\n    }\n    setPromptProps({\n      heading: strings.spotlightPrompt.startSpotlightHeading,\n      text: strings.spotlightPrompt.startSpotlightText,\n      confirmButtonLabel: strings.spotlightPrompt.startSpotlightConfirmButtonLabel,\n      cancelButtonLabel: strings.spotlightPrompt.startSpotlightCancelButtonLabel,\n      onConfirm: () => {\n        onStartSpotlight(userIds);\n        setIsPromptOpen(false);\n      },\n      onCancel: () => setIsPromptOpen(false)\n    });\n    setIsPromptOpen(true);\n  };\n};\n\n/* @conditional-compile-remove(spotlight) */\nconst getStopRemoteSpotlightWithPromptCallback = (\n  onStopSpotlight: (userIds: string[]) => void,\n  setIsPromptOpen: (isOpen: boolean) => void,\n  setPromptProps: (promptProps: PromptProps) => void,\n  strings: CallCompositeStrings\n): ((userIds: string[]) => Promise<void>) => {\n  return async (userIds: string[]): Promise<void> => {\n    if (userIds.length > 1) {\n      onStopSpotlight(userIds);\n    }\n\n    setPromptProps({\n      heading: strings.spotlightPrompt.stopSpotlightHeading,\n      text: strings.spotlightPrompt.stopSpotlightText,\n      confirmButtonLabel: strings.spotlightPrompt.stopSpotlightConfirmButtonLabel,\n      cancelButtonLabel: strings.spotlightPrompt.stopSpotlightCancelButtonLabel,\n      onConfirm: () => {\n        onStopSpotlight(userIds);\n        setIsPromptOpen(false);\n      },\n      onCancel: () => setIsPromptOpen(false)\n    });\n    setIsPromptOpen(true);\n  };\n};\n"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/utils/timerUtils.js

@@ -23,8 +23,8 @@ export const getHours = (time) => {
  */
 export const getReadableTime = (time) => {
     const hours = getHours(time);
-    const readableMinutes = ('0' + getMinutes(time) % 60).slice(-2);
-    const readableSeconds = ('0' + getSeconds(time) % 60).slice(-2);
+    const readableMinutes = ('0' + (getMinutes(time) % 60)).slice(-2);
+    const readableSeconds = ('0' + (getSeconds(time) % 60)).slice(-2);
     return `${hours > 0 ? hours + ':' : ''}${readableMinutes}:${readableSeconds}`;
 };
 //# sourceMappingURL=timerUtils.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/utils/timerUtils.js.map

@@ -1 +1 @@
-{"version":3,"file":"timerUtils.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/utils/timerUtils.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAY,EAAU,EAAE;IACjD,OAAO,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;AAC3C,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAY,EAAU,EAAE;IACjD,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;AACjC,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,IAAY,EAAU,EAAE;IAC/C,OAAO,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;AAC3C,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,IAAY,EAAU,EAAE;IACtD,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7B,MAAM,eAAe,GAAG,CAAC,GAAG,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IAChE,MAAM,eAAe,GAAG,CAAC,GAAG,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IAChE,OAAO,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,eAAe,IAAI,eAAe,EAAE,CAAC;AAChF,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/**\n * @internal\n */\nexport const getMinutes = (time: number): number => {\n  return Math.floor(getSeconds(time) / 60);\n};\n\n/**\n * @internal\n */\nexport const getSeconds = (time: number): number => {\n  return Math.floor(time / 1000);\n};\n\n/**\n * @internal\n */\nexport const getHours = (time: number): number => {\n  return Math.floor(getMinutes(time) / 60);\n};\n\n/**\n * @internal\n */\nexport const getReadableTime = (time: number): string => {\n  const hours = getHours(time);\n  const readableMinutes = ('0' + getMinutes(time) % 60).slice(-2);\n  const readableSeconds = ('0' + getSeconds(time) % 60).slice(-2);\n  return `${hours > 0 ? hours + ':' : ''}${readableMinutes}:${readableSeconds}`;\n};"]}
+{"version":3,"file":"timerUtils.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/utils/timerUtils.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAY,EAAU,EAAE;IACjD,OAAO,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;AAC3C,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAY,EAAU,EAAE;IACjD,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;AACjC,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,IAAY,EAAU,EAAE;IAC/C,OAAO,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;AAC3C,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,IAAY,EAAU,EAAE;IACtD,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7B,MAAM,eAAe,GAAG,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IAClE,MAAM,eAAe,GAAG,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IAClE,OAAO,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,eAAe,IAAI,eAAe,EAAE,CAAC;AAChF,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/**\n * @internal\n */\nexport const getMinutes = (time: number): number => {\n  return Math.floor(getSeconds(time) / 60);\n};\n\n/**\n * @internal\n */\nexport const getSeconds = (time: number): number => {\n  return Math.floor(time / 1000);\n};\n\n/**\n * @internal\n */\nexport const getHours = (time: number): number => {\n  return Math.floor(getMinutes(time) / 60);\n};\n\n/**\n * @internal\n */\nexport const getReadableTime = (time: number): string => {\n  const hours = getHours(time);\n  const readableMinutes = ('0' + (getMinutes(time) % 60)).slice(-2);\n  const readableSeconds = ('0' + (getSeconds(time) % 60)).slice(-2);\n  return `${hours > 0 ? hours + ':' : ''}${readableMinutes}:${readableSeconds}`;\n};\n"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/utils/useConsoleErrors.js.map

@@ -1 +1 @@
-{"version":3,"file":"useConsoleErrors.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/utils/useConsoleErrors.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,wCAAwC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,wCAAwC;AACxC,OAAO,EAAE,uBAAuB,EAAE,uBAAuB,EAAE,4BAA4B,EAAE,+BAA+B,EAAE,MAAM,SAAS,CAAC;AAE1I;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,SAAqB,EAAQ,EAAE;;IACvE,wCAAwC;IACxC,SAAS,CAAC,GAAG,EAAE;;QACb,QAAQ,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,aAAa,0CAAE,OAAO,EAAE,CAAC;YAC1C,KAAK,uBAAuB;gBAC1B,OAAO,CAAC,KAAK,CAAC,wFAAwF,CAAC,CAAC;gBACxG,MAAM;YACR,KAAK,uBAAuB;gBAC1B,OAAO,CAAC,KAAK,CAAC,sDAAsD,CAAC,CAAC;gBACtE,MAAM;YACR,KAAK,4BAA4B;gBAC/B,OAAO,CAAC,KAAK,CAAC,sDAAsD,CAAC,CAAC;gBACtE,MAAM;YACR,KAAK,+BAA+B;gBAClC,OAAO,CAAC,KAAK,CAAC,+DAA+D,CAAC,CAAC;gBAC/E,MAAM;QACV,CAAC;IACH,CAAC,EAAE,CAAC,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,aAAa,0CAAE,OAAO,CAAC,CAAC,CAAC;AAC1C,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { CallState } from '@internal/calling-stateful-client';\n/* @conditional-compile-remove(rooms) */\nimport { useEffect } from 'react';\n/* @conditional-compile-remove(rooms) */\nimport { ROOM_NOT_FOUND_SUB_CODE, ROOM_NOT_VALID_SUB_CODE, NOT_INVITED_TO_ROOM_SUB_CODE, INVITE_TO_ROOM_REMOVED_SUB_CODE } from './Utils';\n\n/**\n * @private\n */\nexport const useEndedCallConsoleErrors = (endedCall?: CallState): void => {\n  /* @conditional-compile-remove(rooms) */\n  useEffect(() => {\n    switch (endedCall?.callEndReason?.subCode) {\n      case ROOM_NOT_FOUND_SUB_CODE:\n        console.error('Call ended because the room id provided through the adapter locator could not be found');\n        break;\n      case ROOM_NOT_VALID_SUB_CODE:\n        console.error('Call ended because this room is currently not valid.');\n        break;\n      case NOT_INVITED_TO_ROOM_SUB_CODE:\n        console.error('Call ended because you are not invited to this room.');\n        break;\n      case INVITE_TO_ROOM_REMOVED_SUB_CODE:\n        console.error('Call ended because your invite to this room has been removed.');\n        break;\n    }\n  }, [endedCall?.callEndReason?.subCode]);\n};"]}
+{"version":3,"file":"useConsoleErrors.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/utils/useConsoleErrors.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,wCAAwC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,wCAAwC;AACxC,OAAO,EACL,uBAAuB,EACvB,uBAAuB,EACvB,4BAA4B,EAC5B,+BAA+B,EAChC,MAAM,SAAS,CAAC;AAEjB;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,SAAqB,EAAQ,EAAE;;IACvE,wCAAwC;IACxC,SAAS,CAAC,GAAG,EAAE;;QACb,QAAQ,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,aAAa,0CAAE,OAAO,EAAE,CAAC;YAC1C,KAAK,uBAAuB;gBAC1B,OAAO,CAAC,KAAK,CAAC,wFAAwF,CAAC,CAAC;gBACxG,MAAM;YACR,KAAK,uBAAuB;gBAC1B,OAAO,CAAC,KAAK,CAAC,sDAAsD,CAAC,CAAC;gBACtE,MAAM;YACR,KAAK,4BAA4B;gBAC/B,OAAO,CAAC,KAAK,CAAC,sDAAsD,CAAC,CAAC;gBACtE,MAAM;YACR,KAAK,+BAA+B;gBAClC,OAAO,CAAC,KAAK,CAAC,+DAA+D,CAAC,CAAC;gBAC/E,MAAM;QACV,CAAC;IACH,CAAC,EAAE,CAAC,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,aAAa,0CAAE,OAAO,CAAC,CAAC,CAAC;AAC1C,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { CallState } from '@internal/calling-stateful-client';\n/* @conditional-compile-remove(rooms) */\nimport { useEffect } from 'react';\n/* @conditional-compile-remove(rooms) */\nimport {\n  ROOM_NOT_FOUND_SUB_CODE,\n  ROOM_NOT_VALID_SUB_CODE,\n  NOT_INVITED_TO_ROOM_SUB_CODE,\n  INVITE_TO_ROOM_REMOVED_SUB_CODE\n} from './Utils';\n\n/**\n * @private\n */\nexport const useEndedCallConsoleErrors = (endedCall?: CallState): void => {\n  /* @conditional-compile-remove(rooms) */\n  useEffect(() => {\n    switch (endedCall?.callEndReason?.subCode) {\n      case ROOM_NOT_FOUND_SUB_CODE:\n        console.error('Call ended because the room id provided through the adapter locator could not be found');\n        break;\n      case ROOM_NOT_VALID_SUB_CODE:\n        console.error('Call ended because this room is currently not valid.');\n        break;\n      case NOT_INVITED_TO_ROOM_SUB_CODE:\n        console.error('Call ended because you are not invited to this room.');\n        break;\n      case INVITE_TO_ROOM_REMOVED_SUB_CODE:\n        console.error('Call ended because your invite to this room has been removed.');\n        break;\n    }\n  }, [endedCall?.callEndReason?.subCode]);\n};\n"]}

package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.d.ts

@@ -1,8 +1,10 @@
 /// <reference types="react" />
 import { PartialTheme, Theme } from '@fluentui/react';
+import { CallSurvey } from '@azure/communication-calling';
 import { CallWithChatAdapter } from './adapter/CallWithChatAdapter';
 import { BaseCompositeProps } from '../common/BaseComposite';
 import { CallWithChatCompositeIcons } from '../common/icons';
+import { CallSurveyImprovementSuggestions } from "../../../../react-components/src";
 import { FileSharingOptions } from '../ChatComposite';
 import { RemoteVideoTileMenuOptions } from '../CallComposite/CallComposite';
 import { LocalVideoTileOptions } from '../CallComposite/CallComposite';
@@ -137,6 +139,40 @@ export type CallWithChatCompositeOptions = {
          */
         layout?: VideoGalleryLayout;
     };
+    /**
+     * Options for end of call survey
+     */
+    surveyOptions?: {
+        /**
+         * Disable call survey at the end of a call.
+         * @defaultValue false
+         */
+        disableSurvey?: boolean;
+        /**
+         * Optional callback to redirect users to custom screens when survey is done, note that default end call screen will be shown if this callback is not provided
+         * This callback can be used to redirect users to different screens depending on survey state, whether it is submitted, skipped or has a problem when submitting the survey
+         */
+        onSurveyClosed?: (surveyState: 'sent' | 'skipped' | 'error', surveyError?: string) => void;
+        /**
+         * Optional callback to handle survey data including free form text response
+         * Note that free form text response survey option is only going to be enabled when this callback is provided
+         * User will need to handle all free form text response on their own
+         */
+        onSurveySubmitted?: (callId: string, surveyId: string, 
+        /**
+         * This is the survey results containing star survey data and API tag survey data.
+         * This part of the result will always be sent to the calling sdk
+         * This callback provides user with the ability to gain access to survey data
+         */
+        submittedSurvey: CallSurvey, 
+        /**
+         * This is the survey results containing free form text
+         * This part of the result will not be handled by composites
+         * User will need to collect and handle this information 100% on their own
+         * Free form text survey is not going to show in the UI if onSurveySubmitted is not populated
+         */
+        improvementSuggestions: CallSurveyImprovementSuggestions) => Promise<void>;
+    };
     /**
      * Options for setting additional customizations related to personalized branding.
      */
@@ -176,6 +212,16 @@ export type CallWithChatCompositeOptions = {
             url: string;
         };
     };
+    /**
+     * Options for settings related to spotlight.
+     */
+    spotlight?: {
+        /**
+         * Flag to hide the menu buttons to start and stop spotlight for remote participants and the local participant.
+         * @defaultValue false
+         */
+        hideSpotlightButtons?: boolean;
+    };
 };
 /**
  * CallWithChatComposite brings together key components to provide a full call with chat experience out of the box.

package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.js

@@ -19,6 +19,8 @@ import { SidePaneHeader } from '../common/SidePaneHeader';
 import { useUnreadMessagesTracker } from './ChatButton/useUnreadMessagesTracker';
 const CallWithChatScreen = (props) => {
     const { callWithChatAdapter, fluentTheme, formFactor = 'desktop' } = props;
+    /* @conditional-compile-remove(end-of-call-survey) */
+    const { surveyOptions } = props;
     const mobileView = formFactor === 'mobile';
     if (!callWithChatAdapter) {
         throw new Error('CallWithChatAdapter is undefined');
@@ -81,30 +83,44 @@ const CallWithChatScreen = (props) => {
         tooltipOnContent: callWithChatStrings.chatButtonTooltipClose
     }), [callWithChatStrings]);
     const theme = useTheme();
-    const commonButtonStyles = useMemo(() => !mobileView ? getDesktopCommonButtonStyles(theme) : undefined, [mobileView, theme]);
+    const commonButtonStyles = useMemo(() => (!mobileView ? getDesktopCommonButtonStyles(theme) : undefined), [mobileView, theme]);
     const showChatButton = checkShowChatButton(props.callControls);
     const chatButtonDisabled = showChatButton && (checkChatButtonIsDisabled(props.callControls) || !hasJoinedCall || isOnHold);
-    const chatTabHeaderProps = useMemo(() => mobileView && showChatButton ? {
-        onClick: toggleChat,
-        disabled: chatButtonDisabled
-    } : undefined, [chatButtonDisabled, mobileView, toggleChat, showChatButton]);
+    const chatTabHeaderProps = useMemo(() => mobileView && showChatButton
+        ? {
+            onClick: toggleChat,
+            disabled: chatButtonDisabled
+        }
+        : undefined, [chatButtonDisabled, mobileView, toggleChat, showChatButton]);
     const unreadChatMessagesCount = useUnreadMessagesTracker(chatAdapter, isChatOpen);
     const customChatButton = useCallback((args) => ({
         placement: mobileView ? 'primary' : 'secondary',
-        onRenderButton: () => React.createElement(ChatButtonWithUnreadMessagesBadge, { checked: isChatOpen, showLabel: args.displayType !== 'compact', onClick: toggleChat, disabled: chatButtonDisabled, strings: chatButtonStrings, styles: commonButtonStyles, newMessageLabel: callWithChatStrings.chatButtonNewMessageNotificationLabel, unreadChatMessagesCount: unreadChatMessagesCount, 
+        onRenderButton: () => (React.createElement(ChatButtonWithUnreadMessagesBadge, { checked: isChatOpen, showLabel: args.displayType !== 'compact', onClick: toggleChat, disabled: chatButtonDisabled, strings: chatButtonStrings, styles: commonButtonStyles, newMessageLabel: callWithChatStrings.chatButtonNewMessageNotificationLabel, unreadChatMessagesCount: unreadChatMessagesCount, 
             // As chat is disabled when on hold, we don't want to show the unread badge when on hold
-            hideUnreadChatMessagesBadge: isOnHold, disableTooltip: mobileView })
-    }), [callWithChatStrings.chatButtonNewMessageNotificationLabel, chatButtonStrings, commonButtonStyles, isChatOpen, chatButtonDisabled, mobileView, toggleChat, unreadChatMessagesCount, isOnHold]);
+            hideUnreadChatMessagesBadge: isOnHold, disableTooltip: mobileView }))
+    }), [
+        callWithChatStrings.chatButtonNewMessageNotificationLabel,
+        chatButtonStrings,
+        commonButtonStyles,
+        isChatOpen,
+        chatButtonDisabled,
+        mobileView,
+        toggleChat,
+        unreadChatMessagesCount,
+        isOnHold
+    ]);
     const callControlOptionsFromProps = useMemo(() => (Object.assign({}, (typeof props.callControls === 'object' ? props.callControls : {}))), [props.callControls]);
     const injectedCustomButtonsFromProps = useMemo(() => {
         var _a;
-        /* @conditional-compile-remove(control-bar-button-injection) */
         return [...((_a = callControlOptionsFromProps.onFetchCustomButtonProps) !== null && _a !== void 0 ? _a : [])];
-        return [];
     }, [callControlOptionsFromProps]);
     const callCompositeOptions = useMemo(() => ({
-        callControls: props.callControls === false ? false : Object.assign(Object.assign({}, callControlOptionsFromProps), { onFetchCustomButtonProps: [...(showChatButton ? [customChatButton] : []), /* @conditional-compile-remove(control-bar-button-injection) */
-                ...injectedCustomButtonsFromProps], legacyControlBarExperience: false }),
+        callControls: props.callControls === false
+            ? false
+            : Object.assign(Object.assign({}, callControlOptionsFromProps), { onFetchCustomButtonProps: [
+                    ...(showChatButton ? [customChatButton] : []),
+                    ...injectedCustomButtonsFromProps
+                ], legacyControlBarExperience: false }),
         /* @conditional-compile-remove(call-readiness) */
         deviceChecks: props.deviceChecks,
         /* @conditional-compile-remove(call-readiness) */
@@ -114,33 +130,60 @@ const CallWithChatScreen = (props) => {
         /* @conditional-compile-remove(unsupported-browser) */
         onEnvironmentInfoTroubleshootingClick: props.onEnvironmentInfoTroubleshootingClick,
         remoteVideoTileMenuOptions: props.remoteVideoTileMenuOptions,
-        /* @conditional-compile-remove(gallery-layouts) */
         galleryOptions: props.galleryOptions,
-        /* @conditional-compile-remove(click-to-call) */
         localVideoTile: props.localVideoTile,
+        /* @conditional-compile-remove(end-of-call-survey) */
+        surveyOptions: surveyOptions,
         /* @conditional-compile-remove(custom-branding) */
         branding: {
             logo: props.logo,
             backgroundImage: props.backgroundImage
-        }
-    }), [props.callControls, callControlOptionsFromProps, showChatButton, customChatButton, injectedCustomButtonsFromProps, /* @conditional-compile-remove(call-readiness) */
-        props.deviceChecks, /* @conditional-compile-remove(unsupported-browser) */
-        props.onEnvironmentInfoTroubleshootingClick, /* @conditional-compile-remove(call-readiness) */
-        props.onNetworkingTroubleShootingClick, /* @conditional-compile-remove(call-readiness) */
-        props.onPermissionsTroubleshootingClick, /* @conditional-compile-remove(gallery-layouts) */
-        props.galleryOptions, /* @conditional-compile-remove(click-to-call) */
-        props.localVideoTile, props.remoteVideoTileMenuOptions, /* @conditional-compile-remove(custom-branding) */
-        props.logo, /* @conditional-compile-remove(custom-branding) */
-        props.backgroundImage]);
-    const onRenderChatContent = useCallback(() => React.createElement(ChatComposite, { adapter: chatAdapter, fluentTheme: theme, options: {
+        },
+        /* @conditional-compile-remove(spotlight) */
+        spotlight: props.spotlight
+    }), [
+        props.callControls,
+        callControlOptionsFromProps,
+        showChatButton,
+        customChatButton,
+        injectedCustomButtonsFromProps,
+        /* @conditional-compile-remove(call-readiness) */
+        props.deviceChecks,
+        /* @conditional-compile-remove(unsupported-browser) */
+        props.onEnvironmentInfoTroubleshootingClick,
+        /* @conditional-compile-remove(call-readiness) */
+        props.onNetworkingTroubleShootingClick,
+        /* @conditional-compile-remove(call-readiness) */
+        props.onPermissionsTroubleshootingClick,
+        props.galleryOptions,
+        props.localVideoTile,
+        props.remoteVideoTileMenuOptions,
+        /* @conditional-compile-remove(end-of-call-survey) */
+        surveyOptions,
+        /* @conditional-compile-remove(custom-branding) */
+        props.logo,
+        /* @conditional-compile-remove(custom-branding) */
+        props.backgroundImage,
+        /* @conditional-compile-remove(spotlight) */
+        props.spotlight
+    ]);
+    const onRenderChatContent = useCallback(() => (React.createElement(ChatComposite, { adapter: chatAdapter, fluentTheme: theme, options: {
             topic: false,
             /* @conditional-compile-remove(chat-composite-participant-pane) */
             participantPane: false,
             /* @conditional-compile-remove(file-sharing) */
             fileSharing: props.fileSharing
-        }, onFetchAvatarPersonaData: props.onFetchAvatarPersonaData }), [chatAdapter, /* @conditional-compile-remove(file-sharing) */ props.fileSharing, props.onFetchAvatarPersonaData, theme]);
-    const sidePaneHeaderRenderer = useCallback(() => { var _a; return React.createElement(SidePaneHeader, { headingText: callWithChatStrings.chatPaneTitle, onClose: closeChat, dismissSidePaneButtonAriaLabel: (_a = callWithChatStrings.dismissSidePaneButtonLabel) !== null && _a !== void 0 ? _a : '', mobileView: mobileView }); }, [callWithChatStrings.chatPaneTitle, callWithChatStrings.dismissSidePaneButtonLabel, closeChat, mobileView]);
-    const sidePaneContentRenderer = useMemo(() => hasJoinedCall ? onRenderChatContent : undefined, [hasJoinedCall, onRenderChatContent]);
+        }, onFetchAvatarPersonaData: props.onFetchAvatarPersonaData })), [
+        chatAdapter,
+        /* @conditional-compile-remove(file-sharing) */ props.fileSharing,
+        props.onFetchAvatarPersonaData,
+        theme
+    ]);
+    const sidePaneHeaderRenderer = useCallback(() => {
+        var _a;
+        return (React.createElement(SidePaneHeader, { headingText: callWithChatStrings.chatPaneTitle, onClose: closeChat, dismissSidePaneButtonAriaLabel: (_a = callWithChatStrings.dismissSidePaneButtonLabel) !== null && _a !== void 0 ? _a : '', mobileView: mobileView }));
+    }, [callWithChatStrings.chatPaneTitle, callWithChatStrings.dismissSidePaneButtonLabel, closeChat, mobileView]);
+    const sidePaneContentRenderer = useMemo(() => (hasJoinedCall ? onRenderChatContent : undefined), [hasJoinedCall, onRenderChatContent]);
     const sidePaneRenderer = useMemo(() => ({
         contentRenderer: sidePaneContentRenderer,
         headerRenderer: sidePaneHeaderRenderer,
@@ -164,11 +207,11 @@ const CallWithChatScreen = (props) => {
             callAdapter.off('callEnded', closeChat);
         };
     }, [callAdapter, closeChat]);
-    return React.createElement("div", { ref: containerRef, className: mergeStyles(containerDivStyles) },
+    return (React.createElement("div", { ref: containerRef, className: mergeStyles(containerDivStyles) },
         React.createElement(Stack, { verticalFill: true, grow: true, styles: compositeOuterContainerStyles, id: compositeParentDivId },
             React.createElement(Stack, { horizontal: true, grow: true },
                 React.createElement(Stack.Item, { grow: true, styles: callCompositeContainerStyles(mobileView) },
-                    React.createElement(CallCompositeInner, Object.assign({}, props, { formFactor: formFactor, options: callCompositeOptions, adapter: callAdapter, fluentTheme: fluentTheme, callInvitationUrl: props.joinInvitationURL, overrideSidePane: overrideSidePaneProps, onSidePaneIdChange: onSidePaneIdChange, mobileChatTabHeader: chatTabHeaderProps, onCloseChatPane: closeChat }))))));
+                    React.createElement(CallCompositeInner, Object.assign({}, props, { formFactor: formFactor, options: callCompositeOptions, adapter: callAdapter, fluentTheme: fluentTheme, callInvitationUrl: props.joinInvitationURL, overrideSidePane: overrideSidePaneProps, onSidePaneIdChange: onSidePaneIdChange, mobileChatTabHeader: chatTabHeaderProps, onCloseChatPane: closeChat })))))));
 };
 /**
  * CallWithChatComposite brings together key components to provide a full call with chat experience out of the box.
@@ -178,18 +221,26 @@ const CallWithChatScreen = (props) => {
 export const CallWithChatComposite = (props) => {
     var _a, _b;
     const { adapter, fluentTheme, rtl, formFactor, joinInvitationURL, options } = props;
-    return React.createElement(BaseProvider, { fluentTheme: fluentTheme, rtl: rtl, locale: props.locale, icons: props.icons },
+    return (React.createElement(BaseProvider, { fluentTheme: fluentTheme, rtl: rtl, locale: props.locale, icons: props.icons },
         React.createElement(CallWithChatScreen, Object.assign({}, props, { 
-            /* @conditional-compile-remove(call-readiness) */ deviceChecks: options === null || options === void 0 ? void 0 : options.deviceChecks, callWithChatAdapter: adapter, formFactor: formFactor, callControls: options === null || options === void 0 ? void 0 : options.callControls, joinInvitationURL: joinInvitationURL, fluentTheme: fluentTheme, remoteVideoTileMenuOptions: options === null || options === void 0 ? void 0 : options.remoteVideoTileMenuOptions, 
-            /* @conditional-compile-remove(file-sharing) */ fileSharing: options === null || options === void 0 ? void 0 : options.fileSharing, 
-            /* @conditional-compile-remove(click-to-call) */ localVideoTile: options === null || options === void 0 ? void 0 : options.localVideoTile, 
-            /* @conditional-compile-remove(gallery-layouts) */ galleryOptions: options === null || options === void 0 ? void 0 : options.galleryOptions, 
-            /* @conditional-compile-remove(custom-branding) */ logo: (_a = options === null || options === void 0 ? void 0 : options.branding) === null || _a === void 0 ? void 0 : _a.logo, 
-            /* @conditional-compile-remove(custom-branding) */ backgroundImage: (_b = options === null || options === void 0 ? void 0 : options.branding) === null || _b === void 0 ? void 0 : _b.backgroundImage })));
+            /* @conditional-compile-remove(call-readiness) */
+            deviceChecks: options === null || options === void 0 ? void 0 : options.deviceChecks, callWithChatAdapter: adapter, formFactor: formFactor, callControls: options === null || options === void 0 ? void 0 : options.callControls, joinInvitationURL: joinInvitationURL, fluentTheme: fluentTheme, remoteVideoTileMenuOptions: options === null || options === void 0 ? void 0 : options.remoteVideoTileMenuOptions, 
+            /* @conditional-compile-remove(file-sharing) */
+            fileSharing: options === null || options === void 0 ? void 0 : options.fileSharing, localVideoTile: options === null || options === void 0 ? void 0 : options.localVideoTile, galleryOptions: options === null || options === void 0 ? void 0 : options.galleryOptions, 
+            /* @conditional-compile-remove(custom-branding) */
+            logo: (_a = options === null || options === void 0 ? void 0 : options.branding) === null || _a === void 0 ? void 0 : _a.logo, 
+            /* @conditional-compile-remove(custom-branding) */
+            backgroundImage: (_b = options === null || options === void 0 ? void 0 : options.branding) === null || _b === void 0 ? void 0 : _b.backgroundImage, 
+            /* @conditional-compile-remove(end-of-call-survey) */
+            surveyOptions: options === null || options === void 0 ? void 0 : options.surveyOptions, 
+            /* @conditional-compile-remove(spotlight) */
+            spotlight: options === null || options === void 0 ? void 0 : options.spotlight }))));
 };
 const hasJoinedCallFn = (page, callStatus) => {
     /* @conditional-compile-remove(one-to-n-calling) */ /* @conditional-compile-remove(one-to-n-calling) */
-    return page === 'call' && (callStatus === 'Connected' || callStatus === 'RemoteHold' || callStatus === 'Disconnecting') || page === 'hold' && (callStatus === 'LocalHold' || callStatus === 'Disconnecting');
+    return ((page === 'call' &&
+        (callStatus === 'Connected' || callStatus === 'RemoteHold' || callStatus === 'Disconnecting')) ||
+        (page === 'hold' && (callStatus === 'LocalHold' || callStatus === 'Disconnecting')));
     return page === 'call' && (callStatus === 'Connected' || callStatus === 'Disconnecting');
 };
 const checkShowChatButton = (callControls) => {