@azure/communication-react 1.4.2-alpha-202211290015.0 → 1.4.2-alpha-202212010027.0

package/dist/dist-esm/react-components/src/components/UnsupportedEnvironment.js

@@ -0,0 +1,29 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+/* @conditional-compile-remove(unsupported-browser) */
+import { Icon, Link, Stack, Text } from '@fluentui/react';
+import React from 'react';
+/* @conditional-compile-remove(unsupported-browser) */
+import { containerStyles, iconStyles, linkTextStyles, mainTextStyles, secondaryTextStyles } from './styles/UnsupportedEnvironment.styles';
+/* @conditional-compile-remove(unsupported-browser) */
+const UnsupportedEnvironmentContainer = (props) => {
+    const { onTroubleshootingClick, strings } = props;
+    return (React.createElement(Stack, { styles: containerStyles },
+        React.createElement(Icon, { styles: iconStyles, iconName: "UnsupportedEnvironmentWarning", "data-ui-id": "unsupported-environment-icon" }),
+        React.createElement(Text, { styles: mainTextStyles }, strings.primaryText),
+        React.createElement(Text, { styles: secondaryTextStyles }, strings.secondaryText),
+        onTroubleshootingClick && (React.createElement(Link, { styles: linkTextStyles, onClick: () => {
+                onTroubleshootingClick();
+            }, "data-ui-id": "unsupported-environment-link" }, strings.moreHelpText))));
+};
+/**
+ * UI to display to the user that the browser they are using is not supported by calling application.
+ *
+ * @private
+ */
+export const UnsupportedEnvironment = (props) => {
+    /* @conditional-compile-remove(unsupported-browser) */
+    return React.createElement(UnsupportedEnvironmentContainer, Object.assign({}, props));
+    return React.createElement(React.Fragment, null);
+};
+//# sourceMappingURL=UnsupportedEnvironment.js.map

package/dist/dist-esm/react-components/src/components/UnsupportedEnvironment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnsupportedEnvironment.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/UnsupportedEnvironment.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,sDAAsD;AACtD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAG1D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,sDAAsD;AACtD,OAAO,EACL,eAAe,EACf,UAAU,EACV,cAAc,EACd,cAAc,EACd,mBAAmB,EACpB,MAAM,wCAAwC,CAAC;AA0BhD,sDAAsD;AACtD,MAAM,+BAA+B,GAAG,CAAC,KAAkC,EAAe,EAAE;IAC1F,MAAM,EAAE,sBAAsB,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAClD,OAAO,CACL,oBAAC,KAAK,IAAC,MAAM,EAAE,eAAe;QAC5B,oBAAC,IAAI,IACH,MAAM,EAAE,UAAU,EAClB,QAAQ,EAAC,+BAA+B,gBAC7B,8BAA8B,GACnC;QACR,oBAAC,IAAI,IAAC,MAAM,EAAE,cAAc,IAAG,OAAO,CAAC,WAAW,CAAQ;QAC1D,oBAAC,IAAI,IAAC,MAAM,EAAE,mBAAmB,IAAG,OAAO,CAAC,aAAa,CAAQ;QAChE,sBAAsB,IAAI,CACzB,oBAAC,IAAI,IACH,MAAM,EAAE,cAAc,EACtB,OAAO,EAAE,GAAG,EAAE;gBACZ,sBAAsB,EAAE,CAAC;YAC3B,CAAC,gBACU,8BAA8B,IAExC,OAAO,CAAC,YAAY,CAChB,CACR,CACK,CACT,CAAC;AACJ,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,KAAkC,EAAe,EAAE;IACxF,sDAAsD;IACtD,OAAO,oBAAC,+BAA+B,oBAAK,KAAK,EAAI,CAAC;IACtD,OAAO,yCAAK,CAAC;AACf,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n/* @conditional-compile-remove(unsupported-browser) */\nimport { Icon, Link, Stack, Text } from '@fluentui/react';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport React from 'react';\n/* @conditional-compile-remove(unsupported-browser) */\nimport {\n  containerStyles,\n  iconStyles,\n  linkTextStyles,\n  mainTextStyles,\n  secondaryTextStyles\n} from './styles/UnsupportedEnvironment.styles';\n\n/**\n * @private\n */\nexport interface UnsupportedEnvironmentStrings {\n  /** String for the primary text */\n  primaryText: string;\n  /** String for the secondary text */\n  secondaryText: string;\n  /** String to display in the text for the help link */\n  moreHelpText: string;\n}\n\n/**\n * props for {@link UnsupportedEnvironment} UI\n *\n * @private\n */\nexport interface UnsupportedEnvironmentProps {\n  /** Handler to perform a action when the help link is actioned */\n  onTroubleshootingClick?: () => void;\n  /** String overrides for the component */\n  strings: UnsupportedEnvironmentStrings;\n}\n\n/* @conditional-compile-remove(unsupported-browser) */\nconst UnsupportedEnvironmentContainer = (props: UnsupportedEnvironmentProps): JSX.Element => {\n  const { onTroubleshootingClick, strings } = props;\n  return (\n    <Stack styles={containerStyles}>\n      <Icon\n        styles={iconStyles}\n        iconName=\"UnsupportedEnvironmentWarning\"\n        data-ui-id=\"unsupported-environment-icon\"\n      ></Icon>\n      <Text styles={mainTextStyles}>{strings.primaryText}</Text>\n      <Text styles={secondaryTextStyles}>{strings.secondaryText}</Text>\n      {onTroubleshootingClick && (\n        <Link\n          styles={linkTextStyles}\n          onClick={() => {\n            onTroubleshootingClick();\n          }}\n          data-ui-id=\"unsupported-environment-link\"\n        >\n          {strings.moreHelpText}\n        </Link>\n      )}\n    </Stack>\n  );\n};\n\n/**\n * UI to display to the user that the browser they are using is not supported by calling application.\n *\n * @private\n */\nexport const UnsupportedEnvironment = (props: UnsupportedEnvironmentProps): JSX.Element => {\n  /* @conditional-compile-remove(unsupported-browser) */\n  return <UnsupportedEnvironmentContainer {...props} />;\n  return <></>;\n};\n\"../../../acs-ui-common/src\""]}

package/dist/dist-esm/react-components/src/components/VideoTile.d.ts

@@ -1,7 +1,8 @@
-import { IStyle, IIconProps } from '@fluentui/react';
+import { IStyle } from '@fluentui/react';
 import React from 'react';
 import { BaseCustomStyles, OnRenderAvatarCallback } from '../types';
 import { ParticipantState } from '../types';
+import { IContextualMenuProps } from '@fluentui/react';
 /**
  * Strings of {@link VideoTile} that can be overridden.
  * @beta
@@ -62,10 +63,6 @@ export interface VideoTileProps {
      * Whether the video is muted or not.
      */
     isMuted?: boolean;
-    /**
-     * Display custom menu items in the VideoTile's contextual menu.
-     */
-    menuItems?: VideoTileMenuItems;
     /**
      * If true, the video tile will show the pin icon.
      */
@@ -104,22 +101,17 @@ export interface VideoTileProps {
      */
     participantState?: ParticipantState;
     strings?: VideoTileStrings;
+    /**
+     * Display custom menu items in the VideoTile's contextual menu.
+     * Uses Fluent UI ContextualMenu.
+     * An ellipses icon will be displayed to open the contextual menu if this prop is defined.
+     */
+    contextualMenu?: IContextualMenuProps;
     /**
      * Callback triggered by video tile on touch and hold.
      */
     onLongTouch?: () => void;
 }
-/**
- * @beta
- * MenuItems to be diplayed in video tile in the contextual/drawer menu
- */
-export declare type VideoTileMenuItems = Array<{
-    key: string;
-    ariaLabel?: string;
-    text: string;
-    onClick: () => void;
-    iconProps: IIconProps;
-}>;
 /**
  * A component to render the video stream for a single call participant.
  *

package/dist/dist-esm/react-components/src/components/VideoTile.js

@@ -2,22 +2,22 @@
 // Licensed under the MIT license.
 import { Icon, mergeStyles, Persona, Stack, Text } from '@fluentui/react';
 /* @conditional-compile-remove(pinned-participants) */
-import { MoreHorizontal20Filled } from '@fluentui/react-icons';
+import { IconButton } from '@fluentui/react';
 import { Ref } from '@fluentui/react-northstar';
 import React, { useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { useIdentifiers } from '../identifiers';
 import { useLocale } from '../localization';
 import { useTheme } from '../theming';
 import { disabledVideoHint, displayNameStyle, iconContainerStyle, overlayContainerStyles, rootStyles, videoContainerStyles, videoHint, tileInfoContainerStyle, participantStateStringStyles } from './styles/VideoTile.styles';
-/* @conditional-compile-remove(pinned-participants) */
-import { pinIconStyle, menuButtonStyles } from './styles/VideoTile.styles';
 import { getVideoTileOverrideColor } from './utils/videoTileStylesUtils';
 /* @conditional-compile-remove(pinned-participants) */
-import { DefaultButton, concatStyleSets, DirectionalHint } from '@fluentui/react';
+import { pinIconStyle } from './styles/VideoTile.styles';
 /* @conditional-compile-remove(pinned-participants) */
-import { mapMenuItemsToContextualMenuItems } from './utils';
+import { DirectionalHint } from '@fluentui/react';
 /* @conditional-compile-remove(pinned-participants) */
 import useLongPress from './utils/useLongPress';
+/* @conditional-compile-remove(pinned-participants) */
+import { moreButtonStyles } from './styles/VideoTile.styles';
 // Coin max size is set to PersonaSize.size100
 const DEFAULT_PERSONA_MAX_SIZE_PX = 100;
 // Coin min size is set PersonaSize.size32
@@ -28,16 +28,24 @@ const DefaultPlaceholder = (props) => {
         React.createElement(Stack, { styles: defaultPersonaStyles },
             React.createElement(Persona, { coinSize: coinSize, hidePersonaDetails: hidePersonaDetails, text: text !== null && text !== void 0 ? text : '', initialsTextColor: "white", "aria-label": noVideoAvailableAriaLabel !== null && noVideoAvailableAriaLabel !== void 0 ? noVideoAvailableAriaLabel : '', showOverflowTooltip: false }))));
 };
-/* @conditional-compile-remove(pinned-participants) */
-const menuIcon = () => React.createElement(MoreHorizontal20Filled, { primaryFill: "currentColor" });
 const defaultPersonaStyles = { root: { margin: 'auto', maxHeight: '100%' } };
 /* @conditional-compile-remove(pinned-participants) */
+const videoTileMoreIconProps = { iconName: 'VideoTileMoreOptions' };
+/* @conditional-compile-remove(pinned-participants) */
+const videoTileMoreMenuIconProps = { iconName: undefined, style: { display: 'none' } };
+/* @conditional-compile-remove(pinned-participants) */
+const videoTileMoreMenuProps = {
+    directionalHint: DirectionalHint.topLeftEdge,
+    isBeakVisible: false,
+    styles: { container: { maxWidth: '8rem' } }
+};
+/* @conditional-compile-remove(pinned-participants) */
 const VideoTileMoreOptionsButton = (props) => {
-    const { menuItems, menuStyles } = props;
-    if (!menuItems || menuItems.length === 0) {
+    const { contextualMenu } = props;
+    if (!contextualMenu) {
         return React.createElement(React.Fragment, null);
     }
-    return (React.createElement(DefaultButton, { styles: concatStyleSets(menuButtonStyles, menuStyles !== null && menuStyles !== void 0 ? menuStyles : {}), onRenderIcon: menuIcon, menuIconProps: { hidden: true }, menuProps: { items: mapMenuItemsToContextualMenuItems(menuItems), directionalHint: DirectionalHint.topRightEdge } }));
+    return (React.createElement(IconButton, { styles: moreButtonStyles, iconProps: videoTileMoreIconProps, menuIconProps: videoTileMoreMenuIconProps, menuProps: Object.assign(Object.assign({}, videoTileMoreMenuProps), contextualMenu) }));
 };
 /**
  * A component to render the video stream for a single call participant.
@@ -49,9 +57,9 @@ const VideoTileMoreOptionsButton = (props) => {
 export const VideoTile = (props) => {
     const { children, displayName, initialsName, isMirrored, isMuted, 
     /* @conditional-compile-remove(pinned-participants) */
-    isPinned, onRenderPlaceholder, renderElement, showLabel = true, showMuteIndicator = true, styles, userId, noVideoAvailableAriaLabel, isSpeaking, 
+    isPinned, onRenderPlaceholder, renderElement, showLabel = true, showMuteIndicator = true, styles, userId, noVideoAvailableAriaLabel, isSpeaking, personaMinSize = DEFAULT_PERSONA_MIN_SIZE_PX, personaMaxSize = DEFAULT_PERSONA_MAX_SIZE_PX, 
     /* @conditional-compile-remove(pinned-participants) */
-    menuItems, personaMinSize = DEFAULT_PERSONA_MIN_SIZE_PX, personaMaxSize = DEFAULT_PERSONA_MAX_SIZE_PX } = props;
+    contextualMenu } = props;
     const [personaSize, setPersonaSize] = useState(100);
     const videoTileRef = useRef(null);
     const locale = useLocale();
@@ -126,7 +134,7 @@ export const VideoTile = (props) => {
                     showMuteIndicator && isMuted && (React.createElement(Stack, { className: mergeStyles(iconContainerStyle) },
                         React.createElement(Icon, { iconName: "VideoTileMicOff" }))),
                     /* @conditional-compile-remove(pinned-participants) */
-                    React.createElement(VideoTileMoreOptionsButton, { menuItems: menuItems, menuStyles: props.styles }),
+                    React.createElement(VideoTileMoreOptionsButton, { contextualMenu: contextualMenu }),
                     /* @conditional-compile-remove(pinned-participants) */
                     isPinned && (React.createElement(Stack, { className: mergeStyles(iconContainerStyle) },
                         React.createElement(Icon, { iconName: "VideoTilePinned", className: mergeStyles(pinIconStyle) })))))),

package/dist/dist-esm/react-components/src/components/VideoTile.js.map

@@ -1 +1 @@
-{"version":3,"file":"VideoTile.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/VideoTile.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { Icon, IStyle, mergeStyles, Persona, Stack, Text, IIconProps } from '@fluentui/react';\n/* @conditional-compile-remove(pinned-participants) */\nimport { MoreHorizontal20Filled } from '@fluentui/react-icons';\nimport { Ref } from '@fluentui/react-northstar';\nimport React, { useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { ComponentLocale, useLocale } from '../localization';\nimport { useTheme } from '../theming';\nimport { BaseCustomStyles, CustomAvatarOptions, OnRenderAvatarCallback } from '../types';\n/* @conditional-compile-remove(one-to-n-calling) */\n/* @conditional-compile-remove(PSTN-calls) */\nimport { ParticipantState } from '../types';\nimport {\n  disabledVideoHint,\n  displayNameStyle,\n  iconContainerStyle,\n  overlayContainerStyles,\n  rootStyles,\n  videoContainerStyles,\n  videoHint,\n  tileInfoContainerStyle,\n  participantStateStringStyles\n} from './styles/VideoTile.styles';\n/* @conditional-compile-remove(pinned-participants) */\nimport { pinIconStyle, menuButtonStyles } from './styles/VideoTile.styles';\nimport { getVideoTileOverrideColor } from './utils/videoTileStylesUtils';\n/* @conditional-compile-remove(pinned-participants) */\nimport { DefaultButton, concatStyleSets, DirectionalHint } from '@fluentui/react';\n/* @conditional-compile-remove(pinned-participants) */\nimport { mapMenuItemsToContextualMenuItems } from './utils';\n/* @conditional-compile-remove(pinned-participants) */\nimport useLongPress from './utils/useLongPress';\n\n/**\n * Strings of {@link VideoTile} that can be overridden.\n * @beta\n */\nexport interface VideoTileStrings {\n  participantStateConnecting: string;\n  participantStateRinging: string;\n  participantStateHold: string;\n}\n\n/**\n * Fluent styles for {@link VideoTile}.\n *\n * @public\n */\nexport interface VideoTileStylesProps extends BaseCustomStyles {\n  /** Styles for video container. */\n  videoContainer?: IStyle;\n  /** Styles for container overlayed on the video container. */\n  overlayContainer?: IStyle;\n  /** Styles for displayName on the video container. */\n  displayNameContainer?: IStyle;\n}\n\n/**\n * Props for {@link VideoTile}.\n *\n * @public\n */\nexport interface VideoTileProps {\n  /** React Child components. Child Components will show as overlay component in the VideoTile. */\n  children?: React.ReactNode;\n  /**\n   * Allows users to pass in an object contains custom CSS styles.\n   * @Example\n   * ```\n   * <VideoTile styles={{ root: { background: 'blue' } }} />\n   * ```\n   */\n  styles?: VideoTileStylesProps;\n  /** user id for the VideoTile placeholder. */\n  userId?: string;\n  /** Component with the video stream. */\n  renderElement?: JSX.Element | null;\n  /** Determines if the video is mirrored or not. */\n  isMirrored?: boolean;\n  /** Custom render Component function for no video is available. Render a Persona Icon if undefined. */\n  onRenderPlaceholder?: OnRenderAvatarCallback;\n  /**\n   * Show label on the VideoTile\n   * @defaultValue true\n   */\n  showLabel?: boolean;\n  /**\n   * Whether to display a mute icon beside the user's display name.\n   * @defaultValue true\n   */\n  showMuteIndicator?: boolean;\n  /**\n   * Whether the video is muted or not.\n   */\n  isMuted?: boolean;\n  /* @conditional-compile-remove(pinned-participants) */\n  /**\n   * Display custom menu items in the VideoTile's contextual menu.\n   */\n  menuItems?: VideoTileMenuItems;\n  /* @conditional-compile-remove(pinned-participants) */\n  /**\n   * If true, the video tile will show the pin icon.\n   */\n  isPinned?: boolean;\n  /**\n   * Display Name of the Participant to be shown in the label.\n   * @remarks `displayName` is used to generate avatar initials if `initialsName` is not provided.\n   */\n  displayName?: string;\n  /**\n   * Name of the participant used to generate initials. For example, a name `John Doe` will display `JD` as initials.\n   * @remarks `displayName` is used if this property is not specified.\n   */\n  initialsName?: string;\n  /**\n   * Minimum size of the persona avatar in px.\n   * The persona avatar is the default placeholder shown when no video stream is available.\n   * For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona\n   * @defaultValue 32px\n   */\n  personaMinSize?: number;\n  /**\n   * Maximum size of the personal avatar in px.\n   * The persona avatar is the default placeholder shown when no video stream is available.\n   * For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona\n   * @defaultValue 100px\n   */\n  personaMaxSize?: number;\n  /** Optional property to set the aria label of the video tile if there is no available stream. */\n  noVideoAvailableAriaLabel?: string;\n  /** Whether the participant in the videoTile is speaking. Shows a speaking indicator (border). */\n  isSpeaking?: boolean;\n\n  /* @conditional-compile-remove(one-to-n-calling) */\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * The call connection state of the participant.\n   * For example, `Hold` means the participant is on hold.\n   */\n  participantState?: ParticipantState;\n  /* @conditional-compile-remove(one-to-n-calling) */\n  /* @conditional-compile-remove(PSTN-calls) */\n  strings?: VideoTileStrings;\n\n  /* @conditional-compile-remove(pinned-participants) */\n  /**\n   * Callback triggered by video tile on touch and hold.\n   */\n  onLongTouch?: () => void;\n}\n\n// Coin max size is set to PersonaSize.size100\nconst DEFAULT_PERSONA_MAX_SIZE_PX = 100;\n// Coin min size is set PersonaSize.size32\nconst DEFAULT_PERSONA_MIN_SIZE_PX = 32;\n\nconst DefaultPlaceholder = (props: CustomAvatarOptions): JSX.Element => {\n  const { text, noVideoAvailableAriaLabel, coinSize, hidePersonaDetails } = props;\n\n  return (\n    <Stack className={mergeStyles({ position: 'absolute', height: '100%', width: '100%' })}>\n      <Stack styles={defaultPersonaStyles}>\n        <Persona\n          coinSize={coinSize}\n          hidePersonaDetails={hidePersonaDetails}\n          text={text ?? ''}\n          initialsTextColor=\"white\"\n          aria-label={noVideoAvailableAriaLabel ?? ''}\n          showOverflowTooltip={false}\n        />\n      </Stack>\n    </Stack>\n  );\n};\n\n/**\n * @beta\n * MenuItems to be diplayed in video tile in the contextual/drawer menu\n */\nexport type VideoTileMenuItems = Array<{\n  key: string;\n  ariaLabel?: string;\n  text: string;\n  onClick: () => void;\n  iconProps: IIconProps;\n}>;\n\n/* @conditional-compile-remove(pinned-participants) */\nconst menuIcon = (): JSX.Element => <MoreHorizontal20Filled primaryFill=\"currentColor\" />;\n\nconst defaultPersonaStyles = { root: { margin: 'auto', maxHeight: '100%' } };\n\n/* @conditional-compile-remove(pinned-participants) */\nconst VideoTileMoreOptionsButton = (props: { menuItems?: VideoTileMenuItems; menuStyles?: IStyle }): JSX.Element => {\n  const { menuItems, menuStyles } = props;\n  if (!menuItems || menuItems.length === 0) {\n    return <></>;\n  }\n  return (\n    <DefaultButton\n      styles={concatStyleSets(menuButtonStyles, menuStyles ?? {})}\n      onRenderIcon={menuIcon}\n      menuIconProps={{ hidden: true }}\n      menuProps={{ items: mapMenuItemsToContextualMenuItems(menuItems), directionalHint: DirectionalHint.topRightEdge }}\n    />\n  );\n};\n\n/**\n * A component to render the video stream for a single call participant.\n *\n * Use with {@link GridLayout} in a {@link VideoGallery}.\n *\n * @public\n */\nexport const VideoTile = (props: VideoTileProps): JSX.Element => {\n  const {\n    children,\n    displayName,\n    initialsName,\n    isMirrored,\n    isMuted,\n    /* @conditional-compile-remove(pinned-participants) */\n    isPinned,\n    onRenderPlaceholder,\n    renderElement,\n    showLabel = true,\n    showMuteIndicator = true,\n    styles,\n    userId,\n    noVideoAvailableAriaLabel,\n    isSpeaking,\n    /* @conditional-compile-remove(pinned-participants) */\n    menuItems,\n    personaMinSize = DEFAULT_PERSONA_MIN_SIZE_PX,\n    personaMaxSize = DEFAULT_PERSONA_MAX_SIZE_PX\n  } = props;\n\n  const [personaSize, setPersonaSize] = useState(100);\n  const videoTileRef = useRef<HTMLElement>(null);\n\n  const locale = useLocale();\n  const theme = useTheme();\n\n  const isVideoRendered = !!renderElement;\n\n  const observer = useRef(\n    new ResizeObserver((entries): void => {\n      const { width, height } = entries[0].contentRect;\n      const personaSize = Math.min(width, height) / 3;\n      setPersonaSize(Math.max(Math.min(personaSize, personaMaxSize), personaMinSize));\n    })\n  );\n\n  useLayoutEffect(() => {\n    if (videoTileRef.current) {\n      observer.current.observe(videoTileRef.current);\n    }\n    const currentObserver = observer.current;\n    return () => currentObserver.disconnect();\n  }, [observer, videoTileRef]);\n\n  /* @conditional-compile-remove(pinned-participants) */\n  const useLongPressProps = useMemo(() => {\n    return {\n      onLongPress: () => {\n        props.onLongTouch?.();\n      },\n      touchEventsOnly: true\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [props.onLongTouch]);\n  /* @conditional-compile-remove(pinned-participants) */\n  const longPressHandlers = useLongPress(useLongPressProps);\n  const longPressHandlersTrampoline = useMemo(() => {\n    /* @conditional-compile-remove(pinned-participants) */\n    return longPressHandlers;\n    return {};\n  }, [\n    /* @conditional-compile-remove(pinned-participants) */\n    longPressHandlers\n  ]);\n\n  const placeholderOptions = {\n    userId,\n    text: initialsName || displayName,\n    noVideoAvailableAriaLabel,\n    coinSize: personaSize,\n    styles: defaultPersonaStyles,\n    hidePersonaDetails: true\n  };\n\n  const videoHintWithBorderRadius = mergeStyles(videoHint, { borderRadius: theme.effects.roundedCorner4 });\n\n  const tileInfoStyle = useMemo(\n    () =>\n      mergeStyles(\n        isVideoRendered ? videoHintWithBorderRadius : disabledVideoHint,\n        getVideoTileOverrideColor(isVideoRendered, theme, 'neutralPrimary'),\n        styles?.displayNameContainer\n      ),\n    [isVideoRendered, videoHintWithBorderRadius, theme, styles?.displayNameContainer]\n  );\n\n  const ids = useIdentifiers();\n\n  const canShowLabel = showLabel && (displayName || (showMuteIndicator && isMuted));\n  const participantStateString = participantStateStringTrampoline(props, locale);\n  return (\n    <Ref innerRef={videoTileRef}>\n      <Stack\n        data-ui-id={ids.videoTile}\n        className={mergeStyles(\n          rootStyles,\n          {\n            background: theme.palette.neutralLighter,\n            borderRadius: theme.effects.roundedCorner4\n          },\n          isSpeaking && {\n            '&::before': {\n              content: `''`,\n              position: 'absolute',\n              zIndex: 1,\n              border: `0.25rem solid ${theme.palette.themePrimary}`,\n              borderRadius: theme.effects.roundedCorner4,\n              width: '100%',\n              height: '100%'\n            }\n          },\n          styles?.root\n        )}\n        {...longPressHandlersTrampoline}\n      >\n        {isVideoRendered ? (\n          <Stack\n            className={mergeStyles(\n              videoContainerStyles,\n              isMirrored && { transform: 'scaleX(-1)' },\n              styles?.videoContainer\n            )}\n          >\n            {renderElement}\n          </Stack>\n        ) : (\n          <Stack className={mergeStyles(videoContainerStyles)} style={{ opacity: participantStateString ? 0.4 : 1 }}>\n            {onRenderPlaceholder ? (\n              onRenderPlaceholder(userId ?? '', placeholderOptions, DefaultPlaceholder)\n            ) : (\n              <DefaultPlaceholder {...placeholderOptions} />\n            )}\n          </Stack>\n        )}\n\n        {(canShowLabel || participantStateString) && (\n          <Stack horizontal className={tileInfoContainerStyle} tokens={tileInfoContainerTokens}>\n            <Stack horizontal className={tileInfoStyle}>\n              {canShowLabel && (\n                <Text\n                  className={mergeStyles(displayNameStyle)}\n                  title={displayName}\n                  style={{ color: participantStateString ? theme.palette.neutralSecondary : 'inherit' }}\n                >\n                  {displayName}\n                </Text>\n              )}\n              {participantStateString && (\n                <Text className={mergeStyles(participantStateStringStyles(theme))}>\n                  {bracketedParticipantString(participantStateString, !!canShowLabel)}\n                </Text>\n              )}\n              {showMuteIndicator && isMuted && (\n                <Stack className={mergeStyles(iconContainerStyle)}>\n                  <Icon iconName=\"VideoTileMicOff\" />\n                </Stack>\n              )}\n              {\n                /* @conditional-compile-remove(pinned-participants) */\n                <VideoTileMoreOptionsButton menuItems={menuItems} menuStyles={props.styles} />\n              }\n              {\n                /* @conditional-compile-remove(pinned-participants) */\n                isPinned && (\n                  <Stack className={mergeStyles(iconContainerStyle)}>\n                    <Icon iconName=\"VideoTilePinned\" className={mergeStyles(pinIconStyle)} />\n                  </Stack>\n                )\n              }\n            </Stack>\n          </Stack>\n        )}\n\n        {children && (\n          <Stack className={mergeStyles(overlayContainerStyles, styles?.overlayContainer)}>{children}</Stack>\n        )}\n      </Stack>\n    </Ref>\n  );\n};\n\nconst participantStateStringTrampoline = (props: VideoTileProps, locale: ComponentLocale): string | undefined => {\n  /* @conditional-compile-remove(one-to-n-calling) */\n  /* @conditional-compile-remove(PSTN-calls) */\n  const strings = { ...locale.strings.videoTile, ...props.strings };\n  /* @conditional-compile-remove(one-to-n-calling) */\n  /* @conditional-compile-remove(PSTN-calls) */\n  return props.participantState === 'Idle' || props.participantState === 'Connecting'\n    ? strings?.participantStateConnecting\n    : props.participantState === 'EarlyMedia' || props.participantState === 'Ringing'\n    ? strings?.participantStateRinging\n    : props.participantState === 'Hold'\n    ? strings?.participantStateHold\n    : undefined;\n\n  return undefined;\n};\n\nconst tileInfoContainerTokens = {\n  // A horizontal Stack sets the left margin to 0 for all it's children.\n  // We need to allow the children to set their own margins\n  childrenGap: 'none'\n};\n\nconst bracketedParticipantString = (participantString: string, withBrackets: boolean): string => {\n  return withBrackets ? `(${participantString})` : participantString;\n};\n"]}
+{"version":3,"file":"VideoTile.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/VideoTile.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { Icon, IStyle, mergeStyles, Persona, Stack, Text } from '@fluentui/react';\n/* @conditional-compile-remove(pinned-participants) */\nimport { IconButton } from '@fluentui/react';\nimport { Ref } from '@fluentui/react-northstar';\nimport React, { useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { ComponentLocale, useLocale } from '../localization';\nimport { useTheme } from '../theming';\nimport { BaseCustomStyles, CustomAvatarOptions, OnRenderAvatarCallback } from '../types';\n/* @conditional-compile-remove(one-to-n-calling) */\n/* @conditional-compile-remove(PSTN-calls) */\nimport { ParticipantState } from '../types';\nimport {\n  disabledVideoHint,\n  displayNameStyle,\n  iconContainerStyle,\n  overlayContainerStyles,\n  rootStyles,\n  videoContainerStyles,\n  videoHint,\n  tileInfoContainerStyle,\n  participantStateStringStyles\n} from './styles/VideoTile.styles';\nimport { getVideoTileOverrideColor } from './utils/videoTileStylesUtils';\n/* @conditional-compile-remove(pinned-participants) */\nimport { pinIconStyle } from './styles/VideoTile.styles';\n/* @conditional-compile-remove(pinned-participants) */\nimport { DirectionalHint, IContextualMenuProps } from '@fluentui/react';\n/* @conditional-compile-remove(pinned-participants) */\nimport useLongPress from './utils/useLongPress';\n/* @conditional-compile-remove(pinned-participants) */\nimport { moreButtonStyles } from './styles/VideoTile.styles';\n\n/**\n * Strings of {@link VideoTile} that can be overridden.\n * @beta\n */\nexport interface VideoTileStrings {\n  participantStateConnecting: string;\n  participantStateRinging: string;\n  participantStateHold: string;\n}\n\n/**\n * Fluent styles for {@link VideoTile}.\n *\n * @public\n */\nexport interface VideoTileStylesProps extends BaseCustomStyles {\n  /** Styles for video container. */\n  videoContainer?: IStyle;\n  /** Styles for container overlayed on the video container. */\n  overlayContainer?: IStyle;\n  /** Styles for displayName on the video container. */\n  displayNameContainer?: IStyle;\n}\n\n/**\n * Props for {@link VideoTile}.\n *\n * @public\n */\nexport interface VideoTileProps {\n  /** React Child components. Child Components will show as overlay component in the VideoTile. */\n  children?: React.ReactNode;\n  /**\n   * Allows users to pass in an object contains custom CSS styles.\n   * @Example\n   * ```\n   * <VideoTile styles={{ root: { background: 'blue' } }} />\n   * ```\n   */\n  styles?: VideoTileStylesProps;\n  /** user id for the VideoTile placeholder. */\n  userId?: string;\n  /** Component with the video stream. */\n  renderElement?: JSX.Element | null;\n  /** Determines if the video is mirrored or not. */\n  isMirrored?: boolean;\n  /** Custom render Component function for no video is available. Render a Persona Icon if undefined. */\n  onRenderPlaceholder?: OnRenderAvatarCallback;\n  /**\n   * Show label on the VideoTile\n   * @defaultValue true\n   */\n  showLabel?: boolean;\n  /**\n   * Whether to display a mute icon beside the user's display name.\n   * @defaultValue true\n   */\n  showMuteIndicator?: boolean;\n  /**\n   * Whether the video is muted or not.\n   */\n  isMuted?: boolean;\n  /* @conditional-compile-remove(pinned-participants) */\n  /**\n   * If true, the video tile will show the pin icon.\n   */\n  isPinned?: boolean;\n  /**\n   * Display Name of the Participant to be shown in the label.\n   * @remarks `displayName` is used to generate avatar initials if `initialsName` is not provided.\n   */\n  displayName?: string;\n  /**\n   * Name of the participant used to generate initials. For example, a name `John Doe` will display `JD` as initials.\n   * @remarks `displayName` is used if this property is not specified.\n   */\n  initialsName?: string;\n  /**\n   * Minimum size of the persona avatar in px.\n   * The persona avatar is the default placeholder shown when no video stream is available.\n   * For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona\n   * @defaultValue 32px\n   */\n  personaMinSize?: number;\n  /**\n   * Maximum size of the personal avatar in px.\n   * The persona avatar is the default placeholder shown when no video stream is available.\n   * For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona\n   * @defaultValue 100px\n   */\n  personaMaxSize?: number;\n  /** Optional property to set the aria label of the video tile if there is no available stream. */\n  noVideoAvailableAriaLabel?: string;\n  /** Whether the participant in the videoTile is speaking. Shows a speaking indicator (border). */\n  isSpeaking?: boolean;\n\n  /* @conditional-compile-remove(one-to-n-calling) */\n  /* @conditional-compile-remove(PSTN-calls) */\n  /**\n   * The call connection state of the participant.\n   * For example, `Hold` means the participant is on hold.\n   */\n  participantState?: ParticipantState;\n  /* @conditional-compile-remove(one-to-n-calling) */\n  /* @conditional-compile-remove(PSTN-calls) */\n  strings?: VideoTileStrings;\n  /* @conditional-compile-remove(pinned-participants) */\n  /**\n   * Display custom menu items in the VideoTile's contextual menu.\n   * Uses Fluent UI ContextualMenu.\n   * An ellipses icon will be displayed to open the contextual menu if this prop is defined.\n   */\n  contextualMenu?: IContextualMenuProps;\n  /* @conditional-compile-remove(pinned-participants) */\n  /**\n   * Callback triggered by video tile on touch and hold.\n   */\n  onLongTouch?: () => void;\n}\n\n// Coin max size is set to PersonaSize.size100\nconst DEFAULT_PERSONA_MAX_SIZE_PX = 100;\n// Coin min size is set PersonaSize.size32\nconst DEFAULT_PERSONA_MIN_SIZE_PX = 32;\n\nconst DefaultPlaceholder = (props: CustomAvatarOptions): JSX.Element => {\n  const { text, noVideoAvailableAriaLabel, coinSize, hidePersonaDetails } = props;\n\n  return (\n    <Stack className={mergeStyles({ position: 'absolute', height: '100%', width: '100%' })}>\n      <Stack styles={defaultPersonaStyles}>\n        <Persona\n          coinSize={coinSize}\n          hidePersonaDetails={hidePersonaDetails}\n          text={text ?? ''}\n          initialsTextColor=\"white\"\n          aria-label={noVideoAvailableAriaLabel ?? ''}\n          showOverflowTooltip={false}\n        />\n      </Stack>\n    </Stack>\n  );\n};\n\nconst defaultPersonaStyles = { root: { margin: 'auto', maxHeight: '100%' } };\n\n/* @conditional-compile-remove(pinned-participants) */\nconst videoTileMoreIconProps = { iconName: 'VideoTileMoreOptions' };\n/* @conditional-compile-remove(pinned-participants) */\nconst videoTileMoreMenuIconProps = { iconName: undefined, style: { display: 'none' } };\n/* @conditional-compile-remove(pinned-participants) */\nconst videoTileMoreMenuProps = {\n  directionalHint: DirectionalHint.topLeftEdge,\n  isBeakVisible: false,\n  styles: { container: { maxWidth: '8rem' } }\n};\n/* @conditional-compile-remove(pinned-participants) */\nconst VideoTileMoreOptionsButton = (props: { contextualMenu?: IContextualMenuProps }): JSX.Element => {\n  const { contextualMenu } = props;\n  if (!contextualMenu) {\n    return <></>;\n  }\n  return (\n    <IconButton\n      styles={moreButtonStyles}\n      iconProps={videoTileMoreIconProps}\n      menuIconProps={videoTileMoreMenuIconProps}\n      menuProps={{ ...videoTileMoreMenuProps, ...contextualMenu }}\n    />\n  );\n};\n\n/**\n * A component to render the video stream for a single call participant.\n *\n * Use with {@link GridLayout} in a {@link VideoGallery}.\n *\n * @public\n */\nexport const VideoTile = (props: VideoTileProps): JSX.Element => {\n  const {\n    children,\n    displayName,\n    initialsName,\n    isMirrored,\n    isMuted,\n    /* @conditional-compile-remove(pinned-participants) */\n    isPinned,\n    onRenderPlaceholder,\n    renderElement,\n    showLabel = true,\n    showMuteIndicator = true,\n    styles,\n    userId,\n    noVideoAvailableAriaLabel,\n    isSpeaking,\n    personaMinSize = DEFAULT_PERSONA_MIN_SIZE_PX,\n    personaMaxSize = DEFAULT_PERSONA_MAX_SIZE_PX,\n    /* @conditional-compile-remove(pinned-participants) */\n    contextualMenu\n  } = props;\n\n  const [personaSize, setPersonaSize] = useState(100);\n  const videoTileRef = useRef<HTMLElement>(null);\n\n  const locale = useLocale();\n  const theme = useTheme();\n\n  const isVideoRendered = !!renderElement;\n\n  const observer = useRef(\n    new ResizeObserver((entries): void => {\n      const { width, height } = entries[0].contentRect;\n      const personaSize = Math.min(width, height) / 3;\n      setPersonaSize(Math.max(Math.min(personaSize, personaMaxSize), personaMinSize));\n    })\n  );\n\n  useLayoutEffect(() => {\n    if (videoTileRef.current) {\n      observer.current.observe(videoTileRef.current);\n    }\n    const currentObserver = observer.current;\n    return () => currentObserver.disconnect();\n  }, [observer, videoTileRef]);\n\n  /* @conditional-compile-remove(pinned-participants) */\n  const useLongPressProps = useMemo(() => {\n    return {\n      onLongPress: () => {\n        props.onLongTouch?.();\n      },\n      touchEventsOnly: true\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [props.onLongTouch]);\n  /* @conditional-compile-remove(pinned-participants) */\n  const longPressHandlers = useLongPress(useLongPressProps);\n  const longPressHandlersTrampoline = useMemo(() => {\n    /* @conditional-compile-remove(pinned-participants) */\n    return longPressHandlers;\n    return {};\n  }, [\n    /* @conditional-compile-remove(pinned-participants) */\n    longPressHandlers\n  ]);\n\n  const placeholderOptions = {\n    userId,\n    text: initialsName || displayName,\n    noVideoAvailableAriaLabel,\n    coinSize: personaSize,\n    styles: defaultPersonaStyles,\n    hidePersonaDetails: true\n  };\n\n  const videoHintWithBorderRadius = mergeStyles(videoHint, { borderRadius: theme.effects.roundedCorner4 });\n\n  const tileInfoStyle = useMemo(\n    () =>\n      mergeStyles(\n        isVideoRendered ? videoHintWithBorderRadius : disabledVideoHint,\n        getVideoTileOverrideColor(isVideoRendered, theme, 'neutralPrimary'),\n        styles?.displayNameContainer\n      ),\n    [isVideoRendered, videoHintWithBorderRadius, theme, styles?.displayNameContainer]\n  );\n\n  const ids = useIdentifiers();\n\n  const canShowLabel = showLabel && (displayName || (showMuteIndicator && isMuted));\n  const participantStateString = participantStateStringTrampoline(props, locale);\n  return (\n    <Ref innerRef={videoTileRef}>\n      <Stack\n        data-ui-id={ids.videoTile}\n        className={mergeStyles(\n          rootStyles,\n          {\n            background: theme.palette.neutralLighter,\n            borderRadius: theme.effects.roundedCorner4\n          },\n          isSpeaking && {\n            '&::before': {\n              content: `''`,\n              position: 'absolute',\n              zIndex: 1,\n              border: `0.25rem solid ${theme.palette.themePrimary}`,\n              borderRadius: theme.effects.roundedCorner4,\n              width: '100%',\n              height: '100%'\n            }\n          },\n          styles?.root\n        )}\n        {...longPressHandlersTrampoline}\n      >\n        {isVideoRendered ? (\n          <Stack\n            className={mergeStyles(\n              videoContainerStyles,\n              isMirrored && { transform: 'scaleX(-1)' },\n              styles?.videoContainer\n            )}\n          >\n            {renderElement}\n          </Stack>\n        ) : (\n          <Stack className={mergeStyles(videoContainerStyles)} style={{ opacity: participantStateString ? 0.4 : 1 }}>\n            {onRenderPlaceholder ? (\n              onRenderPlaceholder(userId ?? '', placeholderOptions, DefaultPlaceholder)\n            ) : (\n              <DefaultPlaceholder {...placeholderOptions} />\n            )}\n          </Stack>\n        )}\n\n        {(canShowLabel || participantStateString) && (\n          <Stack horizontal className={tileInfoContainerStyle} tokens={tileInfoContainerTokens}>\n            <Stack horizontal className={tileInfoStyle}>\n              {canShowLabel && (\n                <Text\n                  className={mergeStyles(displayNameStyle)}\n                  title={displayName}\n                  style={{ color: participantStateString ? theme.palette.neutralSecondary : 'inherit' }}\n                >\n                  {displayName}\n                </Text>\n              )}\n              {participantStateString && (\n                <Text className={mergeStyles(participantStateStringStyles(theme))}>\n                  {bracketedParticipantString(participantStateString, !!canShowLabel)}\n                </Text>\n              )}\n              {showMuteIndicator && isMuted && (\n                <Stack className={mergeStyles(iconContainerStyle)}>\n                  <Icon iconName=\"VideoTileMicOff\" />\n                </Stack>\n              )}\n              {\n                /* @conditional-compile-remove(pinned-participants) */\n                <VideoTileMoreOptionsButton contextualMenu={contextualMenu} />\n              }\n              {\n                /* @conditional-compile-remove(pinned-participants) */\n                isPinned && (\n                  <Stack className={mergeStyles(iconContainerStyle)}>\n                    <Icon iconName=\"VideoTilePinned\" className={mergeStyles(pinIconStyle)} />\n                  </Stack>\n                )\n              }\n            </Stack>\n          </Stack>\n        )}\n\n        {children && (\n          <Stack className={mergeStyles(overlayContainerStyles, styles?.overlayContainer)}>{children}</Stack>\n        )}\n      </Stack>\n    </Ref>\n  );\n};\n\nconst participantStateStringTrampoline = (props: VideoTileProps, locale: ComponentLocale): string | undefined => {\n  /* @conditional-compile-remove(one-to-n-calling) */\n  /* @conditional-compile-remove(PSTN-calls) */\n  const strings = { ...locale.strings.videoTile, ...props.strings };\n  /* @conditional-compile-remove(one-to-n-calling) */\n  /* @conditional-compile-remove(PSTN-calls) */\n  return props.participantState === 'Idle' || props.participantState === 'Connecting'\n    ? strings?.participantStateConnecting\n    : props.participantState === 'EarlyMedia' || props.participantState === 'Ringing'\n    ? strings?.participantStateRinging\n    : props.participantState === 'Hold'\n    ? strings?.participantStateHold\n    : undefined;\n\n  return undefined;\n};\n\nconst tileInfoContainerTokens = {\n  // A horizontal Stack sets the left margin to 0 for all it's children.\n  // We need to allow the children to set their own margins\n  childrenGap: 'none'\n};\n\nconst bracketedParticipantString = (participantString: string, withBrackets: boolean): string => {\n  return withBrackets ? `(${participantString})` : participantString;\n};\n"]}

package/dist/dist-esm/react-components/src/components/index.d.ts

@@ -74,6 +74,8 @@ export { _HighContrastAwareIcon } from './HighContrastAwareIcon';
 export type { _HighContrastAwareIconProps } from './HighContrastAwareIcon';
 export { UnsupportedBrowser } from './UnsupportedBrowser';
 export type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from './UnsupportedBrowser';
+export { UnsupportedBrowserVersion } from './UnsupportedBrowserVersion';
+export type { UnsupportedBrowserVersionStrings, UnsupportedBrowserVersionProps } from './UnsupportedBrowserVersion';
 export { _TroubleshootingGuideErrorBar } from './TroubleshootingGuideErrorBar';
 export type { _TroubleshootingGuideErrorBarStrings, _TroubleshootingGuideErrorBarProps } from './TroubleshootingGuideErrorBar';
 export { _DevicePermissionDropdown } from './DevicePermissions/DevicePermissionDropdown';

package/dist/dist-esm/react-components/src/components/index.js

@@ -41,8 +41,8 @@ export { HoldButton } from './HoldButton';
 export { _LocalVideoTile } from './LocalVideoTile';
 export { _RemoteVideoTile } from './RemoteVideoTile';
 export { _HighContrastAwareIcon } from './HighContrastAwareIcon';
-/* @conditional-compile-remove(unsupported-browser) */
 export { UnsupportedBrowser } from './UnsupportedBrowser';
+export { UnsupportedBrowserVersion } from './UnsupportedBrowserVersion';
 export { _TroubleshootingGuideErrorBar } from './TroubleshootingGuideErrorBar';
 export { _DevicePermissionDropdown } from './DevicePermissions/DevicePermissionDropdown';
 //# sourceMappingURL=index.js.map

package/dist/dist-esm/react-components/src/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAGtC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAKpC,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAWhD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAQpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAI9C,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAGvE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAQ9C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGtD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAQtD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAShD,iDAAiD;AACjD,OAAO,EACL,oCAAoC,EACpC,2BAA2B,EAC3B,uBAAuB,EACxB,MAAM,uCAAuC,CAAC;AAgB/C,iDAAiD;AACjD,OAAO,EAAE,uBAAuB,EAAE,MAAM,6CAA6C,CAAC;AAOtF,iDAAiD;AACjD,OAAO,EAAE,0BAA0B,EAAE,MAAM,gDAAgD,CAAC;AAO5F,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAQ1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAKxC,OAAO,EAAE,0BAA0B,EAAE,MAAM,uDAAuD,CAAC;AAUnG,cAAc,UAAU,CAAC;AAGzB,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AAGpC,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAE7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAG5C,6CAA6C;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI1C,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAGjE,sDAAsD;AACtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAG1D,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAM/E,OAAO,EAAE,yBAAyB,EAAE,MAAM,8CAA8C,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nexport { TypingIndicator } from './TypingIndicator';\nexport type { TypingIndicatorProps, TypingIndicatorStrings, TypingIndicatorStylesProps } from './TypingIndicator';\n\nexport { ErrorBar } from './ErrorBar';\nexport type { ActiveErrorMessage, ErrorBarProps, ErrorBarStrings, ErrorType } from './ErrorBar';\n\nexport { GridLayout } from './GridLayout';\nexport type { GridLayoutProps, GridLayoutStyles } from './GridLayout';\n\nexport { SendBox } from './SendBox';\nexport type { SendBoxProps, SendBoxStrings, SendBoxStylesProps } from './SendBox';\n/* @conditional-compile-remove(file-sharing) */\nexport type { ActiveFileUpload } from './SendBox';\n\nexport { MessageStatusIndicator } from './MessageStatusIndicator';\nexport type { MessageStatusIndicatorProps, MessageStatusIndicatorStrings } from './MessageStatusIndicator';\n\nexport { MessageThread } from './MessageThread';\nexport type {\n  MessageProps,\n  MessageThreadProps,\n  MessageThreadStrings,\n  MessageThreadStyles,\n  JumpToNewMessageButtonProps,\n  MessageRenderer,\n  UpdateMessageCallback\n} from './MessageThread';\n\nexport { StreamMedia } from './StreamMedia';\nexport type { StreamMediaProps } from './StreamMedia';\nexport type { LoadingState } from './StreamMedia';\n\nexport { ParticipantItem } from './ParticipantItem';\nexport type { ParticipantItemProps, ParticipantItemStrings, ParticipantItemStyles } from './ParticipantItem';\n\nexport { ParticipantList } from './ParticipantList';\nexport type {\n  ParticipantListItemStyles,\n  ParticipantListProps,\n  ParticipantListStyles,\n  ParticipantMenuItemsCallback\n} from './ParticipantList';\n\nexport { Announcer } from './Announcer';\nexport type { AnnouncerProps } from './Announcer';\n\nexport { VideoGallery } from './VideoGallery';\nexport type { VideoGalleryProps, VideoGalleryStrings, VideoGalleryStyles, VideoGalleryLayout } from './VideoGallery';\nexport type { HorizontalGalleryStyles } from './HorizontalGallery';\n\nexport { LocalVideoCameraCycleButton } from './LocalVideoCameraButton';\nexport type { LocalVideoCameraCycleButtonProps } from './LocalVideoCameraButton';\n\nexport { CameraButton } from './CameraButton';\nexport type {\n  CameraButtonContextualMenuStyles,\n  CameraButtonProps,\n  CameraButtonStrings,\n  CameraButtonStyles\n} from './CameraButton';\n\nexport { ControlBar } from './ControlBar';\nexport type { ControlBarProps, ControlBarLayout } from './ControlBar';\n\nexport { ControlBarButton } from './ControlBarButton';\nexport type { ControlBarButtonProps, ControlBarButtonStrings, ControlBarButtonStyles } from './ControlBarButton';\n\nexport { EndCallButton } from './EndCallButton';\nexport type { EndCallButtonProps, EndCallButtonStrings } from './EndCallButton';\n\nexport { MicrophoneButton } from './MicrophoneButton';\nexport type {\n  MicrophoneButtonStyles,\n  MicrophoneButtonContextualMenuStyles,\n  MicrophoneButtonProps,\n  MicrophoneButtonStrings\n} from './MicrophoneButton';\n\nexport { DevicesButton } from './DevicesButton';\nexport type {\n  OptionsDevice,\n  DevicesButtonProps,\n  DevicesButtonStrings,\n  DevicesButtonStyles,\n  DevicesButtonContextualMenuStyles\n} from './DevicesButton';\n\n/* @conditional-compile-remove(call-readiness) */\nexport {\n  CameraAndMicrophoneDomainPermissions,\n  MicrophoneDomainPermissions,\n  CameraDomainPermissions\n} from './DevicePermissions/DomainPermissions';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n  DomainPermissionsStrings,\n  DomainPermissionsStyles\n} from './DevicePermissions/DomainPermissionsScaffolding';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n  CameraAndMicrophoneDomainPermissionsStrings,\n  CameraAndMicrophoneDomainPermissionsProps,\n  CameraDomainPermissionsStrings,\n  CameraDomainPermissionsProps,\n  CommonDomainPermissionsProps,\n  MicrophoneDomainPermissionsStrings,\n  MicrophoneDomainPermissionsProps\n} from './DevicePermissions/DomainPermissions';\n/* @conditional-compile-remove(call-readiness) */\nexport { BrowserPermissionDenied } from './DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n  BrowserPermissionDeniedStrings,\n  BrowserPermissionDeniedStyles,\n  BrowserPermissionDeniedProps\n} from './DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nexport { BrowserPermissionDeniedIOS } from './DevicePermissions/BrowserPermissionDeniedIOS';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n  BrowserPermissionDeniedIOSStrings,\n  BrowserPermissionDeniedIOSProps\n} from './DevicePermissions/BrowserPermissionDeniedIOS';\n\nexport { ParticipantsButton } from './ParticipantsButton';\nexport type {\n  ParticipantsButtonContextualMenuStyles,\n  ParticipantsButtonProps,\n  ParticipantsButtonStrings,\n  ParticipantsButtonStyles\n} from './ParticipantsButton';\n\nexport { ScreenShareButton } from './ScreenShareButton';\nexport type { ScreenShareButtonProps, ScreenShareButtonStrings } from './ScreenShareButton';\n\nexport { VideoTile } from './VideoTile';\nexport type { VideoTileProps, VideoTileStylesProps } from './VideoTile';\n/* @conditional-compile-remove(PSTN-calls) */\nexport type { VideoTileStrings } from './VideoTile';\n\nexport { _PictureInPictureInPicture } from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type {\n  _PictureInPictureInPictureProps,\n  _PictureInPictureInPictureStrings\n} from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type {\n  _PictureInPictureInPictureTileProps,\n  _TileOrientation\n} from './PictureInPictureInPicture/PictureInPictureInPictureTile';\n\nexport * from './Drawer';\n/* @conditional-compile-remove(file-sharing) */\nexport type { SendBoxErrorBarError } from './SendBoxErrorBar';\nexport * from './FileCard';\nexport * from './FileCardGroup';\nexport * from './ModalClone/ModalClone';\nexport * from './FileDownloadCards';\nexport type { _FileUploadCardsStrings } from './FileUploadCards';\n\nexport { _useContainerHeight, _useContainerWidth } from './utils/responsive';\n\nexport { _ComplianceBanner } from './ComplianceBanner';\nexport type { _ComplianceBannerProps, _ComplianceBannerStrings } from './ComplianceBanner';\nexport { Dialpad } from './Dialpad/Dialpad';\nexport type { DialpadProps, DialpadStrings, DialpadStyles, DtmfTone } from './Dialpad/Dialpad';\n\n/* @conditional-compile-remove(PSTN-calls) */\nexport { HoldButton } from './HoldButton';\n/* @conditional-compile-remove(PSTN-calls) */\nexport type { HoldButtonProps, HoldButtonStrings } from './HoldButton';\n\nexport { _LocalVideoTile } from './LocalVideoTile';\nexport { _RemoteVideoTile } from './RemoteVideoTile';\nexport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\nexport type { _HighContrastAwareIconProps } from './HighContrastAwareIcon';\n\n/* @conditional-compile-remove(unsupported-browser) */\nexport { UnsupportedBrowser } from './UnsupportedBrowser';\n/* @conditional-compile-remove(unsupported-browser) */\nexport type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from './UnsupportedBrowser';\nexport { _TroubleshootingGuideErrorBar } from './TroubleshootingGuideErrorBar';\nexport type {\n  _TroubleshootingGuideErrorBarStrings,\n  _TroubleshootingGuideErrorBarProps\n} from './TroubleshootingGuideErrorBar';\n\nexport { _DevicePermissionDropdown } from './DevicePermissions/DevicePermissionDropdown';\nexport type {\n  _DevicePermissionDropdownStrings,\n  _DevicePermissionDropdownProps,\n  _PermissionConstraints\n} from './DevicePermissions/DevicePermissionDropdown';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAGtC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAKpC,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAWhD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAQpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAI9C,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAGvE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAQ9C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGtD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAQtD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAShD,iDAAiD;AACjD,OAAO,EACL,oCAAoC,EACpC,2BAA2B,EAC3B,uBAAuB,EACxB,MAAM,uCAAuC,CAAC;AAgB/C,iDAAiD;AACjD,OAAO,EAAE,uBAAuB,EAAE,MAAM,6CAA6C,CAAC;AAOtF,iDAAiD;AACjD,OAAO,EAAE,0BAA0B,EAAE,MAAM,gDAAgD,CAAC;AAO5F,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAQ1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAKxC,OAAO,EAAE,0BAA0B,EAAE,MAAM,uDAAuD,CAAC;AAUnG,cAAc,UAAU,CAAC;AAGzB,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AAGpC,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAE7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAG5C,6CAA6C;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI1C,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAGjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AAGxE,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAM/E,OAAO,EAAE,yBAAyB,EAAE,MAAM,8CAA8C,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nexport { TypingIndicator } from './TypingIndicator';\nexport type { TypingIndicatorProps, TypingIndicatorStrings, TypingIndicatorStylesProps } from './TypingIndicator';\n\nexport { ErrorBar } from './ErrorBar';\nexport type { ActiveErrorMessage, ErrorBarProps, ErrorBarStrings, ErrorType } from './ErrorBar';\n\nexport { GridLayout } from './GridLayout';\nexport type { GridLayoutProps, GridLayoutStyles } from './GridLayout';\n\nexport { SendBox } from './SendBox';\nexport type { SendBoxProps, SendBoxStrings, SendBoxStylesProps } from './SendBox';\n/* @conditional-compile-remove(file-sharing) */\nexport type { ActiveFileUpload } from './SendBox';\n\nexport { MessageStatusIndicator } from './MessageStatusIndicator';\nexport type { MessageStatusIndicatorProps, MessageStatusIndicatorStrings } from './MessageStatusIndicator';\n\nexport { MessageThread } from './MessageThread';\nexport type {\n  MessageProps,\n  MessageThreadProps,\n  MessageThreadStrings,\n  MessageThreadStyles,\n  JumpToNewMessageButtonProps,\n  MessageRenderer,\n  UpdateMessageCallback\n} from './MessageThread';\n\nexport { StreamMedia } from './StreamMedia';\nexport type { StreamMediaProps } from './StreamMedia';\nexport type { LoadingState } from './StreamMedia';\n\nexport { ParticipantItem } from './ParticipantItem';\nexport type { ParticipantItemProps, ParticipantItemStrings, ParticipantItemStyles } from './ParticipantItem';\n\nexport { ParticipantList } from './ParticipantList';\nexport type {\n  ParticipantListItemStyles,\n  ParticipantListProps,\n  ParticipantListStyles,\n  ParticipantMenuItemsCallback\n} from './ParticipantList';\n\nexport { Announcer } from './Announcer';\nexport type { AnnouncerProps } from './Announcer';\n\nexport { VideoGallery } from './VideoGallery';\nexport type { VideoGalleryProps, VideoGalleryStrings, VideoGalleryStyles, VideoGalleryLayout } from './VideoGallery';\nexport type { HorizontalGalleryStyles } from './HorizontalGallery';\n\nexport { LocalVideoCameraCycleButton } from './LocalVideoCameraButton';\nexport type { LocalVideoCameraCycleButtonProps } from './LocalVideoCameraButton';\n\nexport { CameraButton } from './CameraButton';\nexport type {\n  CameraButtonContextualMenuStyles,\n  CameraButtonProps,\n  CameraButtonStrings,\n  CameraButtonStyles\n} from './CameraButton';\n\nexport { ControlBar } from './ControlBar';\nexport type { ControlBarProps, ControlBarLayout } from './ControlBar';\n\nexport { ControlBarButton } from './ControlBarButton';\nexport type { ControlBarButtonProps, ControlBarButtonStrings, ControlBarButtonStyles } from './ControlBarButton';\n\nexport { EndCallButton } from './EndCallButton';\nexport type { EndCallButtonProps, EndCallButtonStrings } from './EndCallButton';\n\nexport { MicrophoneButton } from './MicrophoneButton';\nexport type {\n  MicrophoneButtonStyles,\n  MicrophoneButtonContextualMenuStyles,\n  MicrophoneButtonProps,\n  MicrophoneButtonStrings\n} from './MicrophoneButton';\n\nexport { DevicesButton } from './DevicesButton';\nexport type {\n  OptionsDevice,\n  DevicesButtonProps,\n  DevicesButtonStrings,\n  DevicesButtonStyles,\n  DevicesButtonContextualMenuStyles\n} from './DevicesButton';\n\n/* @conditional-compile-remove(call-readiness) */\nexport {\n  CameraAndMicrophoneDomainPermissions,\n  MicrophoneDomainPermissions,\n  CameraDomainPermissions\n} from './DevicePermissions/DomainPermissions';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n  DomainPermissionsStrings,\n  DomainPermissionsStyles\n} from './DevicePermissions/DomainPermissionsScaffolding';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n  CameraAndMicrophoneDomainPermissionsStrings,\n  CameraAndMicrophoneDomainPermissionsProps,\n  CameraDomainPermissionsStrings,\n  CameraDomainPermissionsProps,\n  CommonDomainPermissionsProps,\n  MicrophoneDomainPermissionsStrings,\n  MicrophoneDomainPermissionsProps\n} from './DevicePermissions/DomainPermissions';\n/* @conditional-compile-remove(call-readiness) */\nexport { BrowserPermissionDenied } from './DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n  BrowserPermissionDeniedStrings,\n  BrowserPermissionDeniedStyles,\n  BrowserPermissionDeniedProps\n} from './DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nexport { BrowserPermissionDeniedIOS } from './DevicePermissions/BrowserPermissionDeniedIOS';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n  BrowserPermissionDeniedIOSStrings,\n  BrowserPermissionDeniedIOSProps\n} from './DevicePermissions/BrowserPermissionDeniedIOS';\n\nexport { ParticipantsButton } from './ParticipantsButton';\nexport type {\n  ParticipantsButtonContextualMenuStyles,\n  ParticipantsButtonProps,\n  ParticipantsButtonStrings,\n  ParticipantsButtonStyles\n} from './ParticipantsButton';\n\nexport { ScreenShareButton } from './ScreenShareButton';\nexport type { ScreenShareButtonProps, ScreenShareButtonStrings } from './ScreenShareButton';\n\nexport { VideoTile } from './VideoTile';\nexport type { VideoTileProps, VideoTileStylesProps } from './VideoTile';\n/* @conditional-compile-remove(PSTN-calls) */\nexport type { VideoTileStrings } from './VideoTile';\n\nexport { _PictureInPictureInPicture } from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type {\n  _PictureInPictureInPictureProps,\n  _PictureInPictureInPictureStrings\n} from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type {\n  _PictureInPictureInPictureTileProps,\n  _TileOrientation\n} from './PictureInPictureInPicture/PictureInPictureInPictureTile';\n\nexport * from './Drawer';\n/* @conditional-compile-remove(file-sharing) */\nexport type { SendBoxErrorBarError } from './SendBoxErrorBar';\nexport * from './FileCard';\nexport * from './FileCardGroup';\nexport * from './ModalClone/ModalClone';\nexport * from './FileDownloadCards';\nexport type { _FileUploadCardsStrings } from './FileUploadCards';\n\nexport { _useContainerHeight, _useContainerWidth } from './utils/responsive';\n\nexport { _ComplianceBanner } from './ComplianceBanner';\nexport type { _ComplianceBannerProps, _ComplianceBannerStrings } from './ComplianceBanner';\nexport { Dialpad } from './Dialpad/Dialpad';\nexport type { DialpadProps, DialpadStrings, DialpadStyles, DtmfTone } from './Dialpad/Dialpad';\n\n/* @conditional-compile-remove(PSTN-calls) */\nexport { HoldButton } from './HoldButton';\n/* @conditional-compile-remove(PSTN-calls) */\nexport type { HoldButtonProps, HoldButtonStrings } from './HoldButton';\n\nexport { _LocalVideoTile } from './LocalVideoTile';\nexport { _RemoteVideoTile } from './RemoteVideoTile';\nexport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\nexport type { _HighContrastAwareIconProps } from './HighContrastAwareIcon';\n\nexport { UnsupportedBrowser } from './UnsupportedBrowser';\nexport type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from './UnsupportedBrowser';\nexport { UnsupportedBrowserVersion } from './UnsupportedBrowserVersion';\nexport type { UnsupportedBrowserVersionStrings, UnsupportedBrowserVersionProps } from './UnsupportedBrowserVersion';\n\nexport { _TroubleshootingGuideErrorBar } from './TroubleshootingGuideErrorBar';\nexport type {\n  _TroubleshootingGuideErrorBarStrings,\n  _TroubleshootingGuideErrorBarProps\n} from './TroubleshootingGuideErrorBar';\n\nexport { _DevicePermissionDropdown } from './DevicePermissions/DevicePermissionDropdown';\nexport type {\n  _DevicePermissionDropdownStrings,\n  _DevicePermissionDropdownProps,\n  _PermissionConstraints\n} from './DevicePermissions/DevicePermissionDropdown';\n"]}

package/dist/dist-esm/react-components/src/components/styles/{UnsupportedBrowser.styles.d.ts → UnsupportedEnvironment.styles.d.ts}

@@ -19,4 +19,4 @@ export declare const containerStyles: IStackStyles;
  * @interal
  */
 export declare const iconStyles: IIconStyles;
-//# sourceMappingURL=UnsupportedBrowser.styles.d.ts.map
+//# sourceMappingURL=UnsupportedEnvironment.styles.d.ts.map

package/dist/dist-esm/react-components/src/components/styles/{UnsupportedBrowser.styles.js → UnsupportedEnvironment.styles.js}

@@ -20,7 +20,8 @@ export const secondaryTextStyles = {
     root: {
         margin: 'auto',
         fontWeight: 400,
-        paddingBottom: '0.5rem'
+        paddingBottom: '0.5rem',
+        textAlign: 'center'
     }
 };
 /**
@@ -49,4 +50,4 @@ export const iconStyles = {
         paddingBottom: '1rem'
     }
 };
-//# sourceMappingURL=UnsupportedBrowser.styles.js.map
+//# sourceMappingURL=UnsupportedEnvironment.styles.js.map

package/dist/dist-esm/react-components/src/components/styles/UnsupportedEnvironment.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnsupportedEnvironment.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/UnsupportedEnvironment.styles.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAAE,QAAQ,EAAE,sCAAgC;AAEnD;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAgB;IACzC,IAAI,EAAE;QACJ,UAAU,EAAE,GAAG;QACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;QACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;QACxB,aAAa,EAAE,MAAM;QACrB,MAAM,EAAE,MAAM;KACf;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAgB;IAC9C,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,GAAG;QACf,aAAa,EAAE,QAAQ;QACvB,SAAS,EAAE,QAAQ;KACpB;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAgB;IACzC,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,GAAG;QACf,SAAS,EAAE,SAAS;KACrB;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAiB;IAC3C,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM;KAChB;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAgB;IACrC,IAAI,EAAE;QACJ,aAAa,EAAE,MAAM;KACtB;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { IIconStyles, ILinkStyles, IStackStyles, ITextStyles } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/**\n * @internal\n */\nexport const mainTextStyles: ITextStyles = {\n  root: {\n    fontWeight: 600,\n    fontSize: _pxToRem(20),\n    lineHeight: _pxToRem(28),\n    paddingBottom: '1rem',\n    margin: 'auto'\n  }\n};\n\n/**\n * @internal\n */\nexport const secondaryTextStyles: ITextStyles = {\n  root: {\n    margin: 'auto',\n    fontWeight: 400,\n    paddingBottom: '0.5rem',\n    textAlign: 'center'\n  }\n};\n\n/**\n * @internal\n */\nexport const linkTextStyles: ILinkStyles = {\n  root: {\n    margin: 'auto',\n    fontWeight: 600,\n    textAlign: 'inherit'\n  }\n};\n\n/**\n * @internal\n */\nexport const containerStyles: IStackStyles = {\n  root: {\n    padding: '2rem'\n  }\n};\n\n/**\n * @interal\n */\nexport const iconStyles: IIconStyles = {\n  root: {\n    paddingBottom: '1rem'\n  }\n};\n\"../../../../acs-ui-common/src\""]}

package/dist/dist-esm/react-components/src/components/styles/VideoTile.styles.d.ts

@@ -42,5 +42,5 @@ export declare const participantStateStringStyles: (theme: Theme) => IStyle;
 /**
  * @private
  */
-export declare const menuButtonStyles: IButtonStyles;
+export declare const moreButtonStyles: IButtonStyles;
 //# sourceMappingURL=VideoTile.styles.d.ts.map

package/dist/dist-esm/react-components/src/components/styles/VideoTile.styles.js

@@ -111,36 +111,21 @@ export const participantStateStringStyles = (theme) => {
 /**
  * @private
  */
-export const menuButtonStyles = {
+export const moreButtonStyles = {
     root: {
-        background: 'none',
-        border: 'none',
-        borderRadius: 0,
-        minHeight: '0.125rem',
-        minWidth: '2rem',
-        width: '100%',
-        maxWidth: '3rem',
-        svg: {
-            verticalAlign: 'text-top'
-        }
+        // To ensure that the button is clickable when there is a floating video tile
+        zIndex: 1,
+        color: 'inherit',
+        height: '100%'
     },
-    splitButtonMenuButton: {
-        border: 'none'
+    rootHovered: {
+        background: 'none'
     },
-    flexContainer: {
-        flexFlow: 'column',
-        display: 'contents'
+    rootPressed: {
+        background: 'none'
     },
-    label: {
-        fontSize: '0.625rem',
-        fontWeight: '400',
-        lineHeight: '1rem',
-        cursor: 'pointer',
-        display: 'block',
-        margin: '0rem 0.25rem',
-        overflow: 'hidden',
-        textOverflow: 'ellipsis',
-        whiteSpace: 'nowrap'
+    rootExpanded: {
+        background: 'none'
     }
 };
 //# sourceMappingURL=VideoTile.styles.js.map

package/dist/dist-esm/react-components/src/components/styles/VideoTile.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"VideoTile.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/VideoTile.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { IButtonStyles, IStyle, mergeStyles, Theme } from '@fluentui/react';\n\n/**\n * @private\n */\nexport const rootStyles: IStyle = {\n  position: 'relative',\n  height: '100%',\n  width: '100%'\n};\n\n/**\n * @private\n */\nexport const videoContainerStyles: IStyle = {\n  position: 'absolute',\n  top: '0',\n  left: '0',\n  width: '100%',\n  height: '100%',\n  minWidth: '100%',\n  minHeight: '100%',\n  objectPosition: 'center',\n  objectFit: 'cover',\n  zIndex: 0\n};\n\n/**\n * @private\n */\nexport const overlayContainerStyles: IStyle = {\n  width: '100%',\n  height: '100%',\n  zIndex: 5\n};\n\n/**\n * @private\n */\nexport const tileInfoContainerStyle = mergeStyles({\n  position: 'absolute',\n  bottom: '0',\n  left: '0',\n  padding: '0.5rem',\n  width: '100%'\n});\n\n/**\n * @private\n */\nexport const disabledVideoHint = mergeStyles({\n  backgroundColor: 'inherit',\n  boxShadow: 'none',\n  textAlign: 'left',\n  overflow: 'hidden',\n  whiteSpace: 'nowrap',\n  alignItems: 'center',\n  padding: '0.15rem',\n  maxWidth: '100%'\n});\n\n/**\n * @private\n */\nexport const videoHint = mergeStyles(disabledVideoHint, {\n  // This will appear on top of the video stream, so no dependency on theme and explicitly use a translucent white\n  backgroundColor: 'rgba(255,255,255,0.8)'\n});\n\n/**\n * @private\n */\nexport const displayNameStyle: IStyle = {\n  padding: '0.1rem',\n  fontSize: '0.75rem',\n  fontWeight: 600,\n  // Text component will take body color by default (white in Dark Mode), so forcing it to be parent container color\n  color: 'inherit',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  maxWidth: '100%'\n};\n\n/**\n * @private\n */\nexport const pinIconStyle: IStyle = {\n  padding: '0.125rem'\n};\n\n/**\n * @private\n */\nexport const iconContainerStyle: IStyle = {\n  margin: 'auto',\n  alignItems: 'center',\n  '& svg': {\n    display: 'block',\n    // Similar to text color, icon color will be inherited from parent container\n    color: 'inherit'\n  }\n};\n\n/**\n * @private\n */\nexport const participantStateStringStyles = (theme: Theme): IStyle => {\n  return {\n    minWidth: 'max-content',\n    color: theme.palette.black,\n    fontSize: '0.75rem',\n    lineHeight: 'normal',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n    padding: '0.1rem'\n  };\n};\n\n/**\n * @private\n */\nexport const menuButtonStyles: IButtonStyles = {\n  root: {\n    background: 'none',\n    border: 'none',\n    borderRadius: 0,\n    minHeight: '0.125rem',\n    minWidth: '2rem',\n    width: '100%',\n    maxWidth: '3rem',\n    svg: {\n      verticalAlign: 'text-top'\n    }\n  },\n  splitButtonMenuButton: {\n    border: 'none'\n  },\n  flexContainer: {\n    flexFlow: 'column',\n    display: 'contents'\n  },\n  label: {\n    fontSize: '0.625rem',\n    fontWeight: '400',\n    lineHeight: '1rem',\n    cursor: 'pointer',\n    display: 'block',\n    margin: '0rem 0.25rem',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap'\n  }\n};\n"]}
+{"version":3,"file":"VideoTile.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/VideoTile.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { IButtonStyles, IStyle, mergeStyles, Theme } from '@fluentui/react';\n\n/**\n * @private\n */\nexport const rootStyles: IStyle = {\n  position: 'relative',\n  height: '100%',\n  width: '100%'\n};\n\n/**\n * @private\n */\nexport const videoContainerStyles: IStyle = {\n  position: 'absolute',\n  top: '0',\n  left: '0',\n  width: '100%',\n  height: '100%',\n  minWidth: '100%',\n  minHeight: '100%',\n  objectPosition: 'center',\n  objectFit: 'cover',\n  zIndex: 0\n};\n\n/**\n * @private\n */\nexport const overlayContainerStyles: IStyle = {\n  width: '100%',\n  height: '100%',\n  zIndex: 5\n};\n\n/**\n * @private\n */\nexport const tileInfoContainerStyle = mergeStyles({\n  position: 'absolute',\n  bottom: '0',\n  left: '0',\n  padding: '0.5rem',\n  width: '100%'\n});\n\n/**\n * @private\n */\nexport const disabledVideoHint = mergeStyles({\n  backgroundColor: 'inherit',\n  boxShadow: 'none',\n  textAlign: 'left',\n  overflow: 'hidden',\n  whiteSpace: 'nowrap',\n  alignItems: 'center',\n  padding: '0.15rem',\n  maxWidth: '100%'\n});\n\n/**\n * @private\n */\nexport const videoHint = mergeStyles(disabledVideoHint, {\n  // This will appear on top of the video stream, so no dependency on theme and explicitly use a translucent white\n  backgroundColor: 'rgba(255,255,255,0.8)'\n});\n\n/**\n * @private\n */\nexport const displayNameStyle: IStyle = {\n  padding: '0.1rem',\n  fontSize: '0.75rem',\n  fontWeight: 600,\n  // Text component will take body color by default (white in Dark Mode), so forcing it to be parent container color\n  color: 'inherit',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  maxWidth: '100%'\n};\n\n/**\n * @private\n */\nexport const pinIconStyle: IStyle = {\n  padding: '0.125rem'\n};\n\n/**\n * @private\n */\nexport const iconContainerStyle: IStyle = {\n  margin: 'auto',\n  alignItems: 'center',\n  '& svg': {\n    display: 'block',\n    // Similar to text color, icon color will be inherited from parent container\n    color: 'inherit'\n  }\n};\n\n/**\n * @private\n */\nexport const participantStateStringStyles = (theme: Theme): IStyle => {\n  return {\n    minWidth: 'max-content',\n    color: theme.palette.black,\n    fontSize: '0.75rem',\n    lineHeight: 'normal',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'nowrap',\n    padding: '0.1rem'\n  };\n};\n\n/**\n * @private\n */\nexport const moreButtonStyles: IButtonStyles = {\n  root: {\n    // To ensure that the button is clickable when there is a floating video tile\n    zIndex: 1,\n    color: 'inherit',\n    height: '100%'\n  },\n  rootHovered: {\n    background: 'none'\n  },\n  rootPressed: {\n    background: 'none'\n  },\n  rootExpanded: {\n    background: 'none'\n  }\n};\n"]}

package/dist/dist-esm/react-components/src/components/utils.d.ts

@@ -1,6 +1,5 @@
-import { IContextualMenuItem, IIconProps, MessageBarType } from '@fluentui/react';
+import { IIconProps, MessageBarType } from '@fluentui/react';
 import { ActiveErrorMessage, ErrorType } from './ErrorBar';
-import { VideoTileMenuItems } from './VideoTile';
 /**
  * @private
  *
@@ -53,10 +52,6 @@ export declare const errorsToShow: (activeErrorMessages: ActiveErrorMessage[], d
  * @returns MessageBarType
  */
 export declare const messageBarType: (errorType: ErrorType) => MessageBarType;
-/**
- * @private
- */
-export declare const mapMenuItemsToContextualMenuItems: (menuItems: VideoTileMenuItems) => IContextualMenuItem[];
 /**
  * @private
  * @param errorType

package/dist/dist-esm/react-components/src/components/utils.js

@@ -124,22 +124,6 @@ export const messageBarType = (errorType) => {
             return MessageBarType.error;
     }
 };
-/**
- * @private
- */
-export const mapMenuItemsToContextualMenuItems = (menuItems) => {
-    const contextualMenuItems = [];
-    menuItems.map((item) => {
-        contextualMenuItems.push({
-            key: item.key,
-            text: item.text,
-            ariaLabel: item.ariaLabel,
-            onClick: item.onClick,
-            iconProps: item.iconProps
-        });
-    });
-    return contextualMenuItems;
-};
 /**
  * @private
  * @param errorType

package/dist/dist-esm/react-components/src/components/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/utils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { IContextualMenuItem, IIconProps, MessageBarType } from '@fluentui/react';\nimport { ActiveErrorMessage, ErrorType } from './ErrorBar';\nimport { VideoTileMenuItems } from './VideoTile';\n\n/**\n * @private\n *\n * @param fileName\n * @param length\n * @returns string\n */\nexport const truncatedFileName = (fileName: string, length: number): string => {\n  return fileName.substring(0, length).trimEnd() + (fileName.length > length ? '... ' : '');\n};\n\n/**\n * @private\n *\n * @param fileName\n * @returns string\n */\nexport const extension = (fileName: string): string => fileName.split('.').pop() || '';\n\n/**\n * @private\n */\nexport interface DismissedError {\n  type: ErrorType;\n  dismissedAt: Date;\n  activeSince?: Date;\n}\n\n/**\n * @private\n * @param dismissedErrors\n * @param toDismiss\n * @returns DismissedError[]\n * Always returns a new Array so that the state variable is updated, trigerring a render.\n */\nexport const dismissError = (dismissedErrors: DismissedError[], toDismiss: ActiveErrorMessage): DismissedError[] => {\n  const now = new Date(Date.now());\n  for (const error of dismissedErrors) {\n    if (error.type === toDismiss.type) {\n      // Bump the timestamp for latest dismissal of this error to now.\n      error.dismissedAt = now;\n      error.activeSince = toDismiss.timestamp;\n      return Array.from(dismissedErrors);\n    }\n  }\n\n  // Record that this error was dismissed for the first time right now.\n  return [\n    ...dismissedErrors,\n    {\n      type: toDismiss.type,\n      dismissedAt: now,\n      activeSince: toDismiss.timestamp\n    }\n  ];\n};\n\n/**\n * @private\n * @param activeErrorMessages\n * @param dismissedErrors\n * @returns DismissedError[]\n *  Returns a new Array if and only if contents change, to avoid re-rendering when nothing was dropped.\n */\nexport const dropDismissalsForInactiveErrors = (\n  activeErrorMessages: ActiveErrorMessage[],\n  dismissedErrors: DismissedError[]\n): DismissedError[] => {\n  const active = new Map();\n  for (const message of activeErrorMessages) {\n    active.set(message.type, message);\n  }\n\n  // For an error such that:\n  // * It was previously active, and dismissed.\n  // * It did not have a timestamp associated with it.\n  // * It is no longer active.\n  //\n  // We remove it from dismissals. When it becomes active again next time, it will be shown again on the UI.\n  const shouldDeleteDismissal = (dismissed: DismissedError): boolean =>\n    dismissed.activeSince === undefined && active.get(dismissed.type) === undefined;\n\n  if (dismissedErrors.some((dismissed) => shouldDeleteDismissal(dismissed))) {\n    return dismissedErrors.filter((dismissed) => !shouldDeleteDismissal(dismissed));\n  }\n  return dismissedErrors;\n};\n\n/**\n * @private\n * @param activeErrorMessages\n * @param dismissedErrors\n * @returns ActiveErrorMessage[]\n */\nexport const errorsToShow = (\n  activeErrorMessages: ActiveErrorMessage[],\n  dismissedErrors: DismissedError[],\n  mountTimestamp?: Date\n): ActiveErrorMessage[] => {\n  const dismissed: Map<ErrorType, DismissedError> = new Map();\n  for (const error of dismissedErrors) {\n    dismissed.set(error.type, error);\n  }\n\n  return activeErrorMessages.filter((error) => {\n    if (mountTimestamp && error.timestamp && mountTimestamp > error.timestamp) {\n      // Error has a timestamp and it is older than when the component was mounted.\n      return false;\n    }\n\n    const dismissal = dismissed.get(error.type);\n    if (!dismissal) {\n      // This error was never dismissed.\n      return true;\n    }\n    if (!error.timestamp) {\n      // No timestamp associated with the error. In this case, the existence of a dismissal is enough to suppress the error.\n      return false;\n    }\n    // Error has an associated timestamp, so compare with last dismissal.\n    return error.timestamp > dismissal.dismissedAt;\n  });\n};\n\n/**\n * @private\n * @param errorType\n * @returns MessageBarType\n */\nexport const messageBarType = (errorType: ErrorType): MessageBarType => {\n  switch (errorType) {\n    case 'callNetworkQualityLow':\n    case 'callNoSpeakerFound':\n    case 'callNoMicrophoneFound':\n    case 'callMicrophoneAccessDenied':\n    case 'callMicrophoneMutedBySystem':\n    case 'callMicrophoneUnmutedBySystem':\n    case 'callMacOsMicrophoneAccessDenied':\n    case 'callLocalVideoFreeze':\n    case 'callCameraAccessDenied':\n    case 'callCameraAlreadyInUse':\n    case 'callVideoStoppedBySystem':\n    case 'callVideoRecoveredBySystem':\n    case 'callMacOsCameraAccessDenied':\n    case 'callMacOsScreenShareAccessDenied':\n      return MessageBarType.warning;\n    default:\n      return MessageBarType.error;\n  }\n};\n\n/**\n * @private\n */\nexport const mapMenuItemsToContextualMenuItems = (menuItems: VideoTileMenuItems): IContextualMenuItem[] => {\n  const contextualMenuItems: IContextualMenuItem[] = [];\n  menuItems.map((item) => {\n    contextualMenuItems.push({\n      key: item.key,\n      text: item.text,\n      ariaLabel: item.ariaLabel,\n      onClick: item.onClick,\n      iconProps: item.iconProps\n    });\n  });\n\n  return contextualMenuItems;\n};\n\n/**\n * @private\n * @param errorType\n * @returns IIconProps | undefined\n */\nexport const messageBarIconProps = (errorType: ErrorType): IIconProps | undefined => {\n  const iconName = customIconName[errorType];\n  return iconName ? { iconName } : undefined;\n};\n\n/**\n * @private\n */\nexport const customIconName: Partial<{ [key in ErrorType]: string }> = {\n  callNetworkQualityLow: 'ErrorBarCallNetworkQualityLow',\n  callNoSpeakerFound: 'ErrorBarCallNoSpeakerFound',\n  callNoMicrophoneFound: 'ErrorBarCallNoMicrophoneFound',\n  callMicrophoneAccessDenied: 'ErrorBarCallMicrophoneAccessDenied',\n  callMicrophoneMutedBySystem: 'ErrorBarCallMicrophoneMutedBySystem',\n  callMicrophoneUnmutedBySystem: 'ErrorBarCallMicrophoneUnmutedBySystem',\n  callMacOsMicrophoneAccessDenied: 'ErrorBarCallMacOsMicrophoneAccessDenied',\n  callLocalVideoFreeze: 'ErrorBarCallLocalVideoFreeze',\n  callCameraAccessDenied: 'ErrorBarCallCameraAccessDenied',\n  callCameraAlreadyInUse: 'ErrorBarCallCameraAlreadyInUse',\n  callVideoStoppedBySystem: 'ErrorBarCallVideoStoppedBySystem',\n  callVideoRecoveredBySystem: 'ErrorBarCallVideoRecoveredBySystem',\n  callMacOsCameraAccessDenied: 'ErrorBarCallMacOsCameraAccessDenied'\n};\n\n/**\n * @private\n */\nexport const isValidString = (string: string | undefined): string is string => {\n  return !!string && string.length > 0;\n};\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/utils.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAc,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAG7D;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,QAAgB,EAAE,MAAc,EAAU,EAAE;IAC5E,OAAO,QAAQ,CAAC,SAAS,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,OAAO,EAAE,GAAG,CAAC,QAAQ,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AAC5F,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,QAAgB,EAAU,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,CAAC;AAWvF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,eAAiC,EAAE,SAA6B,EAAoB,EAAE;IACjH,MAAM,GAAG,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;IACjC,KAAK,MAAM,KAAK,IAAI,eAAe,EAAE;QACnC,IAAI,KAAK,CAAC,IAAI,KAAK,SAAS,CAAC,IAAI,EAAE;YACjC,gEAAgE;YAChE,KAAK,CAAC,WAAW,GAAG,GAAG,CAAC;YACxB,KAAK,CAAC,WAAW,GAAG,SAAS,CAAC,SAAS,CAAC;YACxC,OAAO,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;SACpC;KACF;IAED,qEAAqE;IACrE,OAAO;QACL,GAAG,eAAe;QAClB;YACE,IAAI,EAAE,SAAS,CAAC,IAAI;YACpB,WAAW,EAAE,GAAG;YAChB,WAAW,EAAE,SAAS,CAAC,SAAS;SACjC;KACF,CAAC;AACJ,CAAC,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAC7C,mBAAyC,EACzC,eAAiC,EACf,EAAE;IACpB,MAAM,MAAM,GAAG,IAAI,GAAG,EAAE,CAAC;IACzB,KAAK,MAAM,OAAO,IAAI,mBAAmB,EAAE;QACzC,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;KACnC;IAED,0BAA0B;IAC1B,6CAA6C;IAC7C,oDAAoD;IACpD,4BAA4B;IAC5B,EAAE;IACF,0GAA0G;IAC1G,MAAM,qBAAqB,GAAG,CAAC,SAAyB,EAAW,EAAE,CACnE,SAAS,CAAC,WAAW,KAAK,SAAS,IAAI,MAAM,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,SAAS,CAAC;IAElF,IAAI,eAAe,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,qBAAqB,CAAC,SAAS,CAAC,CAAC,EAAE;QACzE,OAAO,eAAe,CAAC,MAAM,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,qBAAqB,CAAC,SAAS,CAAC,CAAC,CAAC;KACjF;IACD,OAAO,eAAe,CAAC;AACzB,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,mBAAyC,EACzC,eAAiC,EACjC,cAAqB,EACC,EAAE;IACxB,MAAM,SAAS,GAAmC,IAAI,GAAG,EAAE,CAAC;IAC5D,KAAK,MAAM,KAAK,IAAI,eAAe,EAAE;QACnC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;KAClC;IAED,OAAO,mBAAmB,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE;QAC1C,IAAI,cAAc,IAAI,KAAK,CAAC,SAAS,IAAI,cAAc,GAAG,KAAK,CAAC,SAAS,EAAE;YACzE,6EAA6E;YAC7E,OAAO,KAAK,CAAC;SACd;QAED,MAAM,SAAS,GAAG,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC5C,IAAI,CAAC,SAAS,EAAE;YACd,kCAAkC;YAClC,OAAO,IAAI,CAAC;SACb;QACD,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;YACpB,sHAAsH;YACtH,OAAO,KAAK,CAAC;SACd;QACD,qEAAqE;QACrE,OAAO,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC,WAAW,CAAC;IACjD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,SAAoB,EAAkB,EAAE;IACrE,QAAQ,SAAS,EAAE;QACjB,KAAK,uBAAuB,CAAC;QAC7B,KAAK,oBAAoB,CAAC;QAC1B,KAAK,uBAAuB,CAAC;QAC7B,KAAK,4BAA4B,CAAC;QAClC,KAAK,6BAA6B,CAAC;QACnC,KAAK,+BAA+B,CAAC;QACrC,KAAK,iCAAiC,CAAC;QACvC,KAAK,sBAAsB,CAAC;QAC5B,KAAK,wBAAwB,CAAC;QAC9B,KAAK,wBAAwB,CAAC;QAC9B,KAAK,0BAA0B,CAAC;QAChC,KAAK,4BAA4B,CAAC;QAClC,KAAK,6BAA6B,CAAC;QACnC,KAAK,kCAAkC;YACrC,OAAO,cAAc,CAAC,OAAO,CAAC;QAChC;YACE,OAAO,cAAc,CAAC,KAAK,CAAC;KAC/B;AACH,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,SAAoB,EAA0B,EAAE;IAClF,MAAM,QAAQ,GAAG,cAAc,CAAC,SAAS,CAAC,CAAC;IAC3C,OAAO,QAAQ,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;AAC7C,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAA4C;IACrE,qBAAqB,EAAE,+BAA+B;IACtD,kBAAkB,EAAE,4BAA4B;IAChD,qBAAqB,EAAE,+BAA+B;IACtD,0BAA0B,EAAE,oCAAoC;IAChE,2BAA2B,EAAE,qCAAqC;IAClE,6BAA6B,EAAE,uCAAuC;IACtE,+BAA+B,EAAE,yCAAyC;IAC1E,oBAAoB,EAAE,8BAA8B;IACpD,sBAAsB,EAAE,gCAAgC;IACxD,sBAAsB,EAAE,gCAAgC;IACxD,wBAAwB,EAAE,kCAAkC;IAC5D,0BAA0B,EAAE,oCAAoC;IAChE,2BAA2B,EAAE,qCAAqC;CACnE,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,MAA0B,EAAoB,EAAE;IAC5E,OAAO,CAAC,CAAC,MAAM,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;AACvC,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { IIconProps, MessageBarType } from '@fluentui/react';\nimport { ActiveErrorMessage, ErrorType } from './ErrorBar';\n\n/**\n * @private\n *\n * @param fileName\n * @param length\n * @returns string\n */\nexport const truncatedFileName = (fileName: string, length: number): string => {\n  return fileName.substring(0, length).trimEnd() + (fileName.length > length ? '... ' : '');\n};\n\n/**\n * @private\n *\n * @param fileName\n * @returns string\n */\nexport const extension = (fileName: string): string => fileName.split('.').pop() || '';\n\n/**\n * @private\n */\nexport interface DismissedError {\n  type: ErrorType;\n  dismissedAt: Date;\n  activeSince?: Date;\n}\n\n/**\n * @private\n * @param dismissedErrors\n * @param toDismiss\n * @returns DismissedError[]\n * Always returns a new Array so that the state variable is updated, trigerring a render.\n */\nexport const dismissError = (dismissedErrors: DismissedError[], toDismiss: ActiveErrorMessage): DismissedError[] => {\n  const now = new Date(Date.now());\n  for (const error of dismissedErrors) {\n    if (error.type === toDismiss.type) {\n      // Bump the timestamp for latest dismissal of this error to now.\n      error.dismissedAt = now;\n      error.activeSince = toDismiss.timestamp;\n      return Array.from(dismissedErrors);\n    }\n  }\n\n  // Record that this error was dismissed for the first time right now.\n  return [\n    ...dismissedErrors,\n    {\n      type: toDismiss.type,\n      dismissedAt: now,\n      activeSince: toDismiss.timestamp\n    }\n  ];\n};\n\n/**\n * @private\n * @param activeErrorMessages\n * @param dismissedErrors\n * @returns DismissedError[]\n *  Returns a new Array if and only if contents change, to avoid re-rendering when nothing was dropped.\n */\nexport const dropDismissalsForInactiveErrors = (\n  activeErrorMessages: ActiveErrorMessage[],\n  dismissedErrors: DismissedError[]\n): DismissedError[] => {\n  const active = new Map();\n  for (const message of activeErrorMessages) {\n    active.set(message.type, message);\n  }\n\n  // For an error such that:\n  // * It was previously active, and dismissed.\n  // * It did not have a timestamp associated with it.\n  // * It is no longer active.\n  //\n  // We remove it from dismissals. When it becomes active again next time, it will be shown again on the UI.\n  const shouldDeleteDismissal = (dismissed: DismissedError): boolean =>\n    dismissed.activeSince === undefined && active.get(dismissed.type) === undefined;\n\n  if (dismissedErrors.some((dismissed) => shouldDeleteDismissal(dismissed))) {\n    return dismissedErrors.filter((dismissed) => !shouldDeleteDismissal(dismissed));\n  }\n  return dismissedErrors;\n};\n\n/**\n * @private\n * @param activeErrorMessages\n * @param dismissedErrors\n * @returns ActiveErrorMessage[]\n */\nexport const errorsToShow = (\n  activeErrorMessages: ActiveErrorMessage[],\n  dismissedErrors: DismissedError[],\n  mountTimestamp?: Date\n): ActiveErrorMessage[] => {\n  const dismissed: Map<ErrorType, DismissedError> = new Map();\n  for (const error of dismissedErrors) {\n    dismissed.set(error.type, error);\n  }\n\n  return activeErrorMessages.filter((error) => {\n    if (mountTimestamp && error.timestamp && mountTimestamp > error.timestamp) {\n      // Error has a timestamp and it is older than when the component was mounted.\n      return false;\n    }\n\n    const dismissal = dismissed.get(error.type);\n    if (!dismissal) {\n      // This error was never dismissed.\n      return true;\n    }\n    if (!error.timestamp) {\n      // No timestamp associated with the error. In this case, the existence of a dismissal is enough to suppress the error.\n      return false;\n    }\n    // Error has an associated timestamp, so compare with last dismissal.\n    return error.timestamp > dismissal.dismissedAt;\n  });\n};\n\n/**\n * @private\n * @param errorType\n * @returns MessageBarType\n */\nexport const messageBarType = (errorType: ErrorType): MessageBarType => {\n  switch (errorType) {\n    case 'callNetworkQualityLow':\n    case 'callNoSpeakerFound':\n    case 'callNoMicrophoneFound':\n    case 'callMicrophoneAccessDenied':\n    case 'callMicrophoneMutedBySystem':\n    case 'callMicrophoneUnmutedBySystem':\n    case 'callMacOsMicrophoneAccessDenied':\n    case 'callLocalVideoFreeze':\n    case 'callCameraAccessDenied':\n    case 'callCameraAlreadyInUse':\n    case 'callVideoStoppedBySystem':\n    case 'callVideoRecoveredBySystem':\n    case 'callMacOsCameraAccessDenied':\n    case 'callMacOsScreenShareAccessDenied':\n      return MessageBarType.warning;\n    default:\n      return MessageBarType.error;\n  }\n};\n\n/**\n * @private\n * @param errorType\n * @returns IIconProps | undefined\n */\nexport const messageBarIconProps = (errorType: ErrorType): IIconProps | undefined => {\n  const iconName = customIconName[errorType];\n  return iconName ? { iconName } : undefined;\n};\n\n/**\n * @private\n */\nexport const customIconName: Partial<{ [key in ErrorType]: string }> = {\n  callNetworkQualityLow: 'ErrorBarCallNetworkQualityLow',\n  callNoSpeakerFound: 'ErrorBarCallNoSpeakerFound',\n  callNoMicrophoneFound: 'ErrorBarCallNoMicrophoneFound',\n  callMicrophoneAccessDenied: 'ErrorBarCallMicrophoneAccessDenied',\n  callMicrophoneMutedBySystem: 'ErrorBarCallMicrophoneMutedBySystem',\n  callMicrophoneUnmutedBySystem: 'ErrorBarCallMicrophoneUnmutedBySystem',\n  callMacOsMicrophoneAccessDenied: 'ErrorBarCallMacOsMicrophoneAccessDenied',\n  callLocalVideoFreeze: 'ErrorBarCallLocalVideoFreeze',\n  callCameraAccessDenied: 'ErrorBarCallCameraAccessDenied',\n  callCameraAlreadyInUse: 'ErrorBarCallCameraAlreadyInUse',\n  callVideoStoppedBySystem: 'ErrorBarCallVideoStoppedBySystem',\n  callVideoRecoveredBySystem: 'ErrorBarCallVideoRecoveredBySystem',\n  callMacOsCameraAccessDenied: 'ErrorBarCallMacOsCameraAccessDenied'\n};\n\n/**\n * @private\n */\nexport const isValidString = (string: string | undefined): string is string => {\n  return !!string && string.length > 0;\n};\n"]}

package/dist/dist-esm/react-components/src/index.d.ts

@@ -7,6 +7,5 @@ export type { ComponentStrings, ComponentLocale, LocalizationProviderProps } fro
 export * from './theming';
 export { _PermissionsProvider, presenterPermissions, consumerPermissions, _usePermissions, _getPermissions } from './permissions';
 export type { _Permissions, _PermissionsProviderProps, Role } from './permissions';
-export type { VideoTileMenuItems } from './components/VideoTile';
 export type { BaseCustomStyles, CallParticipantListParticipant, ChatMessage, CommunicationParticipant, ContentSystemMessage, CreateVideoStreamViewResult, CustomAvatarOptions, CustomMessage, Message, MessageAttachedStatus, MessageCommon, MessageContentType, OnRenderAvatarCallback, ParticipantAddedSystemMessage, ParticipantListParticipant, ParticipantRemovedSystemMessage, ParticipantState, ReadReceiptsBySenderId, SystemMessage, SystemMessageCommon, TopicUpdatedSystemMessage, VideoGalleryLocalParticipant, VideoGalleryParticipant, VideoGalleryRemoteParticipant, VideoGalleryStream, VideoStreamOptions, ViewScalingMode } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/dist-esm/react-components/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../react-components/src/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAEpD,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,cAAc,WAAW,CAAC;AAE1B,wCAAwC;AACxC,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EACpB,mBAAmB,EACnB,eAAe,EACf,eAAe,EAChB,MAAM,eAAe,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nexport * from './components';\nexport { _IdentifierProvider } from './identifiers';\nexport type { _Identifiers, _IdentifierProviderProps } from './identifiers';\nexport * from './localization/locales';\nexport { LocalizationProvider } from './localization';\nexport type { ComponentStrings, ComponentLocale, LocalizationProviderProps } from './localization';\nexport * from './theming';\n\n/* @conditional-compile-remove(rooms) */\nexport {\n  _PermissionsProvider,\n  presenterPermissions,\n  consumerPermissions,\n  _usePermissions,\n  _getPermissions\n} from './permissions';\n/* @conditional-compile-remove(rooms) */\nexport type { _Permissions, _PermissionsProviderProps, Role } from './permissions';\n\nexport type { VideoTileMenuItems } from './components/VideoTile';\n\nexport type {\n  BaseCustomStyles,\n  CallParticipantListParticipant,\n  ChatMessage,\n  CommunicationParticipant,\n  ContentSystemMessage,\n  CreateVideoStreamViewResult,\n  CustomAvatarOptions,\n  CustomMessage,\n  Message,\n  MessageAttachedStatus,\n  MessageCommon,\n  MessageContentType,\n  OnRenderAvatarCallback,\n  ParticipantAddedSystemMessage,\n  ParticipantListParticipant,\n  ParticipantRemovedSystemMessage,\n  ParticipantState,\n  ReadReceiptsBySenderId,\n  SystemMessage,\n  SystemMessageCommon,\n  TopicUpdatedSystemMessage,\n  VideoGalleryLocalParticipant,\n  VideoGalleryParticipant,\n  VideoGalleryRemoteParticipant,\n  VideoGalleryStream,\n  VideoStreamOptions,\n  ViewScalingMode\n} from './types';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../react-components/src/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAEpD,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,cAAc,WAAW,CAAC;AAE1B,wCAAwC;AACxC,OAAO,EACL,oBAAoB,EACpB,oBAAoB,EACpB,mBAAmB,EACnB,eAAe,EACf,eAAe,EAChB,MAAM,eAAe,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nexport * from './components';\nexport { _IdentifierProvider } from './identifiers';\nexport type { _Identifiers, _IdentifierProviderProps } from './identifiers';\nexport * from './localization/locales';\nexport { LocalizationProvider } from './localization';\nexport type { ComponentStrings, ComponentLocale, LocalizationProviderProps } from './localization';\nexport * from './theming';\n\n/* @conditional-compile-remove(rooms) */\nexport {\n  _PermissionsProvider,\n  presenterPermissions,\n  consumerPermissions,\n  _usePermissions,\n  _getPermissions\n} from './permissions';\n/* @conditional-compile-remove(rooms) */\nexport type { _Permissions, _PermissionsProviderProps, Role } from './permissions';\n\nexport type {\n  BaseCustomStyles,\n  CallParticipantListParticipant,\n  ChatMessage,\n  CommunicationParticipant,\n  ContentSystemMessage,\n  CreateVideoStreamViewResult,\n  CustomAvatarOptions,\n  CustomMessage,\n  Message,\n  MessageAttachedStatus,\n  MessageCommon,\n  MessageContentType,\n  OnRenderAvatarCallback,\n  ParticipantAddedSystemMessage,\n  ParticipantListParticipant,\n  ParticipantRemovedSystemMessage,\n  ParticipantState,\n  ReadReceiptsBySenderId,\n  SystemMessage,\n  SystemMessageCommon,\n  TopicUpdatedSystemMessage,\n  VideoGalleryLocalParticipant,\n  VideoGalleryParticipant,\n  VideoGalleryRemoteParticipant,\n  VideoGalleryStream,\n  VideoStreamOptions,\n  ViewScalingMode\n} from './types';\n"]}