@azure/communication-react 1.16.0 → 1.17.0-alpha-202405150013

package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/ChatButton/NotificationIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationIcon.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/CallWithChatComposite/ChatButton/NotificationIcon.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAqC,eAAe,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAS5G;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,KAA4B,EAAe,EAAE;IAC5E,MAAM,EACJ,iBAAiB,EACjB,KAAK,EACN,GAAG,KAAK,CAAC;IACV,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,YAAY,GAAG,CAAC,gBAAwB,EAAe,EAAE;QAC7D,IAAI,gBAAgB,GAAG,CAAC,EAAE,CAAC;YACzB,OAAO,yCAAK,CAAC;QACf,CAAC;aAAM,CAAC;YACN,MAAM,oBAAoB,GAAG,gBAAgB,GAAG,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC;YAC5E,OAAO,oBAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,gBAAc,oBAAoB,GAAG,CAAC,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE,CAAC,EAAE,MAAM,EAAE,sBAAsB,CAAC,KAAK,CAAC,IAC/G,oBAAoB,CAChB,CAAC;QACZ,CAAC;IACH,CAAC,CAAC;IACF,OAAO,oBAAC,KAAK,kBAAY,kDAAkD,EAAC,eAAe,EAAC,QAAQ,EAAC,aAAa,EAAC,QAAQ,EAAC,MAAM,EAAE,+BAA+B,CAAC,KAAK,CAAC;QACtK,oBAAC,KAAK,QAAE,YAAY,CAAC,iBAAiB,CAAC,CAAS,CAC1C,CAAC;AACb,CAAC,CAAC;AACF,MAAM,0BAA0B,GAAG,KAAK,CAAC;AACzC,MAAM,mBAAmB,GAAG,CAAC,CAAC;AAC9B,MAAM,+BAA+B,GAAG,eAAe,CAAC,CAAC,KAAa,EAAe,EAAE,CAAC,CAAC;IACvF,IAAI,EAAE;QACJ,YAAY,EAAE,GAAG,mBAAmB,KAAK;QACzC,qDAAqD;QACrD,MAAM,EAAE,GAAG,mBAAmB,KAAK;QACnC,QAAQ,EAAE,GAAG,mBAAmB,KAAK;QACrC,sIAAsI;QACtI,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;QACtC,MAAM,EAAE,uBAAuB;QAC/B,gCAAgC;QAChC,OAAO,EAAE,GAAG,0BAA0B,KAAK;QAC3C,kEAAkE;QAClE,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,IAAI,GAAG,GAAG,0BAA0B,GAAG,CAAC,KAAK;QAClD,IAAI,EAAE,GAAG,GAAG,GAAG,0BAA0B,GAAG,CAAC,KAAK;KACnD;CACF,CAAC,CAAC,CAAC;AACJ,MAAM,sBAAsB,GAAG,eAAe,CAAC,CAAC,KAAa,EAAgB,EAAE,CAAC,CAAC;IAC/E,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;QACd,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ;KACtC;CACF,CAAC,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { IIconStyles, IStackStyles, ITheme, memoizeFunction, Stack, useTheme, Text } from '@fluentui/react';\n\n/**\n * @private\n */\nexport type NotificationIconProps = {\n  chatMessagesCount: number;\n  label?: string;\n};\n/**\n * @private\n */\nexport const NotificationIcon = (props: NotificationIconProps): JSX.Element => {\n  const {\n    chatMessagesCount,\n    label\n  } = props;\n  const theme = useTheme();\n  const renderNumber = (numberOfMessages: number): JSX.Element => {\n    if (numberOfMessages < 1) {\n      return <></>;\n    } else {\n      const textNumberOfMessages = numberOfMessages < 9 ? numberOfMessages : '9+';\n      return <Text role={'status'} aria-label={textNumberOfMessages + (label ?? '')} styles={notificationTextStyles(theme)}>\n          {textNumberOfMessages}\n        </Text>;\n    }\n  };\n  return <Stack data-ui-id=\"call-with-chat-composite-chat-button-unread-icon\" horizontalAlign=\"center\" verticalAlign=\"center\" styles={notificationIconContainerStyles(theme)}>\n      <Stack>{renderNumber(chatMessagesCount)}</Stack>\n    </Stack>;\n};\nconst notificationIconPaddingREM = 0.225;\nconst notificationSizeREM = 1;\nconst notificationIconContainerStyles = memoizeFunction((theme: ITheme): IIconStyles => ({\n  root: {\n    borderRadius: `${notificationSizeREM}rem`,\n    // Create a css circle. This should match the height.\n    height: `${notificationSizeREM}rem`,\n    minWidth: `${notificationSizeREM}rem`,\n    // use min-width over width as we want to extend the width of the notification icon when contents is more than one character (e.g. 9+)\n    background: theme.palette.themePrimary,\n    border: `0.0625rem solid white`,\n    // border should always be white\n    padding: `${notificationIconPaddingREM}rem`,\n    // positioning to place the badge within the button appropriately.\n    position: 'absolute',\n    top: `-${0.5 - notificationIconPaddingREM / 2}rem`,\n    left: `${0.5 + notificationIconPaddingREM / 2}rem`\n  }\n}));\nconst notificationTextStyles = memoizeFunction((theme: ITheme): IStackStyles => ({\n  root: {\n    color: 'white',\n    fontSize: theme.fonts.xSmall.fontSize\n  }\n}));"]}
+{"version":3,"file":"NotificationIcon.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallWithChatComposite/ChatButton/NotificationIcon.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAqC,eAAe,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAS5G;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,KAA4B,EAAe,EAAE;IAC5E,MAAM,EAAE,iBAAiB,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAC3C,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,YAAY,GAAG,CAAC,gBAAwB,EAAe,EAAE;QAC7D,IAAI,gBAAgB,GAAG,CAAC,EAAE,CAAC;YACzB,OAAO,yCAAK,CAAC;QACf,CAAC;aAAM,CAAC;YACN,MAAM,oBAAoB,GAAG,gBAAgB,GAAG,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC;YAC5E,OAAO,CACL,oBAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,gBAAc,oBAAoB,GAAG,CAAC,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE,CAAC,EAAE,MAAM,EAAE,sBAAsB,CAAC,KAAK,CAAC,IAC1G,oBAAoB,CAChB,CACR,CAAC;QACJ,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,KAAK,kBACO,kDAAkD,EAC7D,eAAe,EAAC,QAAQ,EACxB,aAAa,EAAC,QAAQ,EACtB,MAAM,EAAE,+BAA+B,CAAC,KAAK,CAAC;QAE9C,oBAAC,KAAK,QAAE,YAAY,CAAC,iBAAiB,CAAC,CAAS,CAC1C,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,0BAA0B,GAAG,KAAK,CAAC;AACzC,MAAM,mBAAmB,GAAG,CAAC,CAAC;AAE9B,MAAM,+BAA+B,GAAG,eAAe,CACrD,CAAC,KAAa,EAAe,EAAE,CAAC,CAAC;IAC/B,IAAI,EAAE;QACJ,YAAY,EAAE,GAAG,mBAAmB,KAAK,EAAE,qDAAqD;QAChG,MAAM,EAAE,GAAG,mBAAmB,KAAK;QACnC,QAAQ,EAAE,GAAG,mBAAmB,KAAK,EAAE,sIAAsI;QAC7K,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;QACtC,MAAM,EAAE,uBAAuB,EAAE,gCAAgC;QACjE,OAAO,EAAE,GAAG,0BAA0B,KAAK;QAE3C,kEAAkE;QAClE,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,IAAI,GAAG,GAAG,0BAA0B,GAAG,CAAC,KAAK;QAClD,IAAI,EAAE,GAAG,GAAG,GAAG,0BAA0B,GAAG,CAAC,KAAK;KACnD;CACF,CAAC,CACH,CAAC;AAEF,MAAM,sBAAsB,GAAG,eAAe,CAC5C,CAAC,KAAa,EAAgB,EAAE,CAAC,CAAC;IAChC,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;QACd,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ;KACtC;CACF,CAAC,CACH,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { IIconStyles, IStackStyles, ITheme, memoizeFunction, Stack, useTheme, Text } from '@fluentui/react';\n\n/**\n * @private\n */\nexport type NotificationIconProps = {\n  chatMessagesCount: number;\n  label?: string;\n};\n/**\n * @private\n */\nexport const NotificationIcon = (props: NotificationIconProps): JSX.Element => {\n  const { chatMessagesCount, label } = props;\n  const theme = useTheme();\n  const renderNumber = (numberOfMessages: number): JSX.Element => {\n    if (numberOfMessages < 1) {\n      return <></>;\n    } else {\n      const textNumberOfMessages = numberOfMessages < 9 ? numberOfMessages : '9+';\n      return (\n        <Text role={'status'} aria-label={textNumberOfMessages + (label ?? '')} styles={notificationTextStyles(theme)}>\n          {textNumberOfMessages}\n        </Text>\n      );\n    }\n  };\n\n  return (\n    <Stack\n      data-ui-id=\"call-with-chat-composite-chat-button-unread-icon\"\n      horizontalAlign=\"center\"\n      verticalAlign=\"center\"\n      styles={notificationIconContainerStyles(theme)}\n    >\n      <Stack>{renderNumber(chatMessagesCount)}</Stack>\n    </Stack>\n  );\n};\n\nconst notificationIconPaddingREM = 0.225;\nconst notificationSizeREM = 1;\n\nconst notificationIconContainerStyles = memoizeFunction(\n  (theme: ITheme): IIconStyles => ({\n    root: {\n      borderRadius: `${notificationSizeREM}rem`, // Create a css circle. This should match the height.\n      height: `${notificationSizeREM}rem`,\n      minWidth: `${notificationSizeREM}rem`, // use min-width over width as we want to extend the width of the notification icon when contents is more than one character (e.g. 9+)\n      background: theme.palette.themePrimary,\n      border: `0.0625rem solid white`, // border should always be white\n      padding: `${notificationIconPaddingREM}rem`,\n\n      // positioning to place the badge within the button appropriately.\n      position: 'absolute',\n      top: `-${0.5 - notificationIconPaddingREM / 2}rem`,\n      left: `${0.5 + notificationIconPaddingREM / 2}rem`\n    }\n  })\n);\n\nconst notificationTextStyles = memoizeFunction(\n  (theme: ITheme): IStackStyles => ({\n    root: {\n      color: 'white',\n      fontSize: theme.fonts.xSmall.fontSize\n    }\n  })\n);\n"]}

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

@@ -17,7 +17,7 @@ export const useUnreadMessagesTracker = (chatAdapter, isChatPaneVisible, isChatI
         // Increment unread messages when a new message is received and the chat pane is closed
         const incrementUnreadChatMessagesCount = (event) => {
             if (!isChatPaneVisible && validNewChatMessage(event.message)) {
-                setUnreadChatMessages(prevUnreadChatMessages => {
+                setUnreadChatMessages((prevUnreadChatMessages) => {
                     const newUnreadChatMessages = new Set(prevUnreadChatMessages);
                     newUnreadChatMessages.add(event.message.id);
                     return newUnreadChatMessages;
@@ -27,7 +27,7 @@ export const useUnreadMessagesTracker = (chatAdapter, isChatPaneVisible, isChatI
         // Decrement unread messages when a message is deleted and the chat pane is closed
         const decrementUnreadChatMessagesCount = (event) => {
             if (!isChatPaneVisible) {
-                setUnreadChatMessages(prevUnreadChatMessages => {
+                setUnreadChatMessages((prevUnreadChatMessages) => {
                     const newUnreadChatMessages = new Set(prevUnreadChatMessages);
                     newUnreadChatMessages.delete(event.message.id);
                     return newUnreadChatMessages;

package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/ChatButton/useUnreadMessagesTracker.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUnreadMessagesTracker.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/CallWithChatComposite/ChatButton/useUnreadMessagesTracker.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAI5C;;;GAGG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,WAAwB,EAAE,iBAA0B,EAAE,eAAwB,EAAU,EAAE;IACjI,sCAAsC;IACtC,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAc,IAAI,GAAG,EAAE,CAAC,CAAC;IACrF,SAAS,CAAC,GAAG,EAAE;QACb,iDAAiD;QACjD,IAAI,iBAAiB,IAAI,CAAC,eAAe,EAAE,CAAC;YAC1C,qBAAqB,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;YACjC,OAAO;QACT,CAAC;QAED,uFAAuF;QACvF,MAAM,gCAAgC,GAAG,CAAC,KAEzC,EAAQ,EAAE;YACT,IAAI,CAAC,iBAAiB,IAAI,mBAAmB,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC;gBAC7D,qBAAqB,CAAC,sBAAsB,CAAC,EAAE;oBAC7C,MAAM,qBAAqB,GAAG,IAAI,GAAG,CAAC,sBAAsB,CAAC,CAAC;oBAC9D,qBAAqB,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;oBAC5C,OAAO,qBAAqB,CAAC;gBAC/B,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QAEF,kFAAkF;QAClF,MAAM,gCAAgC,GAAG,CAAC,KAEzC,EAAQ,EAAE;YACT,IAAI,CAAC,iBAAiB,EAAE,CAAC;gBACvB,qBAAqB,CAAC,sBAAsB,CAAC,EAAE;oBAC7C,MAAM,qBAAqB,GAAG,IAAI,GAAG,CAAC,sBAAsB,CAAC,CAAC;oBAC9D,qBAAqB,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;oBAC/C,OAAO,qBAAqB,CAAC;gBAC/B,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QACF,WAAW,CAAC,EAAE,CAAC,iBAAiB,EAAE,gCAAgC,CAAC,CAAC;QACpE,WAAW,CAAC,EAAE,CAAC,gBAAgB,EAAE,gCAAgC,CAAC,CAAC;QACnE,OAAO,GAAG,EAAE;YACV,WAAW,CAAC,GAAG,CAAC,iBAAiB,EAAE,gCAAgC,CAAC,CAAC;YACrE,WAAW,CAAC,GAAG,CAAC,gBAAgB,EAAE,gCAAgC,CAAC,CAAC;QACtE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,eAAe,CAAC,CAAC,CAAC;IAC7E,OAAO,kBAAkB,CAAC,IAAI,CAAC;AACjC,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,mBAAmB,GAAG,CAAC,OAAoB,EAAW,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,IAAI,CAAC,OAAO,CAAC,IAAI,KAAK,MAAM,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { useEffect, useState } from 'react';\nimport { ChatAdapter } from '../../ChatComposite/adapter/ChatAdapter';\nimport { ChatMessage } from '@azure/communication-chat';\n\n/**\n * Used by the CallWithChatComposite to track unread messages for showing as a badge on the Chat Button.\n * @private\n */\nexport const useUnreadMessagesTracker = (chatAdapter: ChatAdapter, isChatPaneVisible: boolean, isChatInitiazed: boolean): number => {\n  // Store messageIds of unread messages\n  const [unreadChatMessages, setUnreadChatMessages] = useState<Set<string>>(new Set());\n  useEffect(() => {\n    // Clear unread messages when chat pane is opened\n    if (isChatPaneVisible || !isChatInitiazed) {\n      setUnreadChatMessages(new Set());\n      return;\n    }\n\n    // Increment unread messages when a new message is received and the chat pane is closed\n    const incrementUnreadChatMessagesCount = (event: {\n      message: ChatMessage;\n    }): void => {\n      if (!isChatPaneVisible && validNewChatMessage(event.message)) {\n        setUnreadChatMessages(prevUnreadChatMessages => {\n          const newUnreadChatMessages = new Set(prevUnreadChatMessages);\n          newUnreadChatMessages.add(event.message.id);\n          return newUnreadChatMessages;\n        });\n      }\n    };\n\n    // Decrement unread messages when a message is deleted and the chat pane is closed\n    const decrementUnreadChatMessagesCount = (event: {\n      message: ChatMessage;\n    }): void => {\n      if (!isChatPaneVisible) {\n        setUnreadChatMessages(prevUnreadChatMessages => {\n          const newUnreadChatMessages = new Set(prevUnreadChatMessages);\n          newUnreadChatMessages.delete(event.message.id);\n          return newUnreadChatMessages;\n        });\n      }\n    };\n    chatAdapter.on('messageReceived', incrementUnreadChatMessagesCount);\n    chatAdapter.on('messageDeleted', decrementUnreadChatMessagesCount);\n    return () => {\n      chatAdapter.off('messageReceived', incrementUnreadChatMessagesCount);\n      chatAdapter.off('messageDeleted', decrementUnreadChatMessagesCount);\n    };\n  }, [chatAdapter, setUnreadChatMessages, isChatPaneVisible, isChatInitiazed]);\n  return unreadChatMessages.size;\n};\n\n/**\n * Helper function to determine if the message in the event is a valid one from a user.\n * Display name is used since system messages will not have one.\n */\nconst validNewChatMessage = (message: ChatMessage): boolean => !!message.senderDisplayName && (message.type === 'text' || message.type === 'html');"]}
+{"version":3,"file":"useUnreadMessagesTracker.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallWithChatComposite/ChatButton/useUnreadMessagesTracker.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAI5C;;;GAGG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,CACtC,WAAwB,EACxB,iBAA0B,EAC1B,eAAwB,EAChB,EAAE;IACV,sCAAsC;IACtC,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAc,IAAI,GAAG,EAAE,CAAC,CAAC;IAErF,SAAS,CAAC,GAAG,EAAE;QACb,iDAAiD;QACjD,IAAI,iBAAiB,IAAI,CAAC,eAAe,EAAE,CAAC;YAC1C,qBAAqB,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;YACjC,OAAO;QACT,CAAC;QAED,uFAAuF;QACvF,MAAM,gCAAgC,GAAG,CAAC,KAA+B,EAAQ,EAAE;YACjF,IAAI,CAAC,iBAAiB,IAAI,mBAAmB,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC;gBAC7D,qBAAqB,CAAC,CAAC,sBAAsB,EAAE,EAAE;oBAC/C,MAAM,qBAAqB,GAAG,IAAI,GAAG,CAAC,sBAAsB,CAAC,CAAC;oBAC9D,qBAAqB,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;oBAC5C,OAAO,qBAAqB,CAAC;gBAC/B,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QAEF,kFAAkF;QAClF,MAAM,gCAAgC,GAAG,CAAC,KAA+B,EAAQ,EAAE;YACjF,IAAI,CAAC,iBAAiB,EAAE,CAAC;gBACvB,qBAAqB,CAAC,CAAC,sBAAsB,EAAE,EAAE;oBAC/C,MAAM,qBAAqB,GAAG,IAAI,GAAG,CAAC,sBAAsB,CAAC,CAAC;oBAC9D,qBAAqB,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;oBAC/C,OAAO,qBAAqB,CAAC;gBAC/B,CAAC,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QAEF,WAAW,CAAC,EAAE,CAAC,iBAAiB,EAAE,gCAAgC,CAAC,CAAC;QACpE,WAAW,CAAC,EAAE,CAAC,gBAAgB,EAAE,gCAAgC,CAAC,CAAC;QAEnE,OAAO,GAAG,EAAE;YACV,WAAW,CAAC,GAAG,CAAC,iBAAiB,EAAE,gCAAgC,CAAC,CAAC;YACrE,WAAW,CAAC,GAAG,CAAC,gBAAgB,EAAE,gCAAgC,CAAC,CAAC;QACtE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,eAAe,CAAC,CAAC,CAAC;IAE7E,OAAO,kBAAkB,CAAC,IAAI,CAAC;AACjC,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,mBAAmB,GAAG,CAAC,OAAoB,EAAW,EAAE,CAC5D,CAAC,CAAC,OAAO,CAAC,iBAAiB,IAAI,CAAC,OAAO,CAAC,IAAI,KAAK,MAAM,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { useEffect, useState } from 'react';\nimport { ChatAdapter } from '../../ChatComposite/adapter/ChatAdapter';\nimport { ChatMessage } from '@azure/communication-chat';\n\n/**\n * Used by the CallWithChatComposite to track unread messages for showing as a badge on the Chat Button.\n * @private\n */\nexport const useUnreadMessagesTracker = (\n  chatAdapter: ChatAdapter,\n  isChatPaneVisible: boolean,\n  isChatInitiazed: boolean\n): number => {\n  // Store messageIds of unread messages\n  const [unreadChatMessages, setUnreadChatMessages] = useState<Set<string>>(new Set());\n\n  useEffect(() => {\n    // Clear unread messages when chat pane is opened\n    if (isChatPaneVisible || !isChatInitiazed) {\n      setUnreadChatMessages(new Set());\n      return;\n    }\n\n    // Increment unread messages when a new message is received and the chat pane is closed\n    const incrementUnreadChatMessagesCount = (event: { message: ChatMessage }): void => {\n      if (!isChatPaneVisible && validNewChatMessage(event.message)) {\n        setUnreadChatMessages((prevUnreadChatMessages) => {\n          const newUnreadChatMessages = new Set(prevUnreadChatMessages);\n          newUnreadChatMessages.add(event.message.id);\n          return newUnreadChatMessages;\n        });\n      }\n    };\n\n    // Decrement unread messages when a message is deleted and the chat pane is closed\n    const decrementUnreadChatMessagesCount = (event: { message: ChatMessage }): void => {\n      if (!isChatPaneVisible) {\n        setUnreadChatMessages((prevUnreadChatMessages) => {\n          const newUnreadChatMessages = new Set(prevUnreadChatMessages);\n          newUnreadChatMessages.delete(event.message.id);\n          return newUnreadChatMessages;\n        });\n      }\n    };\n\n    chatAdapter.on('messageReceived', incrementUnreadChatMessagesCount);\n    chatAdapter.on('messageDeleted', decrementUnreadChatMessagesCount);\n\n    return () => {\n      chatAdapter.off('messageReceived', incrementUnreadChatMessagesCount);\n      chatAdapter.off('messageDeleted', decrementUnreadChatMessagesCount);\n    };\n  }, [chatAdapter, setUnreadChatMessages, isChatPaneVisible, isChatInitiazed]);\n\n  return unreadChatMessages.size;\n};\n\n/**\n * Helper function to determine if the message in the event is a valid one from a user.\n * Display name is used since system messages will not have one.\n */\nconst validNewChatMessage = (message: ChatMessage): boolean =>\n  !!message.senderDisplayName && (message.type === 'text' || message.type === 'html');\n"]}

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

@@ -130,6 +130,10 @@ export interface CallWithChatCompositeStrings {
      * Label for button to copy invite link when it has been actioned
      */
     copyInviteLinkButtonActionedLabel: string;
+    /**
+     * Label for button to open dialpad
+     */
+    openDialpadButtonLabel: string;
     /**
      * Label for SidePaneHeader dismiss button
      */
@@ -142,6 +146,34 @@ export interface CallWithChatCompositeStrings {
      * Aria label string for return to call back button
      */
     returnToCallButtonAriaLabel?: string;
+    /**
+     * Label for add people dropdown
+     */
+    peoplePaneAddPeopleButtonLabel: string;
+    /**
+     * Label for button to start a call
+     */
+    dialpadStartCallButtonLabel: string;
+    /**
+     * Title for dialpad Modal
+     */
+    dialpadModalTitle: string;
+    /**
+     * Aria Label for dialpad Modal
+     */
+    dialpadModalAriaLabel: string;
+    /**
+     * Aria Label for dialpad Modal close button
+     */
+    dialpadCloseModalButtonAriaLabel: string;
+    /**
+     * Placeholder text for dtmf dialpad
+     */
+    dtmfDialpadPlaceholderText: string;
+    /**
+     * Label for the button to open dtmf dialpad
+     */
+    openDtmfDialpadLabel: string;
     /**
      * aria label for when the invite link has been actioned
      */

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

@@ -1 +1 @@
-{"version":3,"file":"Strings.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/CallWithChatComposite/Strings.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/**\n * Strings used by the {@link CallWithChatComposite} directly.\n *\n * This strings are in addition to those used by the components from the component library.\n *\n * @public\n */\nexport interface CallWithChatCompositeStrings {\n  /**\n   * {@link CallWithChatComposite} control bar People button label\n   */\n  peopleButtonLabel: string;\n  /**\n   * {@link CallWithChatComposite} control bar People button label when checked\n   */\n  selectedPeopleButtonLabel: string;\n  /**\n   * {@link CallWithChatComposite} aria label for control bar People button when unchecked\n   */\n  peopleButtonTooltipOpenAriaLabel: string;\n  /**\n   * {@link CallWithChatComposite} aria label for control bar People button when checked\n   */\n  peopleButtonTooltipCloseAriaLabel: string;\n  /**\n   * {@link CallWithChatComposite} control bar People button ToolTipContent\n   */\n  peopleButtonTooltipOpen: string;\n  /**\n   * {@link CallWithChatComposite} control bar People button ToolTipContent\n   */\n  peopleButtonTooltipClose: string;\n  /**\n   * {@link CallWithChatComposite} control bar Chat button label.\n   */\n  chatButtonLabel: string;\n  /**\n   * {@Link CallWithChatComposite} control bar Chat button ToolTipContent.\n   */\n  chatButtonTooltipOpen: string;\n  /**\n   * {@Link CallWithChatComposite} control bar Chat button ToolTipContent.\n   */\n  chatButtonTooltipClose: string;\n  /**\n   * {@link CallWithChatComposite} control bar Chat button enhanced tooltip string.\n   */\n  chatButtonTooltipClosedWithMessageCount: string;\n  /**\n   * Title for the audio device selection sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true` and when no speakers are available.\n   */\n  moreDrawerAudioDeviceMenuTitle?: string;\n  /**\n   * Title for the microphone selection sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true` and when speakers are available.\n   */\n  moreDrawerMicrophoneMenuTitle: string;\n  /**\n   * Title for the speaker selection sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true`.\n   */\n  moreDrawerSpeakerMenuTitle: string;\n  /**\n   * Title for the captions sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true`.\n   */\n  moreDrawerCaptionsMenuTitle: string;\n  /**\n   * Title for the spoken language sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true`.\n   */\n  moreDrawerSpokenLanguageMenuTitle: string;\n  /**\n   * Title for the caption language sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true`.\n   */\n  moreDrawerCaptionLanguageMenuTitle: string;\n  /**\n   * Title for the gallery options sub-menu in the more button drawer.\n   */\n  moreDrawerGalleryOptionsMenuTitle: string;\n  /**\n   * {@Link CallWithChatComposite} control bar More button label\n   */\n  moreDrawerButtonLabel: string;\n  /**\n   * {@Link CallWithChatComposite} control bar More button tooltip content\n   */\n  moreDrawerButtonTooltip: string;\n  /**\n   * Side pane People section Title.\n   */\n  peoplePaneTitle: string;\n  /**\n   * Side pane People section subheader.\n   */\n  peoplePaneSubTitle: string;\n  /**\n   * Side pane Chat screen title.\n   */\n  chatPaneTitle: string;\n  /**\n   * New Message label for chat button with notification icon component.\n   */\n  chatButtonNewMessageNotificationLabel: string;\n  /**\n   * Aria label for the picture in picture in picture tile that.\n   * This feature currently only shows on mobileView when the chat or people pane is expanded.\n   * @remarks\n   * This component displays the local and most-dominant remote participant and when clicked\n   * returns the user to the call screen.\n   */\n  pictureInPictureTileAriaLabel: string;\n  /**\n   * Label for menu item to remove participant\n   */\n  removeMenuLabel: string;\n  /**\n   * Label for button to copy invite link\n   */\n  copyInviteLinkButtonLabel: string;\n  /**\n   * Label for button to copy invite link when it has been actioned\n   */\n  copyInviteLinkButtonActionedLabel: string;\n  /**\n   * Label for SidePaneHeader dismiss button\n   */\n  dismissSidePaneButtonLabel?: string;\n  /**\n   * Aria Description string for return to call button\n   */\n  returnToCallButtonAriaDescription?: string;\n  /**\n   * Aria label string for return to call back button\n   */\n  returnToCallButtonAriaLabel?: string;\n  /**\n   * aria label for when the invite link has been actioned\n   */\n  copyInviteLinkActionedAriaLabel: string;\n}"]}
+{"version":3,"file":"Strings.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallWithChatComposite/Strings.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/**\n * Strings used by the {@link CallWithChatComposite} directly.\n *\n * This strings are in addition to those used by the components from the component library.\n *\n * @public\n */\nexport interface CallWithChatCompositeStrings {\n  /**\n   * {@link CallWithChatComposite} control bar People button label\n   */\n  peopleButtonLabel: string;\n  /**\n   * {@link CallWithChatComposite} control bar People button label when checked\n   */\n  selectedPeopleButtonLabel: string;\n  /**\n   * {@link CallWithChatComposite} aria label for control bar People button when unchecked\n   */\n  peopleButtonTooltipOpenAriaLabel: string;\n  /**\n   * {@link CallWithChatComposite} aria label for control bar People button when checked\n   */\n  peopleButtonTooltipCloseAriaLabel: string;\n  /**\n   * {@link CallWithChatComposite} control bar People button ToolTipContent\n   */\n  peopleButtonTooltipOpen: string;\n  /**\n   * {@link CallWithChatComposite} control bar People button ToolTipContent\n   */\n  peopleButtonTooltipClose: string;\n  /**\n   * {@link CallWithChatComposite} control bar Chat button label.\n   */\n  chatButtonLabel: string;\n  /**\n   * {@Link CallWithChatComposite} control bar Chat button ToolTipContent.\n   */\n  chatButtonTooltipOpen: string;\n  /**\n   * {@Link CallWithChatComposite} control bar Chat button ToolTipContent.\n   */\n  chatButtonTooltipClose: string;\n  /**\n   * {@link CallWithChatComposite} control bar Chat button enhanced tooltip string.\n   */\n  chatButtonTooltipClosedWithMessageCount: string;\n  /**\n   * Title for the audio device selection sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true` and when no speakers are available.\n   */\n  moreDrawerAudioDeviceMenuTitle?: string;\n  /**\n   * Title for the microphone selection sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true` and when speakers are available.\n   */\n  moreDrawerMicrophoneMenuTitle: string;\n  /**\n   * Title for the speaker selection sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true`.\n   */\n  moreDrawerSpeakerMenuTitle: string;\n  /**\n   * Title for the captions sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true`.\n   */\n  moreDrawerCaptionsMenuTitle: string;\n  /**\n   * Title for the spoken language sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true`.\n   */\n  moreDrawerSpokenLanguageMenuTitle: string;\n  /**\n   * Title for the caption language sub-menu in more button drawer.\n   *\n   * Only used with `mobileView` set to `true`.\n   */\n  moreDrawerCaptionLanguageMenuTitle: string;\n  /**\n   * Title for the gallery options sub-menu in the more button drawer.\n   */\n  moreDrawerGalleryOptionsMenuTitle: string;\n  /**\n   * {@Link CallWithChatComposite} control bar More button label\n   */\n  moreDrawerButtonLabel: string;\n  /**\n   * {@Link CallWithChatComposite} control bar More button tooltip content\n   */\n  moreDrawerButtonTooltip: string;\n  /**\n   * Side pane People section Title.\n   */\n  peoplePaneTitle: string;\n  /**\n   * Side pane People section subheader.\n   */\n  peoplePaneSubTitle: string;\n  /**\n   * Side pane Chat screen title.\n   */\n  chatPaneTitle: string;\n  /**\n   * New Message label for chat button with notification icon component.\n   */\n  chatButtonNewMessageNotificationLabel: string;\n  /**\n   * Aria label for the picture in picture in picture tile that.\n   * This feature currently only shows on mobileView when the chat or people pane is expanded.\n   * @remarks\n   * This component displays the local and most-dominant remote participant and when clicked\n   * returns the user to the call screen.\n   */\n  pictureInPictureTileAriaLabel: string;\n  /**\n   * Label for menu item to remove participant\n   */\n  removeMenuLabel: string;\n  /**\n   * Label for button to copy invite link\n   */\n  copyInviteLinkButtonLabel: string;\n  /**\n   * Label for button to copy invite link when it has been actioned\n   */\n  copyInviteLinkButtonActionedLabel: string;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * Label for button to open dialpad\n   */\n  openDialpadButtonLabel: string;\n  /**\n   * Label for SidePaneHeader dismiss button\n   */\n  dismissSidePaneButtonLabel?: string;\n  /**\n   * Aria Description string for return to call button\n   */\n  returnToCallButtonAriaDescription?: string;\n  /**\n   * Aria label string for return to call back button\n   */\n  returnToCallButtonAriaLabel?: string;\n\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * Label for add people dropdown\n   */\n  peoplePaneAddPeopleButtonLabel: string;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * Label for button to start a call\n   */\n  dialpadStartCallButtonLabel: string;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * Title for dialpad Modal\n   */\n  dialpadModalTitle: string;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * Aria Label for dialpad Modal\n   */\n  dialpadModalAriaLabel: string;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * Aria Label for dialpad Modal close button\n   */\n  dialpadCloseModalButtonAriaLabel: string;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * Placeholder text for dtmf dialpad\n   */\n  dtmfDialpadPlaceholderText: string;\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * Label for the button to open dtmf dialpad\n   */\n  openDtmfDialpadLabel: string;\n  /**\n   * aria label for when the invite link has been actioned\n   */\n  copyInviteLinkActionedAriaLabel: string;\n}\n"]}

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

@@ -2,15 +2,19 @@ import { AudioDeviceInfo, Call, CallAgent, GroupCallLocator, PermissionConstrain
 import { TeamsMeetingIdLocator } from '@azure/communication-calling';
 import { Reaction } from '@azure/communication-calling';
 import { StartCaptionsOptions } from '@azure/communication-calling';
+import { AddPhoneNumberOptions } from '@azure/communication-calling';
 import { DtmfTone } from '@azure/communication-calling';
 import { CreateVideoStreamViewResult, VideoStreamOptions } from "../../../../../react-components/src";
+import { MessageOptions } from "../../../../../acs-ui-common/src";
 import { ParticipantsJoinedListener, ParticipantsLeftListener, IsMutedChangedListener, CallIdChangedListener, IsLocalScreenSharingActiveChangedListener, DisplayNameChangedListener, IsSpeakingChangedListener, CallAdapter, CallEndedListener } from '../../CallComposite';
 import { MessageReceivedListener, MessageReadListener, ChatAdapter, ParticipantsRemovedListener, ParticipantsAddedListener, MessageEditedListener, MessageDeletedListener } from '../../ChatComposite';
 import { ResourceDetails } from '../../ChatComposite';
 import { CallWithChatAdapter, ChatInitializedListener } from './CallWithChatAdapter';
 import { CallWithChatAdapterState } from '../state/CallWithChatAdapterState';
 import { CommunicationTokenCredential, CommunicationUserIdentifier } from '@azure/communication-common';
+import { CommunicationIdentifier, PhoneNumberIdentifier } from '@azure/communication-common';
 import { AdapterError } from '../../common/adapters';
+import { CallParticipantsLocator } from '../../CallComposite/adapter/AzureCommunicationCallAdapter';
 import { CallAdapterLocator } from '../../CallComposite/adapter/AzureCommunicationCallAdapter';
 import { StatefulCallClient } from "../../../../../calling-stateful-client/src";
 import { StatefulChatClient } from "../../../../../chat-stateful-client/src";
@@ -61,7 +65,7 @@ export declare class AzureCommunicationCallWithChatAdapter implements CallWithCh
     /** Dispose of the current CallWithChatAdapter. */
     dispose(): void;
     /** Remove a participant from the Call only. */
-    removeParticipant(userId: string): Promise<void>;
+    removeParticipant(userId: string | /* @conditional-compile-remove(PSTN-calls) */ CommunicationIdentifier): Promise<void>;
     setCamera(device: VideoDeviceInfo, options?: VideoStreamOptions): Promise<void>;
     /** Set the microphone to be used in the Call. */
     setMicrophone(device: AudioDeviceInfo): Promise<void>;
@@ -105,7 +109,7 @@ export declare class AzureCommunicationCallWithChatAdapter implements CallWithCh
     /** Fetch initial Call and Chat data such as chat messages. */
     fetchInitialData(): Promise<void>;
     /** Send a chat message. */
-    sendMessage(content: string): Promise<void>;
+    sendMessage(content: string, options?: MessageOptions): Promise<void>;
     /** Send a chat read receipt. */
     sendReadReceipt(chatMessageId: string): Promise<void>;
     /** Send an isTyping indicator. */
@@ -113,12 +117,17 @@ export declare class AzureCommunicationCallWithChatAdapter implements CallWithCh
     /** Load previous Chat messages. */
     loadPreviousChatMessages(messagesToLoad: number): Promise<boolean>;
     /** Update an existing message. */
-    updateMessage(messageId: string, content: string, metadata?: Record<string, string>, options?: {}): Promise<void>;
+    updateMessage(messageId: string, content: string, options?: Record<string, string> | /* @conditional-compile-remove(attachment-upload) */ MessageOptions): Promise<void>;
     /** Delete an existing message. */
     deleteMessage(messageId: string): Promise<void>;
     downloadResourceToCache(resourceDetails: ResourceDetails): Promise<void>;
     removeResourceFromCache(resourceDetails: ResourceDetails): void;
+    holdCall(): Promise<void>;
+    resumeCall(): Promise<void>;
+    addParticipant(participant: PhoneNumberIdentifier, options?: AddPhoneNumberOptions): Promise<void>;
+    addParticipant(participant: CommunicationUserIdentifier): Promise<void>;
     sendDtmfTone(dtmfTone: DtmfTone): Promise<void>;
+    allowUnsupportedBrowserVersion(): void;
     startCaptions(options?: StartCaptionsOptions): Promise<void>;
     stopCaptions(): Promise<void>;
     setCaptionLanguage(language: string): Promise<void>;
@@ -217,7 +226,8 @@ export declare class TeamsMeetingLinkProvider implements ChatThreadProvider {
     private callAdapterPromise;
     /** @conditional-compile-remove(meeting-id) */
     private callAdapterSubscription?;
-    constructor(locator: TeamsMeetingLinkLocator, /** @conditional-compile-remove(meeting-id) */ callAdapterPromise: Promise<CallAdapter>);
+    constructor(locator: TeamsMeetingLinkLocator, 
+    /** @conditional-compile-remove(meeting-id) */ callAdapterPromise: Promise<CallAdapter>);
     isCallInfoRequired(): boolean;
     getChatThread(): string;
     getChatThreadPromise(): Promise<string>;
@@ -252,7 +262,7 @@ export type CommunicationAdapter = CallAndChatProvider | TeamsMeetingLinkProvide
  */
 export interface CallAndChatLocator {
     /** Locator used by {@link createAzureCommunicationCallWithChatAdapter} to locate the call to join */
-    callLocator: GroupCallLocator;
+    callLocator: GroupCallLocator | /* @conditional-compile-remove(teams-adhoc-call) */ CallParticipantsLocator;
     /** Chat thread ID used by {@link createAzureCommunicationCallWithChatAdapter} to locate the chat thread to join */
     chatThreadId: string;
 }
@@ -267,6 +277,7 @@ export type AzureCommunicationCallWithChatAdapterArgs = {
     displayName: string;
     credential: CommunicationTokenCredential;
     locator: CallAndChatLocator | TeamsMeetingLinkLocator | /** @conditional-compile-remove(meeting-id) */ TeamsMeetingIdLocator;
+    alternateCallerId?: string;
     callAdapterOptions?: AzureCommunicationCallAdapterOptions;
 };
 /**
@@ -275,7 +286,7 @@ export type AzureCommunicationCallWithChatAdapterArgs = {
  *
  * @public
  */
-export declare const createAzureCommunicationCallWithChatAdapter: ({ userId, displayName, credential, endpoint, locator, callAdapterOptions }: AzureCommunicationCallWithChatAdapterArgs) => Promise<CallWithChatAdapter>;
+export declare const createAzureCommunicationCallWithChatAdapter: ({ userId, displayName, credential, endpoint, locator, alternateCallerId, callAdapterOptions }: AzureCommunicationCallWithChatAdapterArgs) => Promise<CallWithChatAdapter>;
 /**
  * A custom React hook to simplify the creation of {@link CallWithChatAdapter}.
  *
@@ -290,7 +301,7 @@ export declare const createAzureCommunicationCallWithChatAdapter: ({ userId, dis
  *
  * @public
  */
-export declare const useAzureCommunicationCallWithChatAdapter: (args: Partial<AzureCommunicationCallWithChatAdapterArgs>, afterCreate?: ((adapter: CallWithChatAdapter) => Promise<CallWithChatAdapter>) | undefined, beforeDispose?: ((adapter: CallWithChatAdapter) => Promise<void>) | undefined) => CallWithChatAdapter | undefined;
+export declare const useAzureCommunicationCallWithChatAdapter: (args: Partial<AzureCommunicationCallWithChatAdapterArgs>, afterCreate?: (adapter: CallWithChatAdapter) => Promise<CallWithChatAdapter>, beforeDispose?: (adapter: CallWithChatAdapter) => Promise<void>) => CallWithChatAdapter | undefined;
 /**
  * Arguments for {@link createAzureCommunicationCallWithChatAdapterFromClient}
  *

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

@@ -12,10 +12,13 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { callWithChatAdapterStateFromBackingStates, mergeCallAdapterStateIntoCallWithChatAdapterState, mergeChatAdapterStateIntoCallWithChatAdapterState } from '../state/CallWithChatAdapterState';
 import { _createAzureCommunicationChatAdapterInner, _createLazyAzureCommunicationChatAdapterInner, createAzureCommunicationChatAdapterFromClient } from '../../ChatComposite/adapter/AzureCommunicationChatAdapter';
 import { EventEmitter } from 'events';
+/* @conditional-compile-remove(PSTN-calls) */
+import { isCommunicationUserIdentifier } from '@azure/communication-common';
 import { getChatThreadFromTeamsLink } from './parseTeamsUrl';
 import { _createAzureCommunicationCallAdapterInner } from '../../CallComposite/adapter/AzureCommunicationCallAdapter';
 import { createAzureCommunicationCallAdapterFromClient } from '../../CallComposite/adapter/AzureCommunicationCallAdapter';
 import { useEffect, useRef, useState } from 'react';
+import { _toCommunicationIdentifier } from "../../../../../acs-ui-common/src";
 /** Context of Call with Chat, which is a centralized context for all state updates */
 class CallWithChatContext {
     constructor(clientState, maxListeners = 50) {
@@ -71,7 +74,7 @@ export class AzureCommunicationCallWithChatAdapter {
         this.onCallStateChange = onCallStateChange;
     }
     setChatAdapterPromise(chatAdapter) {
-        chatAdapter.then(adapter => {
+        chatAdapter.then((adapter) => {
             if (!this.isAdapterDisposed) {
                 this.updateChatAdapter(adapter);
             }
@@ -122,7 +125,15 @@ export class AzureCommunicationCallWithChatAdapter {
         this.off.bind(this);
         this.downloadResourceToCache = this.downloadResourceToCache.bind(this);
         this.removeResourceFromCache = this.removeResourceFromCache.bind(this);
+        /* @conditional-compile-remove(PSTN-calls) */
+        this.holdCall.bind(this);
+        /* @conditional-compile-remove(PSTN-calls) */
+        this.resumeCall.bind(this);
+        /* @conditional-compile-remove(PSTN-calls) */
+        this.addParticipant.bind(this);
         this.sendDtmfTone.bind(this);
+        /* @conditional-compile-remove(unsupported-browser) */
+        this.allowUnsupportedBrowserVersion.bind(this);
         this.startCaptions.bind(this);
         this.stopCaptions.bind(this);
         this.setSpokenLanguage.bind(this);
@@ -191,6 +202,8 @@ export class AzureCommunicationCallWithChatAdapter {
     removeParticipant(userId) {
         return __awaiter(this, void 0, void 0, function* () {
             let participant = userId;
+            /* @conditional-compile-remove(PSTN-calls) */
+            participant = _toCommunicationIdentifier(userId);
             yield this.callAdapter.removeParticipant(participant);
         });
     }
@@ -321,23 +334,25 @@ export class AzureCommunicationCallWithChatAdapter {
     /** Fetch initial Call and Chat data such as chat messages. */
     fetchInitialData() {
         return __awaiter(this, void 0, void 0, function* () {
-            return yield this.executeWithResolvedChatAdapter(adapter => {
+            return yield this.executeWithResolvedChatAdapter((adapter) => {
                 return adapter.fetchInitialData();
             });
         });
     }
     /** Send a chat message. */
-    sendMessage(content) {
+    sendMessage(content, 
+    /* @conditional-compile-remove(attachment-upload) */
+    options) {
         return __awaiter(this, void 0, void 0, function* () {
-            return yield this.executeWithResolvedChatAdapter(adapter => {
-                return adapter.sendMessage(content);
+            return yield this.executeWithResolvedChatAdapter((adapter) => {
+                return adapter.sendMessage(content, /* @conditional-compile-remove(attachment-upload) */ options);
             });
         });
     }
     /** Send a chat read receipt. */
     sendReadReceipt(chatMessageId) {
         return __awaiter(this, void 0, void 0, function* () {
-            return yield this.executeWithResolvedChatAdapter(adapter => {
+            return yield this.executeWithResolvedChatAdapter((adapter) => {
                 return adapter.sendReadReceipt(chatMessageId);
             });
         });
@@ -345,7 +360,7 @@ export class AzureCommunicationCallWithChatAdapter {
     /** Send an isTyping indicator. */
     sendTypingIndicator() {
         return __awaiter(this, void 0, void 0, function* () {
-            return yield this.executeWithResolvedChatAdapter(adapter => {
+            return yield this.executeWithResolvedChatAdapter((adapter) => {
                 return adapter.sendTypingIndicator();
             });
         });
@@ -353,44 +368,71 @@ export class AzureCommunicationCallWithChatAdapter {
     /** Load previous Chat messages. */
     loadPreviousChatMessages(messagesToLoad) {
         return __awaiter(this, void 0, void 0, function* () {
-            return yield this.executeWithResolvedChatAdapter(adapter => {
+            return yield this.executeWithResolvedChatAdapter((adapter) => {
                 return adapter.loadPreviousChatMessages(messagesToLoad);
             });
         });
     }
     /** Update an existing message. */
-    updateMessage(messageId, content, metadata, options) {
+    updateMessage(messageId, content, options) {
         return __awaiter(this, void 0, void 0, function* () {
-            return this.executeWithResolvedChatAdapter(adapter => {
-                return adapter.updateMessage(messageId, content, metadata);
+            return this.executeWithResolvedChatAdapter((adapter) => {
+                return adapter.updateMessage(messageId, content, options);
             });
         });
     }
     /** Delete an existing message. */
     deleteMessage(messageId) {
         return __awaiter(this, void 0, void 0, function* () {
-            return yield this.executeWithResolvedChatAdapter(adapter => {
+            return yield this.executeWithResolvedChatAdapter((adapter) => {
                 return adapter.deleteMessage(messageId);
             });
         });
     }
     downloadResourceToCache(resourceDetails) {
         return __awaiter(this, void 0, void 0, function* () {
-            this.executeWithResolvedChatAdapter(adapter => {
+            this.executeWithResolvedChatAdapter((adapter) => {
                 adapter.downloadResourceToCache(resourceDetails);
             });
         });
     }
     removeResourceFromCache(resourceDetails) {
-        this.executeWithResolvedChatAdapter(adapter => {
+        this.executeWithResolvedChatAdapter((adapter) => {
             adapter.removeResourceFromCache(resourceDetails);
         });
     }
+    /* @conditional-compile-remove(PSTN-calls) */
+    holdCall() {
+        return __awaiter(this, void 0, void 0, function* () {
+            return yield this.callAdapter.holdCall();
+        });
+    }
+    /* @conditional-compile-remove(PSTN-calls) */
+    resumeCall() {
+        return __awaiter(this, void 0, void 0, function* () {
+            return yield this.callAdapter.resumeCall();
+        });
+    }
+    /* @conditional-compile-remove(PSTN-calls) */
+    addParticipant(participant, options) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (isCommunicationUserIdentifier(participant)) {
+                return yield this.callAdapter.addParticipant(participant);
+            }
+            else {
+                return yield this.callAdapter.addParticipant(participant, options);
+            }
+        });
+    }
     sendDtmfTone(dtmfTone) {
         return __awaiter(this, void 0, void 0, function* () {
             return yield this.callAdapter.sendDtmfTone(dtmfTone);
         });
     }
+    /* @conditional-compile-remove(unsupported-browser) */
+    allowUnsupportedBrowserVersion() {
+        return this.callAdapter.allowUnsupportedBrowserVersion();
+    }
     startCaptions(options) {
         return __awaiter(this, void 0, void 0, function* () {
             yield this.callAdapter.startCaptions(options);
@@ -497,37 +539,37 @@ export class AzureCommunicationCallWithChatAdapter {
                 this.callAdapter.on('isSpokenLanguageChanged', listener);
                 break;
             case 'messageReceived':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.on('messageReceived', listener);
                 });
                 break;
             case 'messageEdited':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.on('messageEdited', listener);
                 });
                 break;
             case 'messageDeleted':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.on('messageDeleted', listener);
                 });
                 break;
             case 'messageSent':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.on('messageSent', listener);
                 });
                 break;
             case 'messageRead':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.on('messageRead', listener);
                 });
                 break;
             case 'chatParticipantsAdded':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.on('participantsAdded', listener);
                 });
                 break;
             case 'chatParticipantsRemoved':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.on('participantsRemoved', listener);
                 });
                 break;
@@ -535,7 +577,7 @@ export class AzureCommunicationCallWithChatAdapter {
                 this.callAdapter.on('error', listener);
                 break;
             case 'chatError':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.on('error', listener);
                 });
                 break;
@@ -592,37 +634,37 @@ export class AzureCommunicationCallWithChatAdapter {
                 this.callAdapter.off('isSpokenLanguageChanged', listener);
                 break;
             case 'messageReceived':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.off('messageReceived', listener);
                 });
                 break;
             case 'messageEdited':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.off('messageEdited', listener);
                 });
                 break;
             case 'messageDeleted':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.off('messageDeleted', listener);
                 });
                 break;
             case 'messageSent':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.off('messageSent', listener);
                 });
                 break;
             case 'messageRead':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.off('messageRead', listener);
                 });
                 break;
             case 'chatParticipantsAdded':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.off('participantsAdded', listener);
                 });
                 break;
             case 'chatParticipantsRemoved':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.off('participantsRemoved', listener);
                 });
                 break;
@@ -630,7 +672,7 @@ export class AzureCommunicationCallWithChatAdapter {
                 this.callAdapter.off('error', listener);
                 break;
             case 'chatError':
-                this.executeWithResolvedChatAdapter(adapter => {
+                this.executeWithResolvedChatAdapter((adapter) => {
                     adapter.off('error', listener);
                 });
                 break;
@@ -677,7 +719,8 @@ export class CallAndChatProvider {
  * @private
  */
 export class TeamsMeetingLinkProvider {
-    constructor(locator, /** @conditional-compile-remove(meeting-id) */ callAdapterPromise) {
+    constructor(locator, 
+    /** @conditional-compile-remove(meeting-id) */ callAdapterPromise) {
         this.locator = locator;
         /** @conditional-compile-remove(meeting-id) */
         this.callAdapterPromise = callAdapterPromise;
@@ -695,8 +738,8 @@ export class TeamsMeetingLinkProvider {
             /** @conditional-compile-remove(meeting-id) */
             {
                 // Wait for the call to be connected and get the chat thread ID from `call.callInfo`.
-                const chatThreadPromise = new Promise(resolve => {
-                    this.callAdapterPromise.then(callAdapter => {
+                const chatThreadPromise = new Promise((resolve) => {
+                    this.callAdapterPromise.then((callAdapter) => {
                         // Ensure function is idempotent by removing any existing subscription.
                         this.callAdapterSubscription && callAdapter.offStateChange(this.callAdapterSubscription);
                         this.callAdapterSubscription = (state) => {
@@ -739,17 +782,17 @@ export class TeamsMeetingIdProvider {
      */
     getChatThreadPromise() {
         return __awaiter(this, void 0, void 0, function* () {
-            return new Promise(resolve => {
+            return new Promise((resolve) => {
                 const stateChangeListener = (state) => {
                     var _a, _b, _c;
                     if (((_a = state.call) === null || _a === void 0 ? void 0 : _a.state) === 'Connected' && ((_b = state.call.info) === null || _b === void 0 ? void 0 : _b.threadId)) {
-                        this.callAdapter.then(adapter => {
+                        this.callAdapter.then((adapter) => {
                             adapter.offStateChange(stateChangeListener);
                         });
                         resolve((_c = state.call.info) === null || _c === void 0 ? void 0 : _c.threadId);
                     }
                 };
-                this.callAdapter.then(adapter => {
+                this.callAdapter.then((adapter) => {
                     var _a, _b, _c;
                     const callState = (_a = adapter.getState().call) === null || _a === void 0 ? void 0 : _a.state;
                     const threadId = (_c = (_b = adapter.getState().call) === null || _b === void 0 ? void 0 : _b.info) === null || _c === void 0 ? void 0 : _c.threadId;
@@ -770,13 +813,15 @@ export class TeamsMeetingIdProvider {
  *
  * @public
  */
-export const createAzureCommunicationCallWithChatAdapter = (_a) => __awaiter(void 0, [_a], void 0, function* ({ userId, displayName, credential, endpoint, locator, callAdapterOptions }) {
+export const createAzureCommunicationCallWithChatAdapter = (_a) => __awaiter(void 0, [_a], void 0, function* ({ userId, displayName, credential, endpoint, locator, 
+/* @conditional-compile-remove(PSTN-calls) */ alternateCallerId, callAdapterOptions }) {
     const callAdapterLocator = isTeamsMeetingLocator(locator) ? locator : locator.callLocator;
     const callAdapter = _createAzureCommunicationCallAdapterInner({
         userId,
         displayName,
         credential,
         locator: callAdapterLocator,
+        /* @conditional-compile-remove(PSTN-calls) */ alternateCallerId,
         options: callAdapterOptions,
         telemetryImplementationHint: 'CallWithChat'
     });
@@ -806,8 +851,28 @@ export const createAzureCommunicationCallWithChatAdapter = (_a) => __awaiter(voi
  *
  * @public
  */
-export const useAzureCommunicationCallWithChatAdapter = (args, afterCreate, beforeDispose) => {
-    const { credential, displayName, endpoint, locator, userId, callAdapterOptions } = args;
+export const useAzureCommunicationCallWithChatAdapter = (
+/**
+ * Arguments to be passed to {@link createAzureCommunicationCallWithChatAdapter}.
+ *
+ * Allows arguments to be undefined so that you can respect the rule-of-hooks and pass in arguments
+ * as they are created. The adapter is only created when all arguments are defined.
+ */
+args, 
+/**
+ * Optional callback to modify the adapter once it is created.
+ *
+ * If set, must return the modified adapter.
+ */
+afterCreate, 
+/**
+ * Optional callback called before the adapter is disposed.
+ *
+ * This is useful for clean up tasks, e.g., leaving any ongoing calls.
+ */
+beforeDispose) => {
+    const { credential, displayName, endpoint, locator, userId, 
+    /* @conditional-compile-remove(PSTN-calls) */ alternateCallerId, callAdapterOptions } = args;
     // State update needed to rerender the parent component when a new adapter is created.
     const [adapter, setAdapter] = useState(undefined);
     // Ref needed for cleanup to access the old adapter created asynchronously.
@@ -849,6 +914,7 @@ export const useAzureCommunicationCallWithChatAdapter = (args, afterCreate, befo
                 endpoint,
                 locator,
                 userId,
+                /* @conditional-compile-remove(PSTN-calls) */ alternateCallerId,
                 callAdapterOptions
             });
             if (afterCreateRef.current) {
@@ -859,7 +925,18 @@ export const useAzureCommunicationCallWithChatAdapter = (args, afterCreate, befo
         }))();
     }, 
     // Explicitly list all arguments so that caller doesn't have to memoize the `args` object.
-    [adapterRef, afterCreateRef, beforeDisposeRef, credential, displayName, endpoint, locator, userId, callAdapterOptions]);
+    [
+        adapterRef,
+        afterCreateRef,
+        /* @conditional-compile-remove(PSTN-calls) */ alternateCallerId,
+        beforeDisposeRef,
+        credential,
+        displayName,
+        endpoint,
+        locator,
+        userId,
+        callAdapterOptions
+    ]);
     // Dispose any existing adapter when the component unmounts.
     useEffect(() => {
         return () => {