@azure/communication-react 1.32.0-beta.1 → 1.32.0

package/dist/dist-esm/react-components/src/components/VideoGallery/styles/ScrollableHorizontalGallery.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollableHorizontalGallery.style.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/styles/ScrollableHorizontalGallery.style.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAAE,sCAAsC,EAAE,mCAAmC,EAAE,MAAM,kDAAkD,CAAC;AAE/I;;GAEG;AACH,MAAM,CAAC,MAAM,iCAAiC,GAAiB;IAC7D,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;QAChE,YAAY,EAAE,QAAQ;QACtB,KAAK,EAAE,mCAAmC;KAC3C;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,0CAA0C,GAAW;IAChE,OAAO,EAAE,MAAM;IACf,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,QAAQ;IAClB,oBAAoB,EAAE,MAAM;IAC5B,iBAAiB,EAAE,MAAM;IACzB,qBAAqB,EAAE;QACrB,OAAO,EAAE,MAAM;KAChB;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IStackStyles, IStyle } from '@fluentui/react';\nimport { SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM, SMALL_HORIZONTAL_GALLERY_TILE_STYLE } from './VideoGalleryResponsiveHorizontalGallery.styles';\n\n/**\n * @private\n */\nexport const scrollableHorizontalGalleryStyles: IStackStyles = {\n  root: {\n    width: '100%',\n    minHeight: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n    paddingRight: '0.5rem',\n    '> *': SMALL_HORIZONTAL_GALLERY_TILE_STYLE\n  }\n};\n\n/**\n * @private\n */\nexport const scrollableHorizontalGalleryContainerStyles: IStyle = {\n  display: 'flex',\n  minHeight: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  overflow: 'scroll',\n  '-ms-overflow-style': 'none',\n  'scrollbar-width': 'none',\n  '::-webkit-scrollbar': {\n    display: 'none'\n  }\n};"]}
+{"version":3,"file":"ScrollableHorizontalGallery.style.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/styles/ScrollableHorizontalGallery.style.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAAE,sCAAsC,EAAE,mCAAmC,EAAE,MAAM,kDAAkD,CAAC;AAE/I;;GAEG;AACH,MAAM,CAAC,MAAM,iCAAiC,GAAiB;IAC7D,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;QAChE,YAAY,EAAE,QAAQ;QACtB,KAAK,EAAE,mCAAmC;KAC3C;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,0CAA0C,GAAW;IAChE,OAAO,EAAE,MAAM;IACf,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,QAAQ;IAClB,oBAAoB,EAAE,MAAM;IAC5B,iBAAiB,EAAE,MAAM;IACzB,qBAAqB,EAAE;QACrB,OAAO,EAAE,MAAM;KAChB;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IStackStyles, IStyle } from '@fluentui/react';\nimport { SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM, SMALL_HORIZONTAL_GALLERY_TILE_STYLE } from './VideoGalleryResponsiveHorizontalGallery.styles';\n\n/**\r\n * @private\r\n */\nexport const scrollableHorizontalGalleryStyles: IStackStyles = {\n  root: {\n    width: '100%',\n    minHeight: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n    paddingRight: '0.5rem',\n    '> *': SMALL_HORIZONTAL_GALLERY_TILE_STYLE\n  }\n};\n\n/**\r\n * @private\r\n */\nexport const scrollableHorizontalGalleryContainerStyles: IStyle = {\n  display: 'flex',\n  minHeight: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  overflow: 'scroll',\n  '-ms-overflow-style': 'none',\n  'scrollbar-width': 'none',\n  '::-webkit-scrollbar': {\n    display: 'none'\n  }\n};"]}

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

@@ -1 +1 @@
-{"version":3,"file":"VideoGalleryResponsiveHorizontalGallery.styles.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/styles/VideoGalleryResponsiveHorizontalGallery.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAIlC,OAAO,EAAE,6BAA6B,EAAE,6BAA6B,EAAE,MAAM,6BAA6B,CAAC;AAE3G;;GAEG;AACH,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAAC,qBAA8B,EAAE,QAAiB,EAAU,EAAE;IAC3G,OAAO;QACL,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,sCAAsC,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,GAAG,sCAAsC,CAAC,MAAM,KAAK;QACnI,KAAK,EAAE,qBAAqB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAe,6BAA6B,CAAC,KAAK,MAAM,CAAC,CAAC,CAAC,eAAe,6BAA6B,CAAC,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM;QACtK,YAAY,EAAE,QAAQ;KACvB,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,QAAiB,EAA2B,EAAE;IACnF,OAAO;QACL,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,mCAAmC,CAAC,CAAC,CAAC,mCAAmC;KAC/F,CAAC;AACJ,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,sCAAsC,GAAG;IACpD,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;CACX,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,sCAAsC,GAAG;IACpD,MAAM,EAAE,GAAG;IACX,QAAQ,EAAE,GAAG;IACb,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,mCAAmC,GAAG;IACjD,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,GAAG,sCAAsC,CAAC,KAAK,KAAK;IAC9D,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,GAAG,sCAAsC,CAAC,KAAK,KAAK;CAC/D,CAAC;AACF;;GAEG;AACH,MAAM,CAAC,MAAM,mCAAmC,GAAG;IACjD,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,GAAG,sCAAsC,CAAC,QAAQ,KAAK;IACjE,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,GAAG,sCAAsC,CAAC,QAAQ,KAAK;IACjE,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;CACf,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IStyle } from '@fluentui/react';\nimport { HorizontalGalleryStyles } from '../../HorizontalGallery';\nimport { LARGE_FLOATING_MODAL_SIZE_REM, SMALL_FLOATING_MODAL_SIZE_REM } from './FloatingLocalVideo.styles';\n\n/**\n * @private\n */\nexport const horizontalGalleryContainerStyle = (shouldFloatLocalVideo: boolean, isNarrow: boolean): IStyle => {\n  return {\n    minHeight: isNarrow ? `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem` : `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n    width: shouldFloatLocalVideo ? isNarrow ? `calc(100% - ${SMALL_FLOATING_MODAL_SIZE_REM.width}rem)` : `calc(100% - ${LARGE_FLOATING_MODAL_SIZE_REM.width}rem)` : '100%',\n    paddingRight: '0.5rem'\n  };\n};\n\n/**\n * @private\n */\nexport const horizontalGalleryStyle = (isNarrow: boolean): HorizontalGalleryStyles => {\n  return {\n    children: isNarrow ? SMALL_HORIZONTAL_GALLERY_TILE_STYLE : LARGE_HORIZONTAL_GALLERY_TILE_STYLE\n  };\n};\n\n/**\n * Small horizontal gallery tile size in rem\n * @private\n */\nexport const SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM = {\n  height: 6.5,\n  width: 6.5\n};\n\n/**\n * Large horizontal gallery tile size in rem\n * @private\n */\nexport const LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM = {\n  height: 7.5,\n  minWidth: 7.5,\n  maxWidth: 13.43\n};\n\n/**\n * @private\n */\nexport const SMALL_HORIZONTAL_GALLERY_TILE_STYLE = {\n  minHeight: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  minWidth: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  maxHeight: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  maxWidth: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.width}rem`\n};\n/**\n * @private\n */\nexport const LARGE_HORIZONTAL_GALLERY_TILE_STYLE = {\n  minHeight: `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  minWidth: `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.minWidth}rem`,\n  maxHeight: `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  maxWidth: `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.maxWidth}rem`,\n  width: '100%',\n  height: '100%'\n};"]}
+{"version":3,"file":"VideoGalleryResponsiveHorizontalGallery.styles.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/styles/VideoGalleryResponsiveHorizontalGallery.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAIlC,OAAO,EAAE,6BAA6B,EAAE,6BAA6B,EAAE,MAAM,6BAA6B,CAAC;AAE3G;;GAEG;AACH,MAAM,CAAC,MAAM,+BAA+B,GAAG,CAAC,qBAA8B,EAAE,QAAiB,EAAU,EAAE;IAC3G,OAAO;QACL,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,sCAAsC,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,GAAG,sCAAsC,CAAC,MAAM,KAAK;QACnI,KAAK,EAAE,qBAAqB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAe,6BAA6B,CAAC,KAAK,MAAM,CAAC,CAAC,CAAC,eAAe,6BAA6B,CAAC,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM;QACtK,YAAY,EAAE,QAAQ;KACvB,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,QAAiB,EAA2B,EAAE;IACnF,OAAO;QACL,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,mCAAmC,CAAC,CAAC,CAAC,mCAAmC;KAC/F,CAAC;AACJ,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,sCAAsC,GAAG;IACpD,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;CACX,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,sCAAsC,GAAG;IACpD,MAAM,EAAE,GAAG;IACX,QAAQ,EAAE,GAAG;IACb,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,mCAAmC,GAAG;IACjD,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,GAAG,sCAAsC,CAAC,KAAK,KAAK;IAC9D,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,GAAG,sCAAsC,CAAC,KAAK,KAAK;CAC/D,CAAC;AACF;;GAEG;AACH,MAAM,CAAC,MAAM,mCAAmC,GAAG;IACjD,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,GAAG,sCAAsC,CAAC,QAAQ,KAAK;IACjE,SAAS,EAAE,GAAG,sCAAsC,CAAC,MAAM,KAAK;IAChE,QAAQ,EAAE,GAAG,sCAAsC,CAAC,QAAQ,KAAK;IACjE,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;CACf,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IStyle } from '@fluentui/react';\nimport { HorizontalGalleryStyles } from '../../HorizontalGallery';\nimport { LARGE_FLOATING_MODAL_SIZE_REM, SMALL_FLOATING_MODAL_SIZE_REM } from './FloatingLocalVideo.styles';\n\n/**\r\n * @private\r\n */\nexport const horizontalGalleryContainerStyle = (shouldFloatLocalVideo: boolean, isNarrow: boolean): IStyle => {\n  return {\n    minHeight: isNarrow ? `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem` : `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n    width: shouldFloatLocalVideo ? isNarrow ? `calc(100% - ${SMALL_FLOATING_MODAL_SIZE_REM.width}rem)` : `calc(100% - ${LARGE_FLOATING_MODAL_SIZE_REM.width}rem)` : '100%',\n    paddingRight: '0.5rem'\n  };\n};\n\n/**\r\n * @private\r\n */\nexport const horizontalGalleryStyle = (isNarrow: boolean): HorizontalGalleryStyles => {\n  return {\n    children: isNarrow ? SMALL_HORIZONTAL_GALLERY_TILE_STYLE : LARGE_HORIZONTAL_GALLERY_TILE_STYLE\n  };\n};\n\n/**\r\n * Small horizontal gallery tile size in rem\r\n * @private\r\n */\nexport const SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM = {\n  height: 6.5,\n  width: 6.5\n};\n\n/**\r\n * Large horizontal gallery tile size in rem\r\n * @private\r\n */\nexport const LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM = {\n  height: 7.5,\n  minWidth: 7.5,\n  maxWidth: 13.43\n};\n\n/**\r\n * @private\r\n */\nexport const SMALL_HORIZONTAL_GALLERY_TILE_STYLE = {\n  minHeight: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  minWidth: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  maxHeight: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  maxWidth: `${SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM.width}rem`\n};\n/**\r\n * @private\r\n */\nexport const LARGE_HORIZONTAL_GALLERY_TILE_STYLE = {\n  minHeight: `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  minWidth: `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.minWidth}rem`,\n  maxHeight: `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.height}rem`,\n  maxWidth: `${LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.maxWidth}rem`,\n  width: '100%',\n  height: '100%'\n};"]}

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

@@ -1 +1 @@
-{"version":3,"file":"VideoGalleryResponsiveVerticalGallery.styles.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/styles/VideoGalleryResponsiveVerticalGallery.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAKlC,OAAO,EAAE,8CAA8C,EAAE,6BAA6B,EAAE,wCAAwC,EAAE,MAAM,6BAA6B,CAAC;AAEtK;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,oCAAoC,GAAG;IAClD,SAAS,EAAE,KAAK;IAChB,SAAS,EAAE,CAAC;IACZ,KAAK,EAAE,CAAC;CACT,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,8BAA8B,GAAG;IAC5C,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,EAAE;IACb,KAAK,EAAE,EAAE;CACV,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,qBAA8B,EAAE,QAAiB,EAAE,OAAgB,EAAU,EAAE;IAC3H,OAAO,QAAQ,IAAI,OAAO,CAAC,CAAC,CAAC;QAC3B,KAAK,EAAE,GAAG,oCAAoC,CAAC,KAAK,KAAK;QACzD,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAC,eAAe,6BAA6B,CAAC,MAAM,MAAM,CAAC,CAAC,CAAC,MAAM;QAClG,aAAa,EAAE,QAAQ;KACxB,CAAC,CAAC,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,CAAC,CAAC;QACzB,KAAK,EAAE,GAAG,oCAAoC,CAAC,KAAK,KAAK;QACzD,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAC,eAAe,8CAA8C,CAAC,MAAM,MAAM,CAAC,CAAC,CAAC,MAAM;QACnH,aAAa,EAAE,QAAQ;KACxB,CAAC,CAAC,CAAC;QACF,KAAK,EAAE,GAAG,8BAA8B,CAAC,KAAK,KAAK;QACnD,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAC,eAAe,wCAAwC,CAAC,MAAM,MAAM,CAAC,CAAC,CAAC,MAAM;QAC7G,aAAa,EAAE,QAAQ;KACxB,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,iCAAiC,GAAG;IAC/C,SAAS,EAAE,GAAG,oCAAoC,CAAC,SAAS,KAAK;IACjE,QAAQ,EAAE,GAAG,oCAAoC,CAAC,KAAK,KAAK;IAC5D,SAAS,EAAE,GAAG,oCAAoC,CAAC,SAAS,KAAK;IACjE,QAAQ,EAAE,GAAG,oCAAoC,CAAC,KAAK,KAAK;IAC5D,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;CACf,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG;IACzC,SAAS,EAAE,GAAG,8BAA8B,CAAC,SAAS,KAAK;IAC3D,QAAQ,EAAE,GAAG,8BAA8B,CAAC,KAAK,KAAK;IACtD,SAAS,EAAE,GAAG,8BAA8B,CAAC,SAAS,KAAK;IAC3D,QAAQ,EAAE,GAAG,8BAA8B,CAAC,KAAK,KAAK;IACtD,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;CACf,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,OAAgB,EAAyB,EAAE;IAC9E,OAAO,OAAO,CAAC,CAAC,CAAC;QACf,QAAQ,EAAE,iCAAiC;KAC5C,CAAC,CAAC,CAAC;QACF,QAAQ,EAAE,2BAA2B;KACtC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IStyle } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { VerticalGalleryStyles } from '../../VerticalGallery';\nimport { SHORT_VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM, SMALL_FLOATING_MODAL_SIZE_REM, VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM } from './FloatingLocalVideo.styles';\n\n/**\n * VerticalGallery tile size in rem:\n *\n * min - smallest possible size of the tile (90px)\n * max - Largest size we want the vertical tiles (144px)\n *\n * @private\n */\nexport const SHORT_VERTICAL_GALLERY_TILE_SIZE_REM = {\n  minHeight: 5.625,\n  maxHeight: 9,\n  width: 9\n};\n\n/**\n * VerticalGallery tile size in rem:\n *\n * min - smallest possible size of the tile (90px)\n * max - Largest size we want the vertical tiles (144px)\n *\n * @private\n */\nexport const VERTICAL_GALLERY_TILE_SIZE_REM = {\n  minHeight: 6.75,\n  maxHeight: 11,\n  width: 11\n};\n\n/**\n * Styles for the VerticalGallery's container set in parent.\n *\n * width is being increased by 1rem to account for the gap width desired for the VerticalGallery.\n *\n * @param shouldFloatLocalVideo whether rendered in floating layout or not\n * @returns Style set for VerticalGallery container.\n */\nexport const verticalGalleryContainerStyle = (shouldFloatLocalVideo: boolean, isNarrow: boolean, isShort: boolean): IStyle => {\n  return isNarrow && isShort ? {\n    width: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n    height: shouldFloatLocalVideo ? `calc(100% - ${SMALL_FLOATING_MODAL_SIZE_REM.height}rem)` : '100%',\n    paddingBottom: '0.5rem'\n  } : !isNarrow && isShort ? {\n    width: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n    height: shouldFloatLocalVideo ? `calc(100% - ${SHORT_VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM.height}rem)` : '100%',\n    paddingBottom: '0.5rem'\n  } : {\n    width: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n    height: shouldFloatLocalVideo ? `calc(100% - ${VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM.height}rem)` : '100%',\n    paddingBottom: '0.5rem'\n  };\n};\n\n/**\n * @private\n */\nexport const SHORT_VERTICAL_GALLERY_TILE_STYLE = {\n  minHeight: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.minHeight}rem`,\n  minWidth: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  maxHeight: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.maxHeight}rem`,\n  maxWidth: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  width: '100%',\n  height: '100%'\n};\n\n/**\n * @private\n */\nexport const VERTICAL_GALLERY_TILE_STYLE = {\n  minHeight: `${VERTICAL_GALLERY_TILE_SIZE_REM.minHeight}rem`,\n  minWidth: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  maxHeight: `${VERTICAL_GALLERY_TILE_SIZE_REM.maxHeight}rem`,\n  maxWidth: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  width: '100%',\n  height: '100%'\n};\n\n/**\n * @private\n */\nexport const verticalGalleryStyle = (isShort: boolean): VerticalGalleryStyles => {\n  return isShort ? {\n    children: SHORT_VERTICAL_GALLERY_TILE_STYLE\n  } : {\n    children: VERTICAL_GALLERY_TILE_STYLE\n  };\n};"]}
+{"version":3,"file":"VideoGalleryResponsiveVerticalGallery.styles.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/styles/VideoGalleryResponsiveVerticalGallery.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAKlC,OAAO,EAAE,8CAA8C,EAAE,6BAA6B,EAAE,wCAAwC,EAAE,MAAM,6BAA6B,CAAC;AAEtK;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,oCAAoC,GAAG;IAClD,SAAS,EAAE,KAAK;IAChB,SAAS,EAAE,CAAC;IACZ,KAAK,EAAE,CAAC;CACT,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,8BAA8B,GAAG;IAC5C,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,EAAE;IACb,KAAK,EAAE,EAAE;CACV,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,qBAA8B,EAAE,QAAiB,EAAE,OAAgB,EAAU,EAAE;IAC3H,OAAO,QAAQ,IAAI,OAAO,CAAC,CAAC,CAAC;QAC3B,KAAK,EAAE,GAAG,oCAAoC,CAAC,KAAK,KAAK;QACzD,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAC,eAAe,6BAA6B,CAAC,MAAM,MAAM,CAAC,CAAC,CAAC,MAAM;QAClG,aAAa,EAAE,QAAQ;KACxB,CAAC,CAAC,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,CAAC,CAAC;QACzB,KAAK,EAAE,GAAG,oCAAoC,CAAC,KAAK,KAAK;QACzD,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAC,eAAe,8CAA8C,CAAC,MAAM,MAAM,CAAC,CAAC,CAAC,MAAM;QACnH,aAAa,EAAE,QAAQ;KACxB,CAAC,CAAC,CAAC;QACF,KAAK,EAAE,GAAG,8BAA8B,CAAC,KAAK,KAAK;QACnD,MAAM,EAAE,qBAAqB,CAAC,CAAC,CAAC,eAAe,wCAAwC,CAAC,MAAM,MAAM,CAAC,CAAC,CAAC,MAAM;QAC7G,aAAa,EAAE,QAAQ;KACxB,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,iCAAiC,GAAG;IAC/C,SAAS,EAAE,GAAG,oCAAoC,CAAC,SAAS,KAAK;IACjE,QAAQ,EAAE,GAAG,oCAAoC,CAAC,KAAK,KAAK;IAC5D,SAAS,EAAE,GAAG,oCAAoC,CAAC,SAAS,KAAK;IACjE,QAAQ,EAAE,GAAG,oCAAoC,CAAC,KAAK,KAAK;IAC5D,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;CACf,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG;IACzC,SAAS,EAAE,GAAG,8BAA8B,CAAC,SAAS,KAAK;IAC3D,QAAQ,EAAE,GAAG,8BAA8B,CAAC,KAAK,KAAK;IACtD,SAAS,EAAE,GAAG,8BAA8B,CAAC,SAAS,KAAK;IAC3D,QAAQ,EAAE,GAAG,8BAA8B,CAAC,KAAK,KAAK;IACtD,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,MAAM;CACf,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,OAAgB,EAAyB,EAAE;IAC9E,OAAO,OAAO,CAAC,CAAC,CAAC;QACf,QAAQ,EAAE,iCAAiC;KAC5C,CAAC,CAAC,CAAC;QACF,QAAQ,EAAE,2BAA2B;KACtC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IStyle } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { VerticalGalleryStyles } from '../../VerticalGallery';\nimport { SHORT_VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM, SMALL_FLOATING_MODAL_SIZE_REM, VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM } from './FloatingLocalVideo.styles';\n\n/**\r\n * VerticalGallery tile size in rem:\r\n *\r\n * min - smallest possible size of the tile (90px)\r\n * max - Largest size we want the vertical tiles (144px)\r\n *\r\n * @private\r\n */\nexport const SHORT_VERTICAL_GALLERY_TILE_SIZE_REM = {\n  minHeight: 5.625,\n  maxHeight: 9,\n  width: 9\n};\n\n/**\r\n * VerticalGallery tile size in rem:\r\n *\r\n * min - smallest possible size of the tile (90px)\r\n * max - Largest size we want the vertical tiles (144px)\r\n *\r\n * @private\r\n */\nexport const VERTICAL_GALLERY_TILE_SIZE_REM = {\n  minHeight: 6.75,\n  maxHeight: 11,\n  width: 11\n};\n\n/**\r\n * Styles for the VerticalGallery's container set in parent.\r\n *\r\n * width is being increased by 1rem to account for the gap width desired for the VerticalGallery.\r\n *\r\n * @param shouldFloatLocalVideo whether rendered in floating layout or not\r\n * @returns Style set for VerticalGallery container.\r\n */\nexport const verticalGalleryContainerStyle = (shouldFloatLocalVideo: boolean, isNarrow: boolean, isShort: boolean): IStyle => {\n  return isNarrow && isShort ? {\n    width: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n    height: shouldFloatLocalVideo ? `calc(100% - ${SMALL_FLOATING_MODAL_SIZE_REM.height}rem)` : '100%',\n    paddingBottom: '0.5rem'\n  } : !isNarrow && isShort ? {\n    width: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n    height: shouldFloatLocalVideo ? `calc(100% - ${SHORT_VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM.height}rem)` : '100%',\n    paddingBottom: '0.5rem'\n  } : {\n    width: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n    height: shouldFloatLocalVideo ? `calc(100% - ${VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM.height}rem)` : '100%',\n    paddingBottom: '0.5rem'\n  };\n};\n\n/**\r\n * @private\r\n */\nexport const SHORT_VERTICAL_GALLERY_TILE_STYLE = {\n  minHeight: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.minHeight}rem`,\n  minWidth: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  maxHeight: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.maxHeight}rem`,\n  maxWidth: `${SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  width: '100%',\n  height: '100%'\n};\n\n/**\r\n * @private\r\n */\nexport const VERTICAL_GALLERY_TILE_STYLE = {\n  minHeight: `${VERTICAL_GALLERY_TILE_SIZE_REM.minHeight}rem`,\n  minWidth: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  maxHeight: `${VERTICAL_GALLERY_TILE_SIZE_REM.maxHeight}rem`,\n  maxWidth: `${VERTICAL_GALLERY_TILE_SIZE_REM.width}rem`,\n  width: '100%',\n  height: '100%'\n};\n\n/**\r\n * @private\r\n */\nexport const verticalGalleryStyle = (isShort: boolean): VerticalGalleryStyles => {\n  return isShort ? {\n    children: SHORT_VERTICAL_GALLERY_TILE_STYLE\n  } : {\n    children: VERTICAL_GALLERY_TILE_STYLE\n  };\n};"]}

package/dist/dist-esm/react-components/src/components/VideoGallery/useVideoStreamLifecycleMaintainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVideoStreamLifecycleMaintainer.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/VideoGallery/useVideoStreamLifecycleMaintainer.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { useEffect, useMemo, useState } from 'react';\nimport { VideoStreamOptions, CreateVideoStreamViewResult, ViewScalingMode } from '../../types';\nimport { callingComponentLogger } from '../utils/Logger';\n\n/** @private */\nexport interface VideoStreamLifecycleMaintainerExtendableProps {\n  isStreamAvailable?: boolean;\n  renderElementExists?: boolean;\n  isMirrored?: boolean;\n  scalingMode?: ViewScalingMode;\n  isScreenSharingOn?: boolean;\n  streamId?: number;\n  isVideoPermitted?: boolean;\n}\ninterface VideoStreamLifecycleMaintainerProps extends VideoStreamLifecycleMaintainerExtendableProps {\n  onCreateStreamView: (options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult> | undefined;\n  onDisposeStreamView: () => void | undefined;\n}\n\n/**\n * Helper hook to maintain the video stream lifecycle. This calls onCreateStreamView and onDisposeStreamView\n * appropriately based on react lifecycle events and prop changes.\n *\n * @remarks\n *\n * Notes on handling changes to scaling mode:\n *\n * Ideally we have access to the original StreamRenderView and can call view.updateScalingMode() and do not need to recreate the stream view.\n * However, to support backwards compat we cannot guarantee this. If we don't have access to the original StreamRenderView we need to dispose\n * the old view and create a new one.\n *\n * Supporting both of these scenarios became too complex and fragile. When we introduce a breaking change this should be update to ensure that\n * onCreateStreamView _must_ return a view object with updateScalingMode and update logic in this hook to call view.updateScalingMode instead\n * of recreating the stream.\n *\n * @private\n */\nconst useVideoStreamLifecycleMaintainer = (props: VideoStreamLifecycleMaintainerProps): CreateVideoStreamViewResult | undefined => {\n  const {\n    isMirrored,\n    isScreenSharingOn,\n    isStreamAvailable,\n    onCreateStreamView,\n    onDisposeStreamView,\n    renderElementExists,\n    scalingMode,\n    streamId,\n    isVideoPermitted\n  } = props;\n  const [videoStreamViewResult, setVideoStreamViewResult] = useState<CreateVideoStreamViewResult | undefined>();\n  useEffect(() => {\n    if (isVideoPermitted !== false && isStreamAvailable && !renderElementExists) {\n      onCreateStreamView?.({\n        isMirrored,\n        scalingMode\n      })?.then(result => {\n        result && setVideoStreamViewResult(result);\n      });\n    }\n\n    // Always clean up element to make tile up to date and be able to dispose correctly\n    return () => {\n      if (renderElementExists) {\n        // TODO: Remove `if isScreenSharingOn` when we isolate dispose behavior for screen share\n        if (!isScreenSharingOn) {\n          onDisposeStreamView?.();\n        }\n      } else {\n        callingComponentLogger.warning('Stream view element does not exist when disposing stream view');\n      }\n    };\n  }, [isMirrored, isScreenSharingOn, isStreamAvailable, onCreateStreamView, onDisposeStreamView, renderElementExists, scalingMode, streamId, isVideoPermitted]);\n\n  // The execution order for above useEffect is onCreateRemoteStreamView =>(async time gap) RenderElement generated => element disposed => onDisposeRemoteStreamView\n  // Element disposed could happen during async time gap, which still cause leaks for unused renderElement.\n  // Need to do an entire cleanup when remoteTile gets disposed and make sure element gets correctly disposed\n  useEffect(() => {\n    return () => {\n      // TODO: Remove `if isScreenSharingOn` when we isolate dispose behavior for screen share\n      if (!isScreenSharingOn) {\n        onDisposeStreamView?.();\n      }\n    };\n  }, [isScreenSharingOn, onDisposeStreamView]);\n  return videoStreamViewResult;\n};\n\n/** @private */\nexport interface LocalVideoStreamLifecycleMaintainerProps extends VideoStreamLifecycleMaintainerExtendableProps {\n  onCreateLocalStreamView?: (options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult>;\n  onDisposeLocalStreamView?: () => void;\n}\n\n/**\n * Extension of {@link useVideoStreamLifecycleMaintainer} specifically for local video streams\n *\n * @private\n */\nexport const useLocalVideoStreamLifecycleMaintainer = (props: LocalVideoStreamLifecycleMaintainerProps): CreateVideoStreamViewResult | undefined => {\n  const {\n    onCreateLocalStreamView,\n    onDisposeLocalStreamView\n  } = props;\n  const onCreateStreamView = useMemo(() => (options?: VideoStreamOptions) => {\n    return onCreateLocalStreamView?.(options);\n  }, [onCreateLocalStreamView]);\n  const onDisposeStreamView = useMemo(() => () => {\n    onDisposeLocalStreamView?.();\n  }, [onDisposeLocalStreamView]);\n  return useVideoStreamLifecycleMaintainer({\n    ...props,\n    onCreateStreamView,\n    onDisposeStreamView\n  });\n};\n\n/** @private */\nexport interface RemoteVideoStreamLifecycleMaintainerProps extends VideoStreamLifecycleMaintainerExtendableProps {\n  onCreateRemoteStreamView?: (userId: string, options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult>;\n  onDisposeRemoteStreamView?: (userId: string) => Promise<void>;\n  remoteParticipantId: string;\n}\n\n/**\n * Extension of {@link useVideoStreamLifecycleMaintainer} specifically for remote video streams\n *\n * @private\n */\nexport const useRemoteVideoStreamLifecycleMaintainer = (props: RemoteVideoStreamLifecycleMaintainerProps): CreateVideoStreamViewResult | undefined => {\n  const {\n    remoteParticipantId,\n    onCreateRemoteStreamView,\n    onDisposeRemoteStreamView\n  } = props;\n  const onCreateStreamView = useMemo(() => (options?: VideoStreamOptions) => {\n    return onCreateRemoteStreamView?.(remoteParticipantId, options);\n  }, [onCreateRemoteStreamView, remoteParticipantId]);\n  const onDisposeStreamView = useMemo(() => () => {\n    onDisposeRemoteStreamView?.(remoteParticipantId);\n  }, [onDisposeRemoteStreamView, remoteParticipantId]);\n  return useVideoStreamLifecycleMaintainer({\n    ...props,\n    onCreateStreamView,\n    onDisposeStreamView\n  });\n};"]}
+{"version":3,"file":"useVideoStreamLifecycleMaintainer.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/VideoGallery/useVideoStreamLifecycleMaintainer.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { useEffect, useMemo, useState } from 'react';\nimport { VideoStreamOptions, CreateVideoStreamViewResult, ViewScalingMode } from '../../types';\nimport { callingComponentLogger } from '../utils/Logger';\n\n/** @private */\nexport interface VideoStreamLifecycleMaintainerExtendableProps {\n  isStreamAvailable?: boolean;\n  renderElementExists?: boolean;\n  isMirrored?: boolean;\n  scalingMode?: ViewScalingMode;\n  isScreenSharingOn?: boolean;\n  streamId?: number;\n  isVideoPermitted?: boolean;\n}\ninterface VideoStreamLifecycleMaintainerProps extends VideoStreamLifecycleMaintainerExtendableProps {\n  onCreateStreamView: (options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult> | undefined;\n  onDisposeStreamView: () => void | undefined;\n}\n\n/**\r\n * Helper hook to maintain the video stream lifecycle. This calls onCreateStreamView and onDisposeStreamView\r\n * appropriately based on react lifecycle events and prop changes.\r\n *\r\n * @remarks\r\n *\r\n * Notes on handling changes to scaling mode:\r\n *\r\n * Ideally we have access to the original StreamRenderView and can call view.updateScalingMode() and do not need to recreate the stream view.\r\n * However, to support backwards compat we cannot guarantee this. If we don't have access to the original StreamRenderView we need to dispose\r\n * the old view and create a new one.\r\n *\r\n * Supporting both of these scenarios became too complex and fragile. When we introduce a breaking change this should be update to ensure that\r\n * onCreateStreamView _must_ return a view object with updateScalingMode and update logic in this hook to call view.updateScalingMode instead\r\n * of recreating the stream.\r\n *\r\n * @private\r\n */\nconst useVideoStreamLifecycleMaintainer = (props: VideoStreamLifecycleMaintainerProps): CreateVideoStreamViewResult | undefined => {\n  const {\n    isMirrored,\n    isScreenSharingOn,\n    isStreamAvailable,\n    onCreateStreamView,\n    onDisposeStreamView,\n    renderElementExists,\n    scalingMode,\n    streamId,\n    isVideoPermitted\n  } = props;\n  const [videoStreamViewResult, setVideoStreamViewResult] = useState<CreateVideoStreamViewResult | undefined>();\n  useEffect(() => {\n    if (isVideoPermitted !== false && isStreamAvailable && !renderElementExists) {\n      onCreateStreamView?.({\n        isMirrored,\n        scalingMode\n      })?.then(result => {\n        result && setVideoStreamViewResult(result);\n      });\n    }\n\n    // Always clean up element to make tile up to date and be able to dispose correctly\n    return () => {\n      if (renderElementExists) {\n        // TODO: Remove `if isScreenSharingOn` when we isolate dispose behavior for screen share\n        if (!isScreenSharingOn) {\n          onDisposeStreamView?.();\n        }\n      } else {\n        callingComponentLogger.warning('Stream view element does not exist when disposing stream view');\n      }\n    };\n  }, [isMirrored, isScreenSharingOn, isStreamAvailable, onCreateStreamView, onDisposeStreamView, renderElementExists, scalingMode, streamId, isVideoPermitted]);\n\n  // The execution order for above useEffect is onCreateRemoteStreamView =>(async time gap) RenderElement generated => element disposed => onDisposeRemoteStreamView\n  // Element disposed could happen during async time gap, which still cause leaks for unused renderElement.\n  // Need to do an entire cleanup when remoteTile gets disposed and make sure element gets correctly disposed\n  useEffect(() => {\n    return () => {\n      // TODO: Remove `if isScreenSharingOn` when we isolate dispose behavior for screen share\n      if (!isScreenSharingOn) {\n        onDisposeStreamView?.();\n      }\n    };\n  }, [isScreenSharingOn, onDisposeStreamView]);\n  return videoStreamViewResult;\n};\n\n/** @private */\nexport interface LocalVideoStreamLifecycleMaintainerProps extends VideoStreamLifecycleMaintainerExtendableProps {\n  onCreateLocalStreamView?: (options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult>;\n  onDisposeLocalStreamView?: () => void;\n}\n\n/**\r\n * Extension of {@link useVideoStreamLifecycleMaintainer} specifically for local video streams\r\n *\r\n * @private\r\n */\nexport const useLocalVideoStreamLifecycleMaintainer = (props: LocalVideoStreamLifecycleMaintainerProps): CreateVideoStreamViewResult | undefined => {\n  const {\n    onCreateLocalStreamView,\n    onDisposeLocalStreamView\n  } = props;\n  const onCreateStreamView = useMemo(() => (options?: VideoStreamOptions) => {\n    return onCreateLocalStreamView?.(options);\n  }, [onCreateLocalStreamView]);\n  const onDisposeStreamView = useMemo(() => () => {\n    onDisposeLocalStreamView?.();\n  }, [onDisposeLocalStreamView]);\n  return useVideoStreamLifecycleMaintainer({\n    ...props,\n    onCreateStreamView,\n    onDisposeStreamView\n  });\n};\n\n/** @private */\nexport interface RemoteVideoStreamLifecycleMaintainerProps extends VideoStreamLifecycleMaintainerExtendableProps {\n  onCreateRemoteStreamView?: (userId: string, options?: VideoStreamOptions) => Promise<void | CreateVideoStreamViewResult>;\n  onDisposeRemoteStreamView?: (userId: string) => Promise<void>;\n  remoteParticipantId: string;\n}\n\n/**\r\n * Extension of {@link useVideoStreamLifecycleMaintainer} specifically for remote video streams\r\n *\r\n * @private\r\n */\nexport const useRemoteVideoStreamLifecycleMaintainer = (props: RemoteVideoStreamLifecycleMaintainerProps): CreateVideoStreamViewResult | undefined => {\n  const {\n    remoteParticipantId,\n    onCreateRemoteStreamView,\n    onDisposeRemoteStreamView\n  } = props;\n  const onCreateStreamView = useMemo(() => (options?: VideoStreamOptions) => {\n    return onCreateRemoteStreamView?.(remoteParticipantId, options);\n  }, [onCreateRemoteStreamView, remoteParticipantId]);\n  const onDisposeStreamView = useMemo(() => () => {\n    onDisposeRemoteStreamView?.(remoteParticipantId);\n  }, [onDisposeRemoteStreamView, remoteParticipantId]);\n  return useVideoStreamLifecycleMaintainer({\n    ...props,\n    onCreateStreamView,\n    onDisposeStreamView\n  });\n};"]}

package/dist/dist-esm/react-components/src/components/VideoGallery/useVideoTileContextualMenuProps.js

@@ -174,7 +174,7 @@ export const useVideoTileContextualMenuProps = (props) => {
                         }
                     },
                     onClick: () => onStopSpotlight([participant.userId]),
-                    ariaLabel: strings.stopSpotlightVideoTileMenuLabel
+                    ariaLabel: stopSpotlightMenuLabel
                 });
             }
         }

package/dist/dist-esm/react-components/src/components/VideoGallery/useVideoTileContextualMenuProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVideoTileContextualMenuProps.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/VideoGallery/useVideoTileContextualMenuProps.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IContextualMenuItem, IContextualMenuProps } from '@fluentui/react';\nimport { _formatString } from '@internal/acs-ui-common';\nimport { useMemo } from 'react';\nimport { VideoGalleryParticipant, ViewScalingMode } from '../../types';\nimport { _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\n\n/**\n * @private\n */\nexport const useVideoTileContextualMenuProps = (props: {\n  participant: VideoGalleryParticipant;\n  strings?: {\n    fitRemoteParticipantToFrame?: string;\n    fillRemoteParticipantFrame?: string;\n    pinParticipantForMe?: string;\n    pinParticipantForMeLimitReached?: string;\n    unpinParticipantForMe?: string;\n    pinParticipantMenuItemAriaLabel?: string;\n    unpinParticipantMenuItemAriaLabel?: string;\n    pinnedParticipantAnnouncementAriaLabel?: string;\n    unpinnedParticipantAnnouncementAriaLabel?: string;\n    startSpotlightVideoTileMenuLabel?: string;\n    addSpotlightVideoTileMenuLabel?: string;\n    stopSpotlightVideoTileMenuLabel?: string;\n    stopSpotlightOnSelfVideoTileMenuLabel?: string;\n    spotlightLimitReachedMenuTitle?: string;\n    muteParticipantMenuItemLabel?: string;\n    forbidAudioTileMenuLabel?: string;\n    permitAudioTileMenuLabel?: string;\n    forbidVideoTileMenuLabel?: string;\n    permitVideoTileMenuLabel?: string;\n  };\n  view?: {\n    updateScalingMode: (scalingMode: ViewScalingMode) => Promise<void>;\n  };\n  isPinned?: boolean;\n  onPinParticipant?: (userId: string) => void;\n  onUnpinParticipant?: (userId: string) => void;\n  onUpdateScalingMode?: (userId: string, scalingMode: ViewScalingMode) => void;\n  disablePinMenuItem?: boolean;\n  toggleAnnouncerString?: (announcerString: string) => void;\n  isSpotlighted?: boolean;\n  spotlightedParticipantUserIds?: string[];\n  onStartSpotlight?: (userIds: string[]) => void;\n  onStopSpotlight?: (userIds: string[]) => void;\n  maxParticipantsToSpotlight?: number;\n  myUserId?: string;\n  onMuteParticipant?: (userId: string) => void;\n  onForbidAudio?: (userIds: string[]) => void;\n  onPermitAudio?: (userIds: string[]) => void;\n  onForbidVideo?: (userIds: string[]) => void;\n  onPermitVideo?: (userIds: string[]) => void;\n}): IContextualMenuProps | undefined => {\n  const {\n    participant,\n    view,\n    strings,\n    isPinned,\n    onPinParticipant,\n    onUnpinParticipant,\n    onUpdateScalingMode,\n    disablePinMenuItem,\n    toggleAnnouncerString,\n    spotlightedParticipantUserIds = [],\n    isSpotlighted,\n    onStartSpotlight,\n    onStopSpotlight,\n    maxParticipantsToSpotlight,\n    myUserId,\n    onMuteParticipant,\n    onForbidAudio,\n    onPermitAudio,\n    onForbidVideo,\n    onPermitVideo\n  } = props;\n  const scalingMode = useMemo(() => {\n    return props.participant.videoStream?.scalingMode;\n  }, [props.participant.videoStream?.scalingMode]);\n  const contextualMenuProps: IContextualMenuProps | undefined = useMemo(() => {\n    const items: IContextualMenuItem[] = [];\n    if (onMuteParticipant && strings?.muteParticipantMenuItemLabel) {\n      items.push({\n        key: 'mute',\n        text: strings?.muteParticipantMenuItemLabel,\n        iconProps: {\n          iconName: 'ContextualMenuMicMutedIcon',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onMuteParticipant(participant.userId),\n        'data-ui-id': 'video-tile-mute-participant',\n        ariaLabel: strings?.muteParticipantMenuItemLabel,\n        disabled: participant.isMuted\n      });\n    }\n    if (participant.canAudioBeForbidden && participant.mediaAccess && !participant.mediaAccess.isAudioPermitted && onPermitAudio) {\n      items.push({\n        key: 'permitAudio',\n        text: strings?.permitAudioTileMenuLabel,\n        iconProps: {\n          iconName: 'ControlButtonMicOn',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onPermitAudio([participant.userId]),\n        'data-ui-id': 'video-tile-permit-audio',\n        ariaLabel: strings?.permitAudioTileMenuLabel\n      });\n    }\n    if (participant.canAudioBeForbidden && participant.mediaAccess?.isAudioPermitted && onForbidAudio) {\n      items.push({\n        key: 'forbidAudio',\n        text: strings?.forbidAudioTileMenuLabel,\n        iconProps: {\n          iconName: 'ControlButtonMicProhibited',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onForbidAudio([participant.userId]),\n        'data-ui-id': 'video-tile-forbid-audio',\n        ariaLabel: strings?.forbidAudioTileMenuLabel\n      });\n    }\n    if (participant.canVideoBeForbidden && participant.mediaAccess && !participant.mediaAccess.isVideoPermitted && onPermitVideo) {\n      items.push({\n        key: 'permitVideo',\n        text: strings?.permitVideoTileMenuLabel,\n        iconProps: {\n          iconName: 'ControlButtonCameraOn',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onPermitVideo([participant.userId]),\n        'data-ui-id': 'video-tile-permit-video',\n        ariaLabel: strings?.permitVideoTileMenuLabel\n      });\n    }\n    if (participant.canVideoBeForbidden && participant.mediaAccess?.isVideoPermitted && onForbidVideo) {\n      items.push({\n        key: 'forbidVideo',\n        text: strings?.forbidVideoTileMenuLabel,\n        iconProps: {\n          iconName: 'ControlButtonCameraProhibited',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onForbidVideo([participant.userId]),\n        'data-ui-id': 'video-tile-forbid-video',\n        ariaLabel: strings?.forbidVideoTileMenuLabel\n      });\n    }\n    if (isPinned !== undefined) {\n      if (isPinned && onUnpinParticipant && strings?.unpinParticipantForMe) {\n        let unpinActionString: string | undefined = undefined;\n        if (toggleAnnouncerString && strings.unpinParticipantMenuItemAriaLabel && participant.displayName) {\n          unpinActionString = _formatString(strings?.unpinParticipantMenuItemAriaLabel, {\n            participantName: participant.displayName\n          });\n        }\n        items.push({\n          key: 'unpin',\n          text: strings.unpinParticipantForMe,\n          iconProps: {\n            iconName: 'UnpinParticipant',\n            styles: {\n              root: {\n                lineHeight: '1rem',\n                textAlign: 'center'\n              }\n            }\n          },\n          onClick: () => {\n            onUnpinParticipant(participant.userId);\n            unpinActionString && toggleAnnouncerString?.(unpinActionString);\n          },\n          'data-ui-id': 'video-tile-unpin-participant-button',\n          ariaLabel: unpinActionString\n        });\n      }\n      if (!isPinned && onPinParticipant && strings?.pinParticipantForMe) {\n        let pinActionString: string | undefined = undefined;\n        if (toggleAnnouncerString && strings.pinnedParticipantAnnouncementAriaLabel && participant.displayName) {\n          pinActionString = _formatString(strings?.pinnedParticipantAnnouncementAriaLabel, {\n            participantName: participant.displayName\n          });\n        }\n        items.push({\n          key: 'pin',\n          text: disablePinMenuItem ? strings.pinParticipantForMeLimitReached : strings.pinParticipantForMe,\n          iconProps: {\n            iconName: 'PinParticipant',\n            styles: {\n              root: {\n                lineHeight: '1rem',\n                textAlign: 'center'\n              }\n            }\n          },\n          onClick: () => {\n            onPinParticipant(participant.userId);\n            pinActionString && toggleAnnouncerString?.(pinActionString);\n          },\n          'data-ui-id': 'video-tile-pin-participant-button',\n          disabled: disablePinMenuItem || isSpotlighted,\n          ariaLabel: strings.pinParticipantForMe\n        });\n      }\n    }\n    if (isSpotlighted) {\n      const stopSpotlightMenuLabel = myUserId === participant.userId ? strings?.stopSpotlightOnSelfVideoTileMenuLabel : strings?.stopSpotlightVideoTileMenuLabel;\n      if (onStopSpotlight && participant.userId && strings?.stopSpotlightVideoTileMenuLabel) {\n        items.push({\n          key: 'stopSpotlight',\n          text: stopSpotlightMenuLabel,\n          iconProps: {\n            iconName: 'StopSpotlightContextualMenuItem',\n            styles: {\n              root: {\n                lineHeight: 0\n              }\n            }\n          },\n          onClick: () => onStopSpotlight([participant.userId]),\n          ariaLabel: strings.stopSpotlightVideoTileMenuLabel\n        });\n      }\n    } else {\n      const startSpotlightMenuLabel = spotlightedParticipantUserIds && spotlightedParticipantUserIds.length > 0 ? strings?.addSpotlightVideoTileMenuLabel : strings?.startSpotlightVideoTileMenuLabel;\n      const maxSpotlightedParticipantsReached = maxParticipantsToSpotlight ? spotlightedParticipantUserIds.length >= maxParticipantsToSpotlight : false;\n      if (onStartSpotlight && participant.userId && startSpotlightMenuLabel) {\n        items.push({\n          key: 'startSpotlight',\n          text: startSpotlightMenuLabel,\n          iconProps: {\n            iconName: 'StartSpotlightContextualMenuItem',\n            styles: {\n              root: {\n                lineHeight: 0\n              }\n            }\n          },\n          onClick: () => onStartSpotlight([participant.userId]),\n          ariaLabel: startSpotlightMenuLabel,\n          disabled: maxSpotlightedParticipantsReached,\n          title: maxSpotlightedParticipantsReached ? strings?.spotlightLimitReachedMenuTitle : undefined\n        });\n      }\n    }\n    if (scalingMode) {\n      if (scalingMode === 'Crop' && strings?.fitRemoteParticipantToFrame) {\n        items.push({\n          key: 'fitRemoteParticipantToFrame',\n          text: strings.fitRemoteParticipantToFrame,\n          iconProps: {\n            iconName: 'VideoTileScaleFit',\n            styles: {\n              root: {\n                lineHeight: '1rem',\n                textAlign: 'center'\n              }\n            }\n          },\n          onClick: () => {\n            onUpdateScalingMode?.(participant.userId, 'Fit');\n            view?.updateScalingMode('Fit');\n          },\n          'data-ui-id': 'video-tile-fit-to-frame',\n          ariaLabel: strings.fitRemoteParticipantToFrame\n        });\n      } else if (scalingMode === 'Fit' && strings?.fillRemoteParticipantFrame) {\n        items.push({\n          key: 'fillRemoteParticipantFrame',\n          text: strings.fillRemoteParticipantFrame,\n          iconProps: {\n            iconName: 'VideoTileScaleFill',\n            styles: {\n              root: {\n                lineHeight: '1rem',\n                textAlign: 'center'\n              }\n            }\n          },\n          onClick: () => {\n            onUpdateScalingMode?.(participant.userId, 'Crop');\n            view?.updateScalingMode('Crop');\n          },\n          'data-ui-id': 'video-tile-fill-frame',\n          ariaLabel: strings.fillRemoteParticipantFrame\n        });\n      }\n    }\n    if (items.length === 0) {\n      return undefined;\n    }\n    return {\n      items,\n      styles: {},\n      calloutProps: {\n        preventDismissOnEvent\n      },\n      shouldFocusOnContainer: false\n    };\n  }, [onMuteParticipant, strings, participant.isMuted, participant.userId, participant.displayName, isPinned, isSpotlighted, scalingMode, onUnpinParticipant, onPinParticipant, toggleAnnouncerString, disablePinMenuItem, myUserId, onStopSpotlight, spotlightedParticipantUserIds, maxParticipantsToSpotlight, onStartSpotlight, onUpdateScalingMode, view, participant.canAudioBeForbidden, participant.canVideoBeForbidden, participant.mediaAccess, onPermitAudio, onForbidAudio, onPermitVideo, onForbidVideo]);\n  return contextualMenuProps;\n};"]}
+{"version":3,"file":"useVideoTileContextualMenuProps.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/VideoGallery/useVideoTileContextualMenuProps.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IContextualMenuItem, IContextualMenuProps } from '@fluentui/react';\nimport { _formatString } from '@internal/acs-ui-common';\nimport { useMemo } from 'react';\nimport { VideoGalleryParticipant, ViewScalingMode } from '../../types';\nimport { _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\n\n/**\r\n * @private\r\n */\nexport const useVideoTileContextualMenuProps = (props: {\n  participant: VideoGalleryParticipant;\n  strings?: {\n    fitRemoteParticipantToFrame?: string;\n    fillRemoteParticipantFrame?: string;\n    pinParticipantForMe?: string;\n    pinParticipantForMeLimitReached?: string;\n    unpinParticipantForMe?: string;\n    pinParticipantMenuItemAriaLabel?: string;\n    unpinParticipantMenuItemAriaLabel?: string;\n    pinnedParticipantAnnouncementAriaLabel?: string;\n    unpinnedParticipantAnnouncementAriaLabel?: string;\n    startSpotlightVideoTileMenuLabel?: string;\n    addSpotlightVideoTileMenuLabel?: string;\n    stopSpotlightVideoTileMenuLabel?: string;\n    stopSpotlightOnSelfVideoTileMenuLabel?: string;\n    spotlightLimitReachedMenuTitle?: string;\n    muteParticipantMenuItemLabel?: string;\n    forbidAudioTileMenuLabel?: string;\n    permitAudioTileMenuLabel?: string;\n    forbidVideoTileMenuLabel?: string;\n    permitVideoTileMenuLabel?: string;\n  };\n  view?: {\n    updateScalingMode: (scalingMode: ViewScalingMode) => Promise<void>;\n  };\n  isPinned?: boolean;\n  onPinParticipant?: (userId: string) => void;\n  onUnpinParticipant?: (userId: string) => void;\n  onUpdateScalingMode?: (userId: string, scalingMode: ViewScalingMode) => void;\n  disablePinMenuItem?: boolean;\n  toggleAnnouncerString?: (announcerString: string) => void;\n  isSpotlighted?: boolean;\n  spotlightedParticipantUserIds?: string[];\n  onStartSpotlight?: (userIds: string[]) => void;\n  onStopSpotlight?: (userIds: string[]) => void;\n  maxParticipantsToSpotlight?: number;\n  myUserId?: string;\n  onMuteParticipant?: (userId: string) => void;\n  onForbidAudio?: (userIds: string[]) => void;\n  onPermitAudio?: (userIds: string[]) => void;\n  onForbidVideo?: (userIds: string[]) => void;\n  onPermitVideo?: (userIds: string[]) => void;\n}): IContextualMenuProps | undefined => {\n  const {\n    participant,\n    view,\n    strings,\n    isPinned,\n    onPinParticipant,\n    onUnpinParticipant,\n    onUpdateScalingMode,\n    disablePinMenuItem,\n    toggleAnnouncerString,\n    spotlightedParticipantUserIds = [],\n    isSpotlighted,\n    onStartSpotlight,\n    onStopSpotlight,\n    maxParticipantsToSpotlight,\n    myUserId,\n    onMuteParticipant,\n    onForbidAudio,\n    onPermitAudio,\n    onForbidVideo,\n    onPermitVideo\n  } = props;\n  const scalingMode = useMemo(() => {\n    return props.participant.videoStream?.scalingMode;\n  }, [props.participant.videoStream?.scalingMode]);\n  const contextualMenuProps: IContextualMenuProps | undefined = useMemo(() => {\n    const items: IContextualMenuItem[] = [];\n    if (onMuteParticipant && strings?.muteParticipantMenuItemLabel) {\n      items.push({\n        key: 'mute',\n        text: strings?.muteParticipantMenuItemLabel,\n        iconProps: {\n          iconName: 'ContextualMenuMicMutedIcon',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onMuteParticipant(participant.userId),\n        'data-ui-id': 'video-tile-mute-participant',\n        ariaLabel: strings?.muteParticipantMenuItemLabel,\n        disabled: participant.isMuted\n      });\n    }\n    if (participant.canAudioBeForbidden && participant.mediaAccess && !participant.mediaAccess.isAudioPermitted && onPermitAudio) {\n      items.push({\n        key: 'permitAudio',\n        text: strings?.permitAudioTileMenuLabel,\n        iconProps: {\n          iconName: 'ControlButtonMicOn',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onPermitAudio([participant.userId]),\n        'data-ui-id': 'video-tile-permit-audio',\n        ariaLabel: strings?.permitAudioTileMenuLabel\n      });\n    }\n    if (participant.canAudioBeForbidden && participant.mediaAccess?.isAudioPermitted && onForbidAudio) {\n      items.push({\n        key: 'forbidAudio',\n        text: strings?.forbidAudioTileMenuLabel,\n        iconProps: {\n          iconName: 'ControlButtonMicProhibited',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onForbidAudio([participant.userId]),\n        'data-ui-id': 'video-tile-forbid-audio',\n        ariaLabel: strings?.forbidAudioTileMenuLabel\n      });\n    }\n    if (participant.canVideoBeForbidden && participant.mediaAccess && !participant.mediaAccess.isVideoPermitted && onPermitVideo) {\n      items.push({\n        key: 'permitVideo',\n        text: strings?.permitVideoTileMenuLabel,\n        iconProps: {\n          iconName: 'ControlButtonCameraOn',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onPermitVideo([participant.userId]),\n        'data-ui-id': 'video-tile-permit-video',\n        ariaLabel: strings?.permitVideoTileMenuLabel\n      });\n    }\n    if (participant.canVideoBeForbidden && participant.mediaAccess?.isVideoPermitted && onForbidVideo) {\n      items.push({\n        key: 'forbidVideo',\n        text: strings?.forbidVideoTileMenuLabel,\n        iconProps: {\n          iconName: 'ControlButtonCameraProhibited',\n          styles: {\n            root: {\n              lineHeight: 0\n            }\n          }\n        },\n        onClick: () => onForbidVideo([participant.userId]),\n        'data-ui-id': 'video-tile-forbid-video',\n        ariaLabel: strings?.forbidVideoTileMenuLabel\n      });\n    }\n    if (isPinned !== undefined) {\n      if (isPinned && onUnpinParticipant && strings?.unpinParticipantForMe) {\n        let unpinActionString: string | undefined = undefined;\n        if (toggleAnnouncerString && strings.unpinParticipantMenuItemAriaLabel && participant.displayName) {\n          unpinActionString = _formatString(strings?.unpinParticipantMenuItemAriaLabel, {\n            participantName: participant.displayName\n          });\n        }\n        items.push({\n          key: 'unpin',\n          text: strings.unpinParticipantForMe,\n          iconProps: {\n            iconName: 'UnpinParticipant',\n            styles: {\n              root: {\n                lineHeight: '1rem',\n                textAlign: 'center'\n              }\n            }\n          },\n          onClick: () => {\n            onUnpinParticipant(participant.userId);\n            unpinActionString && toggleAnnouncerString?.(unpinActionString);\n          },\n          'data-ui-id': 'video-tile-unpin-participant-button',\n          ariaLabel: unpinActionString\n        });\n      }\n      if (!isPinned && onPinParticipant && strings?.pinParticipantForMe) {\n        let pinActionString: string | undefined = undefined;\n        if (toggleAnnouncerString && strings.pinnedParticipantAnnouncementAriaLabel && participant.displayName) {\n          pinActionString = _formatString(strings?.pinnedParticipantAnnouncementAriaLabel, {\n            participantName: participant.displayName\n          });\n        }\n        items.push({\n          key: 'pin',\n          text: disablePinMenuItem ? strings.pinParticipantForMeLimitReached : strings.pinParticipantForMe,\n          iconProps: {\n            iconName: 'PinParticipant',\n            styles: {\n              root: {\n                lineHeight: '1rem',\n                textAlign: 'center'\n              }\n            }\n          },\n          onClick: () => {\n            onPinParticipant(participant.userId);\n            pinActionString && toggleAnnouncerString?.(pinActionString);\n          },\n          'data-ui-id': 'video-tile-pin-participant-button',\n          disabled: disablePinMenuItem || isSpotlighted,\n          ariaLabel: strings.pinParticipantForMe\n        });\n      }\n    }\n    if (isSpotlighted) {\n      const stopSpotlightMenuLabel = myUserId === participant.userId ? strings?.stopSpotlightOnSelfVideoTileMenuLabel : strings?.stopSpotlightVideoTileMenuLabel;\n      if (onStopSpotlight && participant.userId && strings?.stopSpotlightVideoTileMenuLabel) {\n        items.push({\n          key: 'stopSpotlight',\n          text: stopSpotlightMenuLabel,\n          iconProps: {\n            iconName: 'StopSpotlightContextualMenuItem',\n            styles: {\n              root: {\n                lineHeight: 0\n              }\n            }\n          },\n          onClick: () => onStopSpotlight([participant.userId]),\n          ariaLabel: stopSpotlightMenuLabel\n        });\n      }\n    } else {\n      const startSpotlightMenuLabel = spotlightedParticipantUserIds && spotlightedParticipantUserIds.length > 0 ? strings?.addSpotlightVideoTileMenuLabel : strings?.startSpotlightVideoTileMenuLabel;\n      const maxSpotlightedParticipantsReached = maxParticipantsToSpotlight ? spotlightedParticipantUserIds.length >= maxParticipantsToSpotlight : false;\n      if (onStartSpotlight && participant.userId && startSpotlightMenuLabel) {\n        items.push({\n          key: 'startSpotlight',\n          text: startSpotlightMenuLabel,\n          iconProps: {\n            iconName: 'StartSpotlightContextualMenuItem',\n            styles: {\n              root: {\n                lineHeight: 0\n              }\n            }\n          },\n          onClick: () => onStartSpotlight([participant.userId]),\n          ariaLabel: startSpotlightMenuLabel,\n          disabled: maxSpotlightedParticipantsReached,\n          title: maxSpotlightedParticipantsReached ? strings?.spotlightLimitReachedMenuTitle : undefined\n        });\n      }\n    }\n    if (scalingMode) {\n      if (scalingMode === 'Crop' && strings?.fitRemoteParticipantToFrame) {\n        items.push({\n          key: 'fitRemoteParticipantToFrame',\n          text: strings.fitRemoteParticipantToFrame,\n          iconProps: {\n            iconName: 'VideoTileScaleFit',\n            styles: {\n              root: {\n                lineHeight: '1rem',\n                textAlign: 'center'\n              }\n            }\n          },\n          onClick: () => {\n            onUpdateScalingMode?.(participant.userId, 'Fit');\n            view?.updateScalingMode('Fit');\n          },\n          'data-ui-id': 'video-tile-fit-to-frame',\n          ariaLabel: strings.fitRemoteParticipantToFrame\n        });\n      } else if (scalingMode === 'Fit' && strings?.fillRemoteParticipantFrame) {\n        items.push({\n          key: 'fillRemoteParticipantFrame',\n          text: strings.fillRemoteParticipantFrame,\n          iconProps: {\n            iconName: 'VideoTileScaleFill',\n            styles: {\n              root: {\n                lineHeight: '1rem',\n                textAlign: 'center'\n              }\n            }\n          },\n          onClick: () => {\n            onUpdateScalingMode?.(participant.userId, 'Crop');\n            view?.updateScalingMode('Crop');\n          },\n          'data-ui-id': 'video-tile-fill-frame',\n          ariaLabel: strings.fillRemoteParticipantFrame\n        });\n      }\n    }\n    if (items.length === 0) {\n      return undefined;\n    }\n    return {\n      items,\n      styles: {},\n      calloutProps: {\n        preventDismissOnEvent\n      },\n      shouldFocusOnContainer: false\n    };\n  }, [onMuteParticipant, strings, participant.isMuted, participant.userId, participant.displayName, isPinned, isSpotlighted, scalingMode, onUnpinParticipant, onPinParticipant, toggleAnnouncerString, disablePinMenuItem, myUserId, onStopSpotlight, spotlightedParticipantUserIds, maxParticipantsToSpotlight, onStartSpotlight, onUpdateScalingMode, view, participant.canAudioBeForbidden, participant.canVideoBeForbidden, participant.mediaAccess, onPermitAudio, onForbidAudio, onPermitVideo, onForbidVideo]);\n  return contextualMenuProps;\n};"]}

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

@@ -1 +1 @@
-{"version":3,"file":"OverflowGalleryUtils.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/utils/OverflowGalleryUtils.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,IAAI,cAAc,EAAE,yCAAgC;AAC5E,OAAO,EAAE,sCAAsC,EAAE,MAAM,0DAA0D,CAAC;AAClH,OAAO,EAAE,oCAAoC,EAAE,8BAA8B,EAAE,MAAM,wDAAwD,CAAC;AAE9I;;;;;GAKG;AACH,MAAM,CAAC,MAAM,kCAAkC,GAAG,CAAC,IAKlD,EAAU,EAAE;IACX,MAAM,EACJ,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,WAAW,EACZ,GAAG,IAAI,CAAC;IACT,MAAM,aAAa,GAAG,cAAc,CAAC,sCAAsC,CAAC,QAAQ,CAAC,CAAC;IACtF,MAAM,QAAQ,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC;IAE7C;;;;;;;OAOG;IACH,MAAM,2BAA2B,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,cAAc,GAAG,QAAQ,CAAC,GAAG,CAAC,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC;IACzG,8DAA8D;IAC9D,IAAI,gBAAgB,IAAI,2BAA2B,EAAE,CAAC;QACpD,OAAO,2BAA2B,CAAC;IACrC,CAAC;IACD,MAAM,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;IAEnD;;;;;;;;OAQG;IACH,MAAM,aAAa,GAAG,cAAc,GAAG,CAAC,GAAG,WAAW,GAAG,CAAC,GAAG,QAAQ,CAAC;IACtE,qGAAqG;IACrG,qFAAqF;IACrF,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,aAAa,GAAG,QAAQ,CAAC,GAAG,CAAC,aAAa,GAAG,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAC1F,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,CAAC,IAMhD,EAAU,EAAE;IACX,MAAM,EACJ,gBAAgB,EAChB,eAAe,EACf,YAAY,EACZ,gBAAgB,EAChB,OAAO,EACR,GAAG,IAAI,CAAC;IACT,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,oCAAoC,CAAC,SAAS,CAAC,CAAC,CAAC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAC7I,MAAM,WAAW,GAAG,cAAc,CAAC,YAAY,CAAC,CAAC;IACjD,MAAM,kBAAkB,GAAG,cAAc,CAAC,gBAAgB,CAAC,CAAC;IAE5D;;;;;;;;;;;;;;;;;;;OAmBG;IAEH,MAAM,8BAA8B,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,eAAe,GAAG,WAAW,CAAC,GAAG,CAAC,gBAAgB,GAAG,WAAW,CAAC,CAAC,CAAC;IACtH,iFAAiF;IACjF,IAAI,gBAAgB,IAAI,8BAA8B,EAAE,CAAC;QACvD,OAAO,8BAA8B,CAAC;IACxC,CAAC;IAED;;;;;OAKG;IACH,MAAM,UAAU,GAAG,eAAe,GAAG,kBAAkB,GAAG,CAAC,GAAG,WAAW,CAAC;IAE1E;;;;;OAKG;IACH,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,UAAU,GAAG,WAAW,CAAC,GAAG,CAAC,gBAAgB,GAAG,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAChG,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _convertRemToPx as convertRemToPx } from '@internal/acs-ui-common';\nimport { LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM } from '../styles/VideoGalleryResponsiveHorizontalGallery.styles';\nimport { SHORT_VERTICAL_GALLERY_TILE_SIZE_REM, VERTICAL_GALLERY_TILE_SIZE_REM } from '../styles/VideoGalleryResponsiveVerticalGallery.styles';\n\n/**\n * Helper function to calculate children per page for HorizontalGallery based on width of container, child, buttons, and\n * gaps in between\n *\n * @private\n */\nexport const calculateHorizontalChildrenPerPage = (args: {\n  numberOfChildren: number;\n  containerWidth: number;\n  gapWidthRem: number;\n  buttonWidthRem: number;\n}): number => {\n  const {\n    numberOfChildren,\n    containerWidth,\n    buttonWidthRem,\n    gapWidthRem\n  } = args;\n  const childMinWidth = convertRemToPx(LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.minWidth);\n  const gapWidth = convertRemToPx(gapWidthRem);\n\n  /** First check how many children can fit in containerWidth.\n   *    __________________________________\n   *   |                ||                |\n   *   |                ||                |\n   *   |________________||________________|\n   *   <-----------containerWidth--------->\n   *  containerWidth = n * childWidth + (n - 1) * gapWidth. Isolate n and take the floor.\n   */\n  const numberOfChildrenInContainer = Math.floor((containerWidth + gapWidth) / (childMinWidth + gapWidth));\n  // If all children fit then return numberOfChildrenInContainer\n  if (numberOfChildren <= numberOfChildrenInContainer) {\n    return numberOfChildrenInContainer;\n  }\n  const buttonWidth = convertRemToPx(buttonWidthRem);\n\n  /** We know we need to paginate. So we need to subtract the buttonWidth twice and gapWidth twice from\n   * containerWidth to compute childrenSpace\n   *   <-----------containerWidth--------->\n   *    __________________________________\n   *   | ||             ||             || |\n   *   |<||             ||             ||>|\n   *   |_||_____________||_____________||_|\n   *       <-------childrenSpace------>\n   */\n  const childrenSpace = containerWidth - 2 * buttonWidth - 2 * gapWidth;\n  // Now that we have childrenSpace width we can figure out how many children can fit in childrenSpace.\n  // childrenSpace = n * childWidth + (n - 1) * gapWidth. Isolate n and take the floor.\n  return Math.max(Math.floor((childrenSpace + gapWidth) / (childMinWidth + gapWidth)), 1);\n};\n\n/**\n * Helper function to find the number of children for the VerticalGallery on each page.\n *\n * @private\n */\nexport const calculateVerticalChildrenPerPage = (args: {\n  numberOfChildren: number;\n  containerHeight: number;\n  gapHeightRem: number;\n  controlBarHeight: number;\n  isShort: boolean;\n}): number => {\n  const {\n    numberOfChildren,\n    containerHeight,\n    gapHeightRem,\n    controlBarHeight,\n    isShort\n  } = args;\n  const childMinHeightPx = convertRemToPx(isShort ? SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.minHeight : VERTICAL_GALLERY_TILE_SIZE_REM.minHeight);\n  const gapHeightPx = convertRemToPx(gapHeightRem);\n  const controlBarHeightPx = convertRemToPx(controlBarHeight);\n\n  /** First check how many children can fit in containerHeight.\n   *\n   *   _________________\n   *   |                |\n   *   |                |\n   *   |________________|\n   *    _________________\n   *   |                |\n   *   |                |\n   *   |________________|\n   *\n   *      <   n/m   >\n   *\n   * number of children = container height - (2* gap height + button height) / childMinHeight\n   *\n   * we want to find the maximum number of children at the smallest size we can fit in the gallery and then resize them\n   * to fill in the space as much as possible\n   *\n   * First we will find the max number of children without any controls we can fit.\n   */\n\n  const maxNumberOfChildrenInContainer = Math.floor((containerHeight + gapHeightPx) / (childMinHeightPx + gapHeightPx));\n  // if all of the children fit in the container just return the number of children\n  if (numberOfChildren <= maxNumberOfChildrenInContainer) {\n    return maxNumberOfChildrenInContainer;\n  }\n\n  /**\n   * For the pagination we know the container height, the height of the button bar and the 2 times the gap\n   * height, top tile and bottom tile above control bar. So the child space is calculated as:\n   *\n   *      space = height - controlbar - (2 * gap)\n   */\n  const childSpace = containerHeight - controlBarHeightPx - 2 * gapHeightPx;\n\n  /**\n   * Now that we have the childrenSpace height we can figure out how many Children can fir in the childrenSpace.\n   * childrenSpace = n * childHeightMin + (n - 1) * gapHeight. isolate n and take the floor.\n   *\n   * We want to always return at least one video tile if there are children present.So we take the max.\n   */\n  return Math.max(Math.floor((childSpace + gapHeightPx) / (childMinHeightPx + gapHeightPx)), 1);\n};"]}
+{"version":3,"file":"OverflowGalleryUtils.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/utils/OverflowGalleryUtils.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,IAAI,cAAc,EAAE,yCAAgC;AAC5E,OAAO,EAAE,sCAAsC,EAAE,MAAM,0DAA0D,CAAC;AAClH,OAAO,EAAE,oCAAoC,EAAE,8BAA8B,EAAE,MAAM,wDAAwD,CAAC;AAE9I;;;;;GAKG;AACH,MAAM,CAAC,MAAM,kCAAkC,GAAG,CAAC,IAKlD,EAAU,EAAE;IACX,MAAM,EACJ,gBAAgB,EAChB,cAAc,EACd,cAAc,EACd,WAAW,EACZ,GAAG,IAAI,CAAC;IACT,MAAM,aAAa,GAAG,cAAc,CAAC,sCAAsC,CAAC,QAAQ,CAAC,CAAC;IACtF,MAAM,QAAQ,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC;IAE7C;;;;;;;OAOG;IACH,MAAM,2BAA2B,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,cAAc,GAAG,QAAQ,CAAC,GAAG,CAAC,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC;IACzG,8DAA8D;IAC9D,IAAI,gBAAgB,IAAI,2BAA2B,EAAE,CAAC;QACpD,OAAO,2BAA2B,CAAC;IACrC,CAAC;IACD,MAAM,WAAW,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;IAEnD;;;;;;;;OAQG;IACH,MAAM,aAAa,GAAG,cAAc,GAAG,CAAC,GAAG,WAAW,GAAG,CAAC,GAAG,QAAQ,CAAC;IACtE,qGAAqG;IACrG,qFAAqF;IACrF,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,aAAa,GAAG,QAAQ,CAAC,GAAG,CAAC,aAAa,GAAG,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAC1F,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,CAAC,IAMhD,EAAU,EAAE;IACX,MAAM,EACJ,gBAAgB,EAChB,eAAe,EACf,YAAY,EACZ,gBAAgB,EAChB,OAAO,EACR,GAAG,IAAI,CAAC;IACT,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,oCAAoC,CAAC,SAAS,CAAC,CAAC,CAAC,8BAA8B,CAAC,SAAS,CAAC,CAAC;IAC7I,MAAM,WAAW,GAAG,cAAc,CAAC,YAAY,CAAC,CAAC;IACjD,MAAM,kBAAkB,GAAG,cAAc,CAAC,gBAAgB,CAAC,CAAC;IAE5D;;;;;;;;;;;;;;;;;;;OAmBG;IAEH,MAAM,8BAA8B,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,eAAe,GAAG,WAAW,CAAC,GAAG,CAAC,gBAAgB,GAAG,WAAW,CAAC,CAAC,CAAC;IACtH,iFAAiF;IACjF,IAAI,gBAAgB,IAAI,8BAA8B,EAAE,CAAC;QACvD,OAAO,8BAA8B,CAAC;IACxC,CAAC;IAED;;;;;OAKG;IACH,MAAM,UAAU,GAAG,eAAe,GAAG,kBAAkB,GAAG,CAAC,GAAG,WAAW,CAAC;IAE1E;;;;;OAKG;IACH,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,UAAU,GAAG,WAAW,CAAC,GAAG,CAAC,gBAAgB,GAAG,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAChG,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _convertRemToPx as convertRemToPx } from '@internal/acs-ui-common';\nimport { LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM } from '../styles/VideoGalleryResponsiveHorizontalGallery.styles';\nimport { SHORT_VERTICAL_GALLERY_TILE_SIZE_REM, VERTICAL_GALLERY_TILE_SIZE_REM } from '../styles/VideoGalleryResponsiveVerticalGallery.styles';\n\n/**\r\n * Helper function to calculate children per page for HorizontalGallery based on width of container, child, buttons, and\r\n * gaps in between\r\n *\r\n * @private\r\n */\nexport const calculateHorizontalChildrenPerPage = (args: {\n  numberOfChildren: number;\n  containerWidth: number;\n  gapWidthRem: number;\n  buttonWidthRem: number;\n}): number => {\n  const {\n    numberOfChildren,\n    containerWidth,\n    buttonWidthRem,\n    gapWidthRem\n  } = args;\n  const childMinWidth = convertRemToPx(LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM.minWidth);\n  const gapWidth = convertRemToPx(gapWidthRem);\n\n  /** First check how many children can fit in containerWidth.\r\n   *    __________________________________\r\n   *   |                ||                |\r\n   *   |                ||                |\r\n   *   |________________||________________|\r\n   *   <-----------containerWidth--------->\r\n   *  containerWidth = n * childWidth + (n - 1) * gapWidth. Isolate n and take the floor.\r\n   */\n  const numberOfChildrenInContainer = Math.floor((containerWidth + gapWidth) / (childMinWidth + gapWidth));\n  // If all children fit then return numberOfChildrenInContainer\n  if (numberOfChildren <= numberOfChildrenInContainer) {\n    return numberOfChildrenInContainer;\n  }\n  const buttonWidth = convertRemToPx(buttonWidthRem);\n\n  /** We know we need to paginate. So we need to subtract the buttonWidth twice and gapWidth twice from\r\n   * containerWidth to compute childrenSpace\r\n   *   <-----------containerWidth--------->\r\n   *    __________________________________\r\n   *   | ||             ||             || |\r\n   *   |<||             ||             ||>|\r\n   *   |_||_____________||_____________||_|\r\n   *       <-------childrenSpace------>\r\n   */\n  const childrenSpace = containerWidth - 2 * buttonWidth - 2 * gapWidth;\n  // Now that we have childrenSpace width we can figure out how many children can fit in childrenSpace.\n  // childrenSpace = n * childWidth + (n - 1) * gapWidth. Isolate n and take the floor.\n  return Math.max(Math.floor((childrenSpace + gapWidth) / (childMinWidth + gapWidth)), 1);\n};\n\n/**\r\n * Helper function to find the number of children for the VerticalGallery on each page.\r\n *\r\n * @private\r\n */\nexport const calculateVerticalChildrenPerPage = (args: {\n  numberOfChildren: number;\n  containerHeight: number;\n  gapHeightRem: number;\n  controlBarHeight: number;\n  isShort: boolean;\n}): number => {\n  const {\n    numberOfChildren,\n    containerHeight,\n    gapHeightRem,\n    controlBarHeight,\n    isShort\n  } = args;\n  const childMinHeightPx = convertRemToPx(isShort ? SHORT_VERTICAL_GALLERY_TILE_SIZE_REM.minHeight : VERTICAL_GALLERY_TILE_SIZE_REM.minHeight);\n  const gapHeightPx = convertRemToPx(gapHeightRem);\n  const controlBarHeightPx = convertRemToPx(controlBarHeight);\n\n  /** First check how many children can fit in containerHeight.\r\n   *\r\n   *   _________________\r\n   *   |                |\r\n   *   |                |\r\n   *   |________________|\r\n   *    _________________\r\n   *   |                |\r\n   *   |                |\r\n   *   |________________|\r\n   *\r\n   *      <   n/m   >\r\n   *\r\n   * number of children = container height - (2* gap height + button height) / childMinHeight\r\n   *\r\n   * we want to find the maximum number of children at the smallest size we can fit in the gallery and then resize them\r\n   * to fill in the space as much as possible\r\n   *\r\n   * First we will find the max number of children without any controls we can fit.\r\n   */\n\n  const maxNumberOfChildrenInContainer = Math.floor((containerHeight + gapHeightPx) / (childMinHeightPx + gapHeightPx));\n  // if all of the children fit in the container just return the number of children\n  if (numberOfChildren <= maxNumberOfChildrenInContainer) {\n    return maxNumberOfChildrenInContainer;\n  }\n\n  /**\r\n   * For the pagination we know the container height, the height of the button bar and the 2 times the gap\r\n   * height, top tile and bottom tile above control bar. So the child space is calculated as:\r\n   *\r\n   *      space = height - controlbar - (2 * gap)\r\n   */\n  const childSpace = containerHeight - controlBarHeightPx - 2 * gapHeightPx;\n\n  /**\r\n   * Now that we have the childrenSpace height we can figure out how many Children can fir in the childrenSpace.\r\n   * childrenSpace = n * childHeightMin + (n - 1) * gapHeight. isolate n and take the floor.\r\n   *\r\n   * We want to always return at least one video tile if there are children present.So we take the max.\r\n   */\n  return Math.max(Math.floor((childSpace + gapHeightPx) / (childMinHeightPx + gapHeightPx)), 1);\n};"]}

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

@@ -1 +1 @@
-{"version":3,"file":"videoGalleryLayoutUtils.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/utils/videoGalleryLayoutUtils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { useRef } from 'react';\nimport { smartDominantSpeakerParticipants } from '../../../gallery';\nimport { VideoGalleryParticipant, VideoGalleryRemoteParticipant } from '../../../types';\nimport { ReactionResources } from '../../..';\nimport { VideoGalleryLayout } from '../../VideoGallery';\n\n/**\n * Arguments used to determine a {@link OrganizedParticipantsResult}\n * @private\n */\nexport interface OrganizedParticipantsArgs {\n  remoteParticipants: VideoGalleryRemoteParticipant[];\n  localParticipant?: VideoGalleryParticipant;\n  dominantSpeakers?: string[];\n  maxGridParticipants?: number;\n  maxOverflowGalleryDominantSpeakers?: number;\n  isScreenShareActive?: boolean;\n  pinnedParticipantUserIds?: string[];\n  layout?: VideoGalleryLayout;\n  spotlightedParticipantUserIds?: string[];\n  previousGridParticipants?: VideoGalleryRemoteParticipant[];\n  previousOverflowParticipants?: VideoGalleryRemoteParticipant[];\n}\n\n/**\n * A result that defines grid participants and overflow gallery participants in the VideoGallery\n * @private\n */\nexport interface OrganizedParticipantsResult {\n  gridParticipants: VideoGalleryParticipant[];\n  overflowGalleryParticipants: VideoGalleryParticipant[];\n}\nconst DEFAULT_MAX_OVERFLOW_GALLERY_DOMINANT_SPEAKERS = 6;\nconst DEFAULT_MAX_VIDEO_SREAMS = 4;\n/**\n * @private\n */\nexport const MAX_GRID_PARTICIPANTS_NOT_LARGE_GALLERY = 9;\nconst getOrganizedParticipants = (props: OrganizedParticipantsArgs): OrganizedParticipantsResult => {\n  const {\n    remoteParticipants = [],\n    dominantSpeakers = [],\n    maxGridParticipants = DEFAULT_MAX_VIDEO_SREAMS,\n    maxOverflowGalleryDominantSpeakers = DEFAULT_MAX_OVERFLOW_GALLERY_DOMINANT_SPEAKERS,\n    layout,\n    previousGridParticipants = [],\n    previousOverflowParticipants = []\n  } = props;\n  const callingParticipants = remoteParticipants.filter(p => p.state === 'Connecting' || p.state === 'Ringing');\n  const callingParticipantsSet = new Set(callingParticipants.map(p => p.userId));\n  const connectedParticipants = remoteParticipants.filter(p => !callingParticipantsSet.has(p.userId));\n  const remoteParticipantsOrdered = putVideoParticipantsFirst(connectedParticipants);\n  const videoParticipants = remoteParticipants.filter(p => p.videoStream?.isAvailable);\n  const participantsForGrid = layout === 'floatingLocalVideo' && videoParticipants.length > 0 ? videoParticipants : remoteParticipantsOrdered;\n  let newGridParticipants = smartDominantSpeakerParticipants({\n    participants: participantsForGrid,\n    dominantSpeakers,\n    currentParticipants: previousGridParticipants,\n    maxDominantSpeakers: maxGridParticipants\n  }).slice(0, maxGridParticipants);\n  if (layout === 'speaker') {\n    if (dominantSpeakers?.[0]) {\n      newGridParticipants = newGridParticipants.filter(p => p.userId === dominantSpeakers[0]);\n    } else {\n      newGridParticipants = newGridParticipants.slice(1);\n    }\n  }\n  const gridParticipantSet = new Set(newGridParticipants.map(p => p.userId));\n  const newOverflowGalleryParticipants = smartDominantSpeakerParticipants({\n    participants: remoteParticipantsOrdered.filter(p => !gridParticipantSet.has(p.userId)),\n    dominantSpeakers: dominantSpeakers,\n    currentParticipants: previousOverflowParticipants,\n    maxDominantSpeakers: maxOverflowGalleryDominantSpeakers\n  });\n  let gridParticipants = newGridParticipants;\n  let overflowGalleryParticipants = newOverflowGalleryParticipants;\n\n  // Add the participants being called into the call.\n  // If there are already overflow participants, add these to the array of overflow participants\n  // Otherwise, add the maximum number to the main grid, then put the rest in the overflow\n  if (overflowGalleryParticipants.length === 0) {\n    const numberOfCallingParticipantsInGrid = maxGridParticipants - gridParticipants.length;\n    const gridCallingParticipants = callingParticipants.slice(0, numberOfCallingParticipantsInGrid);\n    const overflowGalleryCallingParticipants = callingParticipants.slice(numberOfCallingParticipantsInGrid);\n    gridParticipants = gridParticipants.concat(gridCallingParticipants);\n    overflowGalleryParticipants = overflowGalleryCallingParticipants;\n  } else {\n    overflowGalleryParticipants = overflowGalleryParticipants.concat(callingParticipants);\n  }\n  return {\n    gridParticipants,\n    overflowGalleryParticipants\n  };\n};\n\n/**\n * Hook to determine which participants should be in grid and overflow gallery and their order respectively\n * @private\n */\nexport const useOrganizedParticipants = (props: OrganizedParticipantsArgs): OrganizedParticipantsResult => {\n  const spotlightedParticipantUserIds = props.spotlightedParticipantUserIds ?? [];\n  const pinnedParticipantUserIds = props.pinnedParticipantUserIds ?? [];\n\n  // Focussed participants are the participants that are either spotlighted or pinned. Ordered by spotlighted first and then pinned.\n  // A set is used to dedupe participants.\n  const focusedParticipantUserIdSet = new Set(spotlightedParticipantUserIds.concat(pinnedParticipantUserIds));\n  const focusedParticipants: VideoGalleryRemoteParticipant[] = [...focusedParticipantUserIdSet].map(userId => props.remoteParticipants.find(p => p.userId === userId)).filter(p => p !== undefined) as VideoGalleryRemoteParticipant[];\n\n  // Unfocused participants are the rest of the participants\n  const unfocusedParticipants = props.remoteParticipants.filter(p => !focusedParticipantUserIdSet.has(p.userId));\n  const currentGridParticipants = useRef<VideoGalleryRemoteParticipant[]>([]);\n  const currentOverflowGalleryParticipants = useRef<VideoGalleryRemoteParticipant[]>([]);\n  const organizedParticipantsArgs: OrganizedParticipantsArgs = {\n    ...props,\n    // if there are focused participants then leave no room in the grid by setting maxGridParticipants to 0\n    maxGridParticipants: focusedParticipants.length > 0 || props.isScreenShareActive ? 0 : props.maxGridParticipants,\n    remoteParticipants: unfocusedParticipants,\n    previousGridParticipants: currentGridParticipants.current,\n    previousOverflowParticipants: currentOverflowGalleryParticipants.current\n  };\n  const organizedParticipants = getOrganizedParticipants(organizedParticipantsArgs);\n  currentGridParticipants.current = organizedParticipants.gridParticipants;\n  currentOverflowGalleryParticipants.current = organizedParticipants.overflowGalleryParticipants;\n  return focusedParticipants.length > 0 ? {\n    gridParticipants: props.isScreenShareActive ? [] : focusedParticipants,\n    overflowGalleryParticipants: props.isScreenShareActive ? focusedParticipants.concat(organizedParticipants.overflowGalleryParticipants) : organizedParticipants.overflowGalleryParticipants\n  } : organizedParticipants;\n};\nconst putVideoParticipantsFirst = (remoteParticipants: VideoGalleryRemoteParticipant[]): VideoGalleryRemoteParticipant[] => {\n  const videoParticipants: VideoGalleryRemoteParticipant[] = [];\n  const audioParticipants: VideoGalleryRemoteParticipant[] = [];\n  remoteParticipants.forEach(p => {\n    if (p.videoStream?.isAvailable) {\n      videoParticipants.push(p);\n    } else {\n      audioParticipants.push(p);\n    }\n  });\n  const remoteParticipantSortedByVideo = videoParticipants.concat(audioParticipants);\n  return remoteParticipantSortedByVideo;\n};\n\n/**\n * @private\n */\nexport const renderTiles = (gridParticipants: VideoGalleryParticipant[], onRenderRemoteParticipant: (participant: VideoGalleryRemoteParticipant, isVideoParticipant?: boolean) => JSX.Element, maxRemoteVideoStreams: number, indexesToRender: number[], overflowGalleryParticipants: VideoGalleryParticipant[], dominantSpeakers?: string[]): {\n  gridTiles: JSX.Element[];\n  overflowGalleryTiles: JSX.Element[];\n} => {\n  const _dominantSpeakers = dominantSpeakers ?? [];\n  let streamsLeftToRender = maxRemoteVideoStreams;\n\n  // Render the grid participants\n  const participantWithStreamsToRenderInGrid = gridParticipants.filter(p => p?.videoStream?.isAvailable);\n  const dominantSpeakerWithStreamsToRenderInGrid = _dominantSpeakers.filter(userId => participantWithStreamsToRenderInGrid.find(p => p?.userId === userId)).slice(0, streamsLeftToRender);\n  streamsLeftToRender = streamsLeftToRender - dominantSpeakerWithStreamsToRenderInGrid.length;\n  const gridTiles = gridParticipants.map(p => {\n    return onRenderRemoteParticipant(p, dominantSpeakerWithStreamsToRenderInGrid.includes(p.userId) || p.videoStream?.isAvailable && streamsLeftToRender-- > 0);\n  });\n\n  // Render the overflow participants\n  const participantWithStreamsToRenderInOverflow = indexesToRender.map(i => {\n    return overflowGalleryParticipants.at(i);\n  }).filter(p => p?.videoStream?.isAvailable);\n  const dominantSpeakerWithStreamsToRenderInOverflow = _dominantSpeakers.filter(userId => participantWithStreamsToRenderInOverflow.find(p => p?.userId === userId)).slice(0, streamsLeftToRender);\n  streamsLeftToRender = streamsLeftToRender - dominantSpeakerWithStreamsToRenderInOverflow.length;\n  const overflowGalleryTiles = overflowGalleryParticipants.map(p => {\n    return onRenderRemoteParticipant(p, dominantSpeakerWithStreamsToRenderInOverflow.includes(p.userId) || p.videoStream?.isAvailable && streamsLeftToRender-- > 0);\n  });\n  return {\n    gridTiles,\n    overflowGalleryTiles\n  };\n};\n\n/**\n * @private\n */\nexport const getEmojiResource = (reactionName: string, reactionResources: ReactionResources): string | undefined => {\n  switch (reactionName) {\n    case 'like':\n      return reactionResources.likeReaction?.url;\n    case 'heart':\n      return reactionResources.heartReaction?.url;\n    case 'laugh':\n      return reactionResources.laughReaction?.url;\n    case 'applause':\n      return reactionResources.applauseReaction?.url;\n    case 'surprised':\n      return reactionResources.surprisedReaction?.url;\n  }\n  return undefined;\n};\n\n/**\n * @private\n */\nexport const getEmojiFrameCount = (reactionName: string, reactionResources: ReactionResources): number => {\n  switch (reactionName) {\n    case 'like':\n      return reactionResources.likeReaction?.frameCount ?? 0;\n    case 'heart':\n      return reactionResources.heartReaction?.frameCount ?? 0;\n    case 'laugh':\n      return reactionResources.laughReaction?.frameCount ?? 0;\n    case 'applause':\n      return reactionResources.applauseReaction?.frameCount ?? 0;\n    case 'surprised':\n      return reactionResources.surprisedReaction?.frameCount ?? 0;\n    default:\n      return 0;\n  }\n};"]}
+{"version":3,"file":"videoGalleryLayoutUtils.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/VideoGallery/utils/videoGalleryLayoutUtils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { useRef } from 'react';\nimport { smartDominantSpeakerParticipants } from '../../../gallery';\nimport { VideoGalleryParticipant, VideoGalleryRemoteParticipant } from '../../../types';\nimport { ReactionResources } from '../../..';\nimport { VideoGalleryLayout } from '../../VideoGallery';\n\n/**\r\n * Arguments used to determine a {@link OrganizedParticipantsResult}\r\n * @private\r\n */\nexport interface OrganizedParticipantsArgs {\n  remoteParticipants: VideoGalleryRemoteParticipant[];\n  localParticipant?: VideoGalleryParticipant;\n  dominantSpeakers?: string[];\n  maxGridParticipants?: number;\n  maxOverflowGalleryDominantSpeakers?: number;\n  isScreenShareActive?: boolean;\n  pinnedParticipantUserIds?: string[];\n  layout?: VideoGalleryLayout;\n  spotlightedParticipantUserIds?: string[];\n  previousGridParticipants?: VideoGalleryRemoteParticipant[];\n  previousOverflowParticipants?: VideoGalleryRemoteParticipant[];\n}\n\n/**\r\n * A result that defines grid participants and overflow gallery participants in the VideoGallery\r\n * @private\r\n */\nexport interface OrganizedParticipantsResult {\n  gridParticipants: VideoGalleryParticipant[];\n  overflowGalleryParticipants: VideoGalleryParticipant[];\n}\nconst DEFAULT_MAX_OVERFLOW_GALLERY_DOMINANT_SPEAKERS = 6;\nconst DEFAULT_MAX_VIDEO_SREAMS = 4;\n/**\r\n * @private\r\n */\nexport const MAX_GRID_PARTICIPANTS_NOT_LARGE_GALLERY = 9;\nconst getOrganizedParticipants = (props: OrganizedParticipantsArgs): OrganizedParticipantsResult => {\n  const {\n    remoteParticipants = [],\n    dominantSpeakers = [],\n    maxGridParticipants = DEFAULT_MAX_VIDEO_SREAMS,\n    maxOverflowGalleryDominantSpeakers = DEFAULT_MAX_OVERFLOW_GALLERY_DOMINANT_SPEAKERS,\n    layout,\n    previousGridParticipants = [],\n    previousOverflowParticipants = []\n  } = props;\n  const callingParticipants = remoteParticipants.filter(p => p.state === 'Connecting' || p.state === 'Ringing');\n  const callingParticipantsSet = new Set(callingParticipants.map(p => p.userId));\n  const connectedParticipants = remoteParticipants.filter(p => !callingParticipantsSet.has(p.userId));\n  const remoteParticipantsOrdered = putVideoParticipantsFirst(connectedParticipants);\n  const videoParticipants = remoteParticipants.filter(p => p.videoStream?.isAvailable);\n  const participantsForGrid = layout === 'floatingLocalVideo' && videoParticipants.length > 0 ? videoParticipants : remoteParticipantsOrdered;\n  let newGridParticipants = smartDominantSpeakerParticipants({\n    participants: participantsForGrid,\n    dominantSpeakers,\n    currentParticipants: previousGridParticipants,\n    maxDominantSpeakers: maxGridParticipants\n  }).slice(0, maxGridParticipants);\n  if (layout === 'speaker') {\n    if (dominantSpeakers?.[0]) {\n      newGridParticipants = newGridParticipants.filter(p => p.userId === dominantSpeakers[0]);\n    } else {\n      newGridParticipants = newGridParticipants.slice(1);\n    }\n  }\n  const gridParticipantSet = new Set(newGridParticipants.map(p => p.userId));\n  const newOverflowGalleryParticipants = smartDominantSpeakerParticipants({\n    participants: remoteParticipantsOrdered.filter(p => !gridParticipantSet.has(p.userId)),\n    dominantSpeakers: dominantSpeakers,\n    currentParticipants: previousOverflowParticipants,\n    maxDominantSpeakers: maxOverflowGalleryDominantSpeakers\n  });\n  let gridParticipants = newGridParticipants;\n  let overflowGalleryParticipants = newOverflowGalleryParticipants;\n\n  // Add the participants being called into the call.\n  // If there are already overflow participants, add these to the array of overflow participants\n  // Otherwise, add the maximum number to the main grid, then put the rest in the overflow\n  if (overflowGalleryParticipants.length === 0) {\n    const numberOfCallingParticipantsInGrid = maxGridParticipants - gridParticipants.length;\n    const gridCallingParticipants = callingParticipants.slice(0, numberOfCallingParticipantsInGrid);\n    const overflowGalleryCallingParticipants = callingParticipants.slice(numberOfCallingParticipantsInGrid);\n    gridParticipants = gridParticipants.concat(gridCallingParticipants);\n    overflowGalleryParticipants = overflowGalleryCallingParticipants;\n  } else {\n    overflowGalleryParticipants = overflowGalleryParticipants.concat(callingParticipants);\n  }\n  return {\n    gridParticipants,\n    overflowGalleryParticipants\n  };\n};\n\n/**\r\n * Hook to determine which participants should be in grid and overflow gallery and their order respectively\r\n * @private\r\n */\nexport const useOrganizedParticipants = (props: OrganizedParticipantsArgs): OrganizedParticipantsResult => {\n  const spotlightedParticipantUserIds = props.spotlightedParticipantUserIds ?? [];\n  const pinnedParticipantUserIds = props.pinnedParticipantUserIds ?? [];\n\n  // Focussed participants are the participants that are either spotlighted or pinned. Ordered by spotlighted first and then pinned.\n  // A set is used to dedupe participants.\n  const focusedParticipantUserIdSet = new Set(spotlightedParticipantUserIds.concat(pinnedParticipantUserIds));\n  const focusedParticipants: VideoGalleryRemoteParticipant[] = [...focusedParticipantUserIdSet].map(userId => props.remoteParticipants.find(p => p.userId === userId)).filter(p => p !== undefined) as VideoGalleryRemoteParticipant[];\n\n  // Unfocused participants are the rest of the participants\n  const unfocusedParticipants = props.remoteParticipants.filter(p => !focusedParticipantUserIdSet.has(p.userId));\n  const currentGridParticipants = useRef<VideoGalleryRemoteParticipant[]>([]);\n  const currentOverflowGalleryParticipants = useRef<VideoGalleryRemoteParticipant[]>([]);\n  const organizedParticipantsArgs: OrganizedParticipantsArgs = {\n    ...props,\n    // if there are focused participants then leave no room in the grid by setting maxGridParticipants to 0\n    maxGridParticipants: focusedParticipants.length > 0 || props.isScreenShareActive ? 0 : props.maxGridParticipants,\n    remoteParticipants: unfocusedParticipants,\n    previousGridParticipants: currentGridParticipants.current,\n    previousOverflowParticipants: currentOverflowGalleryParticipants.current\n  };\n  const organizedParticipants = getOrganizedParticipants(organizedParticipantsArgs);\n  currentGridParticipants.current = organizedParticipants.gridParticipants;\n  currentOverflowGalleryParticipants.current = organizedParticipants.overflowGalleryParticipants;\n  return focusedParticipants.length > 0 ? {\n    gridParticipants: props.isScreenShareActive ? [] : focusedParticipants,\n    overflowGalleryParticipants: props.isScreenShareActive ? focusedParticipants.concat(organizedParticipants.overflowGalleryParticipants) : organizedParticipants.overflowGalleryParticipants\n  } : organizedParticipants;\n};\nconst putVideoParticipantsFirst = (remoteParticipants: VideoGalleryRemoteParticipant[]): VideoGalleryRemoteParticipant[] => {\n  const videoParticipants: VideoGalleryRemoteParticipant[] = [];\n  const audioParticipants: VideoGalleryRemoteParticipant[] = [];\n  remoteParticipants.forEach(p => {\n    if (p.videoStream?.isAvailable) {\n      videoParticipants.push(p);\n    } else {\n      audioParticipants.push(p);\n    }\n  });\n  const remoteParticipantSortedByVideo = videoParticipants.concat(audioParticipants);\n  return remoteParticipantSortedByVideo;\n};\n\n/**\r\n * @private\r\n */\nexport const renderTiles = (gridParticipants: VideoGalleryParticipant[], onRenderRemoteParticipant: (participant: VideoGalleryRemoteParticipant, isVideoParticipant?: boolean) => JSX.Element, maxRemoteVideoStreams: number, indexesToRender: number[], overflowGalleryParticipants: VideoGalleryParticipant[], dominantSpeakers?: string[]): {\n  gridTiles: JSX.Element[];\n  overflowGalleryTiles: JSX.Element[];\n} => {\n  const _dominantSpeakers = dominantSpeakers ?? [];\n  let streamsLeftToRender = maxRemoteVideoStreams;\n\n  // Render the grid participants\n  const participantWithStreamsToRenderInGrid = gridParticipants.filter(p => p?.videoStream?.isAvailable);\n  const dominantSpeakerWithStreamsToRenderInGrid = _dominantSpeakers.filter(userId => participantWithStreamsToRenderInGrid.find(p => p?.userId === userId)).slice(0, streamsLeftToRender);\n  streamsLeftToRender = streamsLeftToRender - dominantSpeakerWithStreamsToRenderInGrid.length;\n  const gridTiles = gridParticipants.map(p => {\n    return onRenderRemoteParticipant(p, dominantSpeakerWithStreamsToRenderInGrid.includes(p.userId) || p.videoStream?.isAvailable && streamsLeftToRender-- > 0);\n  });\n\n  // Render the overflow participants\n  const participantWithStreamsToRenderInOverflow = indexesToRender.map(i => {\n    return overflowGalleryParticipants.at(i);\n  }).filter(p => p?.videoStream?.isAvailable);\n  const dominantSpeakerWithStreamsToRenderInOverflow = _dominantSpeakers.filter(userId => participantWithStreamsToRenderInOverflow.find(p => p?.userId === userId)).slice(0, streamsLeftToRender);\n  streamsLeftToRender = streamsLeftToRender - dominantSpeakerWithStreamsToRenderInOverflow.length;\n  const overflowGalleryTiles = overflowGalleryParticipants.map(p => {\n    return onRenderRemoteParticipant(p, dominantSpeakerWithStreamsToRenderInOverflow.includes(p.userId) || p.videoStream?.isAvailable && streamsLeftToRender-- > 0);\n  });\n  return {\n    gridTiles,\n    overflowGalleryTiles\n  };\n};\n\n/**\r\n * @private\r\n */\nexport const getEmojiResource = (reactionName: string, reactionResources: ReactionResources): string | undefined => {\n  switch (reactionName) {\n    case 'like':\n      return reactionResources.likeReaction?.url;\n    case 'heart':\n      return reactionResources.heartReaction?.url;\n    case 'laugh':\n      return reactionResources.laughReaction?.url;\n    case 'applause':\n      return reactionResources.applauseReaction?.url;\n    case 'surprised':\n      return reactionResources.surprisedReaction?.url;\n  }\n  return undefined;\n};\n\n/**\r\n * @private\r\n */\nexport const getEmojiFrameCount = (reactionName: string, reactionResources: ReactionResources): number => {\n  switch (reactionName) {\n    case 'like':\n      return reactionResources.likeReaction?.frameCount ?? 0;\n    case 'heart':\n      return reactionResources.heartReaction?.frameCount ?? 0;\n    case 'laugh':\n      return reactionResources.laughReaction?.frameCount ?? 0;\n    case 'applause':\n      return reactionResources.applauseReaction?.frameCount ?? 0;\n    case 'surprised':\n      return reactionResources.surprisedReaction?.frameCount ?? 0;\n    default:\n      return 0;\n  }\n};"]}

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

@@ -48,6 +48,10 @@ export declare const MAX_PINNED_REMOTE_VIDEO_TILES = 4;
 export interface VideoGalleryStrings {
     /** String to notify that local user is sharing their screen */
     screenIsBeingSharedMessage: string;
+    /** Aria label to announce when a remote participant starts sharing their screen */
+    screenShareStartedAnnouncementAriaLabel: string;
+    /** Aria label to announce when a remote participant stops sharing their screen */
+    screenShareStoppedAnnouncementAriaLabel: string;
     /** String to show when remote screen share stream is loading */
     screenShareLoadingMessage: string;
     /** String to show when local screen share stream is loading */

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

@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 import { concatStyleSets, mergeStyles, Stack } from '@fluentui/react';
-import React, { useCallback, useMemo, useRef } from 'react';
+import React, { useCallback, useLayoutEffect, useMemo, useRef } from 'react';
 import { Announcer } from './Announcer';
 import { useEffect } from 'react';
 import { useLocale } from '../localization';
@@ -10,7 +10,7 @@ import { _RemoteVideoTile } from './RemoteVideoTile';
 import { isNarrowWidth, _useContainerHeight, _useContainerWidth } from './utils/responsive';
 import { LocalScreenShare } from './VideoGallery/LocalScreenShare';
 import { RemoteScreenShare } from './VideoGallery/RemoteScreenShare';
-import { _isIdentityMicrosoftTeamsUser } from "../../../acs-ui-common/src";
+import { _formatString, _isIdentityMicrosoftTeamsUser } from "../../../acs-ui-common/src";
 import { _LocalVideoTile } from './LocalVideoTile';
 import { DefaultLayout } from './VideoGallery/DefaultLayout';
 import { FloatingLocalVideoLayout } from './VideoGallery/FloatingLocalVideoLayout';
@@ -134,18 +134,22 @@ export const VideoGallery = (props) => {
         onUnpinParticipantHandler === null || onUnpinParticipantHandler === void 0 ? void 0 : onUnpinParticipantHandler(userId);
     }, [pinnedParticipantsState, setPinnedParticipantsState, onUnpinParticipantHandler]);
     const [announcementString, setAnnouncementString] = React.useState('');
+    const [announcerAriaLive, setAnnouncerAriaLive] = React.useState('polite');
     /**
      * sets the announcement string for VideoGallery actions so that the screenreader will trigger
+     * @param announcement - The message to announce
+     * @param ariaLive - The aria-live mode ('polite' for non-urgent, 'assertive' for important events)
      */
-    const toggleAnnouncerString = useCallback((announcement) => {
+    const toggleAnnouncerString = useCallback((announcement, ariaLive = 'polite') => {
         setAnnouncementString(announcement);
+        setAnnouncerAriaLive(ariaLive);
         /**
          * Clears the announcer string after VideoGallery action allowing it to be re-announced.
          */
         setTimeout(() => {
             setAnnouncementString('');
         }, 3000);
-    }, [setAnnouncementString]);
+    }, [setAnnouncementString, setAnnouncerAriaLive]);
     const defaultOnRenderVideoTile = useCallback((participant, isVideoParticipant) => {
         const remoteVideoStream = participant.videoStream;
         const selectedScalingMode = remoteVideoStream ? selectedScalingModeState[participant.userId] : undefined;
@@ -165,6 +169,31 @@ export const VideoGallery = (props) => {
         return React.createElement(_RemoteVideoTile, { alwaysShowLabelBackground: videoTilesOptions === null || videoTilesOptions === void 0 ? void 0 : videoTilesOptions.alwaysShowLabelBackground, streamId: remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.id, key: participant.userId, userId: participant.userId, remoteParticipant: participant, onCreateRemoteStreamView: isVideoParticipant ? onCreateRemoteStreamView : undefined, onDisposeRemoteStreamView: isVideoParticipant ? onDisposeRemoteVideoStreamView : undefined, isAvailable: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.isAvailable : false, isReceiving: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.isReceiving : false, renderElement: isVideoParticipant ? remoteVideoStream === null || remoteVideoStream === void 0 ? void 0 : remoteVideoStream.renderElement : undefined, remoteVideoViewOptions: createViewOptions(), onRenderAvatar: onRenderAvatar, showMuteIndicator: showMuteIndicator, strings: strings, participantState: participant.state, menuKind: participant.userId === localParticipant.userId ? undefined : remoteVideoTileMenu ? remoteVideoTileMenu.kind === 'drawer' ? 'drawer' : 'contextual' : undefined, drawerMenuHostId: drawerMenuHostId, onPinParticipant: onPinParticipant, onUnpinParticipant: onUnpinParticipant, onUpdateScalingMode: onUpdateScalingMode, isPinned: isPinned, disablePinMenuItem: pinnedParticipants.length >= MAX_PINNED_REMOTE_VIDEO_TILES, toggleAnnouncerString: toggleAnnouncerString, spotlightedParticipantUserIds: spotlightedParticipants, isSpotlighted: isSpotlighted, onStartSpotlight: onStartRemoteSpotlight, onStopSpotlight: onStopRemoteSpotlight, maxParticipantsToSpotlight: maxParticipantsToSpotlight, reactionResources: reactionResources, onMuteParticipant: onMuteParticipant, onForbidAudio: onForbidAudio, onPermitAudio: onPermitAudio, onForbidVideo: onForbidVideo, onPermitVideo: onPermitVideo });
     }, [selectedScalingModeState, pinnedParticipants, videoTilesOptions === null || videoTilesOptions === void 0 ? void 0 : videoTilesOptions.alwaysShowLabelBackground, onCreateRemoteStreamView, onDisposeRemoteVideoStreamView, onRenderAvatar, showMuteIndicator, strings, localParticipant.userId, remoteVideoTileMenu, drawerMenuHostId, onPinParticipant, onUnpinParticipant, onUpdateScalingMode, toggleAnnouncerString, spotlightedParticipants, onStartRemoteSpotlight, onStopRemoteSpotlight, maxParticipantsToSpotlight, reactionResources, onMuteParticipant, onForbidAudio, onPermitAudio, onForbidVideo, onPermitVideo, remoteVideoViewOptions]);
     const screenShareParticipant = remoteParticipants.find(participant => { var _a; return (_a = participant.screenShareStream) === null || _a === void 0 ? void 0 : _a.isAvailable; });
+    // Track the previous screen share participant to detect when screen sharing starts or stops
+    const previousScreenShareParticipantRef = useRef(undefined);
+    // Announce when a remote participant starts or stops sharing their screen for screen reader accessibility
+    // Use useLayoutEffect to trigger announcement synchronously before browser paint,
+    // which should queue the announcement before any focus-shift induced announcements
+    useLayoutEffect(() => {
+        const previousParticipant = previousScreenShareParticipantRef.current;
+        if (screenShareParticipant && (previousParticipant === null || previousParticipant === void 0 ? void 0 : previousParticipant.userId) !== screenShareParticipant.userId) {
+            // Screen share started (or switched to a different participant)
+            const participantName = screenShareParticipant.displayName || strings.displayNamePlaceholder;
+            const announcementMessage = _formatString(strings.screenShareStartedAnnouncementAriaLabel, {
+                participant: participantName
+            });
+            toggleAnnouncerString(announcementMessage, 'assertive');
+        }
+        else if (!screenShareParticipant && previousParticipant) {
+            // Screen share stopped
+            const participantName = previousParticipant.displayName || strings.displayNamePlaceholder;
+            const announcementMessage = _formatString(strings.screenShareStoppedAnnouncementAriaLabel, {
+                participant: participantName
+            });
+            toggleAnnouncerString(announcementMessage, 'assertive');
+        }
+        previousScreenShareParticipantRef.current = screenShareParticipant;
+    }, [screenShareParticipant, strings.displayNamePlaceholder, strings.screenShareStartedAnnouncementAriaLabel, strings.screenShareStoppedAnnouncementAriaLabel, toggleAnnouncerString]);
     const localScreenShareStreamComponent = React.createElement(LocalScreenShare, { localParticipant: localParticipant, renderElement: (_a = localParticipant.screenShareStream) === null || _a === void 0 ? void 0 : _a.renderElement, isAvailable: (_b = localParticipant.screenShareStream) === null || _b === void 0 ? void 0 : _b.isAvailable, onCreateLocalStreamView: onCreateLocalStreamView, onDisposeLocalScreenShareStreamView: onDisposeLocalScreenShareStreamView, localScreenShareView: localScreenShareView });
     const remoteScreenShareComponent = screenShareParticipant && React.createElement(RemoteScreenShare, Object.assign({}, screenShareParticipant, { renderElement: (_c = screenShareParticipant.screenShareStream) === null || _c === void 0 ? void 0 : _c.renderElement, onCreateRemoteStreamView: onCreateRemoteStreamView, onDisposeRemoteStreamView: onDisposeRemoteScreenShareStreamView, isReceiving: (_d = screenShareParticipant.screenShareStream) === null || _d === void 0 ? void 0 : _d.isReceiving, participantVideoScalingMode: selectedScalingModeState[screenShareParticipant.userId], localParticipant: localParticipant, remoteParticipants: remoteParticipants, reactionResources: reactionResources }));
     const screenShareComponent = remoteScreenShareComponent ? remoteScreenShareComponent : localParticipant.isScreenSharingOn ? localScreenShareStreamComponent : undefined;
@@ -212,6 +241,6 @@ export const VideoGallery = (props) => {
         // We don't assign an drawer menu host id to the VideoGallery when a drawerMenuHostId is assigned from props
         id: drawerMenuHostIdFromProp ? undefined : drawerMenuHostId, "data-ui-id": ids.videoGallery, ref: containerRef, className: mergeStyles(videoGalleryOuterDivStyle, styles === null || styles === void 0 ? void 0 : styles.root, unselectable) },
         videoGalleryLayout,
-        React.createElement(Announcer, { announcementString: announcementString, ariaLive: "polite" }));
+        React.createElement(Announcer, { announcementString: announcementString, ariaLive: announcerAriaLive }));
 };
 //# sourceMappingURL=VideoGallery.js.map