@azure/communication-react 1.27.0-alpha-202504260017 → 1.27.0-alpha-202504300018

package/dist/dist-cjs/communication-react/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-DPZ4yAJi.js');
+var index = require('./index-BRTAjDJR.js');
 require('react');
 require('@fluentui/react');
 require('@fluentui/react-components');

package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js

@@ -2,5 +2,5 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-module.exports = '1.27.0-alpha-202504260017';
+module.exports = '1.27.0-alpha-202504300018';
 //# sourceMappingURL=telemetryVersion.js.map

package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map

@@ -1 +1 @@
-{"version":3,"file":"telemetryVersion.js","sourceRoot":"","sources":["../../../../../acs-ui-common/src/telemetryVersion.js"],"names":[],"mappings":";AAAA,uCAAuC;AACvC,kCAAkC;AAElC,wCAAwC;AAExC,MAAM,CAAC,OAAO,GAAG,2BAA2B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.27.0-alpha-202504260017';\n"]}
+{"version":3,"file":"telemetryVersion.js","sourceRoot":"","sources":["../../../../../acs-ui-common/src/telemetryVersion.js"],"names":[],"mappings":";AAAA,uCAAuC;AACvC,kCAAkC;AAElC,wCAAwC;AAExC,MAAM,CAAC,OAAO,GAAG,2BAA2B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.27.0-alpha-202504300018';\n"]}

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

@@ -148,8 +148,9 @@ export const CaptionsBanner = (props) => {
         (isCaptionsOn || /* @conditional-compile-remove(rtt) */ isRealTimeTextOn) && (React.createElement("ul", { ref: captionsScrollDivRef, className: (captionsOptions === null || captionsOptions === void 0 ? void 0 : captionsOptions.height) === 'full'
                 ? captionsBannerFullHeightClassName(theme)
                 : captionsBannerClassName(formFactor, /* @conditional-compile-remove(rtt) */ expandBannerHeight), "data-ui-id": "captions-banner-inner" },
-            /* @conditional-compile-remove(rtt) */ isRealTimeTextOn && (React.createElement(Stack, { className: rttDisclosureBannerClassName() },
-                React.createElement(_RTTDisclosureBanner, { strings: realTimeTextDisclosureBannerStrings }))),
+            /* @conditional-compile-remove(rtt) */ isRealTimeTextOn && (React.createElement("li", null,
+                React.createElement(Stack, { className: rttDisclosureBannerClassName() },
+                    React.createElement(_RTTDisclosureBanner, { strings: realTimeTextDisclosureBannerStrings })))),
             captionsTrampoline())),
         /* @conditional-compile-remove(rtt) */ isRealTimeTextOn && onSendRealTimeText && (React.createElement(TextField, { styles: realTimeTextInputBoxStyles(theme), placeholder: strings.realTimeTextInputBoxDefaultText, value: textFieldValue, onKeyDown: handleKeyDown, onChange: (_, newValue) => {
                 setTextFieldValue(newValue || '');

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

@@ -1 +1 @@
-{"version":3,"file":"CaptionsBanner.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/CaptionsBanner.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAClC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACtE,sCAAsC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACxE,sCAAsC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACrC,OAAO,EACL,yBAAyB,EACzB,uBAAuB,EACvB,iCAAiC,EACjC,0BAA0B,EAC1B,6BAA6B,EAC7B,mBAAmB,EACpB,MAAM,yBAAyB,CAAC;AACjC,sCAAsC;AACtC,OAAO,EAAE,4BAA4B,EAAE,MAAM,yBAAyB,CAAC;AAEvE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,sCAAsC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,sCAAsC;AACtC,OAAO,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAC7D,sCAAsC;AACtC,OAAO,EAAE,4BAA4B,EAAE,MAAM,sCAAsC,CAAC;AACpF,sCAAsC;AACtC,OAAO,EACL,mBAAmB,EACnB,6BAA6B,EAC7B,0BAA0B,EAC3B,MAAM,yBAAyB,CAAC;AACjC,sCAAsC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AACvE,sCAAsC;AACtC,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAkMnD,MAAM,uBAAuB,GAAG,EAAE,CAAC;AAEnC;;;GAGG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAA0B,EAAe,EAAE;;IACxE,MAAM,EACJ,QAAQ;IACR,sCAAsC;IACtC,aAAa,EACb,YAAY,EACZ,uBAAuB,EACvB,cAAc,EACd,UAAU,GAAG,SAAS,EACtB,eAAe;IACf,sCAAsC;IACtC,gBAAgB;IAChB,sCAAsC;IACtC,kBAAkB;IAClB,sCAAsC;IACtC,uBAAuB,EACxB,GAAG,KAAK,CAAC;IACV,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,cAAc,CAAC;IACzD,MAAM,OAAO,mCAAQ,aAAa,GAAK,KAAK,CAAC,OAAO,CAAE,CAAC;IACvD,MAAM,oBAAoB,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC5D,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAU,IAAI,CAAC,CAAC;IAC5E,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,sCAAsC;IACtC,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC7E,sCAAsC;IACtC,MAAM,QAAQ,GAAG,GAAW,EAAE;;QAC5B,IAAI,YAAY,IAAI,gBAAgB,EAAE,CAAC;YACrC,OAAO,MAAA,OAAO,CAAC,qCAAqC,mCAAI,EAAE,CAAC;QAC7D,CAAC;aAAM,IAAI,YAAY,EAAE,CAAC;YACxB,OAAO,MAAA,OAAO,CAAC,0BAA0B,mCAAI,EAAE,CAAC;QAClD,CAAC;aAAM,IAAI,gBAAgB,EAAE,CAAC;YAC5B,OAAO,MAAA,OAAO,CAAC,8BAA8B,mCAAI,EAAE,CAAC;QACtD,CAAC;QACD,OAAO,EAAE,CAAC;IACZ,CAAC,CAAC;IACF,sCAAsC;IACtC,qEAAqE;IACrE,mDAAmD;IACnD,MAAM,YAAY,GAAsD,OAAO,CAAC,GAAG,EAAE;;QACnF,OAAO,4BAA4B,CAAC,QAAQ,EAAE,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,iBAAiB,mCAAI,EAAE,CAAC,CAAC;IACxF,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,iBAAiB,CAAC,CAAC,CAAC;IAEjD,sCAAsC;IACtC,MAAM,cAAc,GAAsD,OAAO,CAAC,GAAG,EAAE;;QACrF,OAAO,CAAC,GAAG,YAAY,EAAE,GAAG,CAAC,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,iBAAiB,mCAAI,EAAE,CAAC,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,YAAY,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAGzG,CAAC;IACN,CAAC,EAAE,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,CAAC;IAElC,MAAM,cAAc,GAAG,GAAS,EAAE;QAChC,IAAI,oBAAoB,CAAC,OAAO,EAAE,CAAC;YACjC,oBAAoB,CAAC,OAAO,CAAC,SAAS,GAAG,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC;QACrF,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,WAAW,CAAC,GAAS,EAAE;QACrD,IAAI,CAAC,oBAAoB,CAAC,OAAO,EAAE,CAAC;YAClC,OAAO;QACT,CAAC;QACD,MAAM,QAAQ,GACZ,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,SAAS,CAAC;YACjD,oBAAoB,CAAC,OAAO,CAAC,YAAY,GAAG,oBAAoB,CAAC,OAAO,CAAC,YAAY,GAAG,uBAAuB,CAAC;QAElH,qBAAqB,CAAC,QAAQ,CAAC,CAAC;IAClC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,OAAO,CAAC;QACvD,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,gBAAgB,CAAC,QAAQ,EAAE,uBAAuB,CAAC,CAAC;QAEvE,OAAO,GAAG,EAAE;YACV,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,mBAAmB,CAAC,QAAQ,EAAE,uBAAuB,CAAC,CAAC;QAC5E,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,uBAAuB,EAAE,YAAY,EAAE,sCAAsC,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAErG,SAAS,CAAC,GAAG,EAAE;QACb,2FAA2F;QAC3F,IAAI,kBAAkB,EAAE,CAAC;YACvB,cAAc,EAAE,CAAC;QACnB,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,sCAAsC,CAAC,aAAa,EAAE,kBAAkB,CAAC,CAAC,CAAC;IACzF,sCAAsC;IACtC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IACjE,sCAAsC;IACtC,SAAS,CAAC,GAAG,EAAE;QACb,6EAA6E;QAC7E,IAAI,uBAAuB,IAAI,CAAC,uBAAuB,CAAC,QAAQ,EAAE,CAAC;YACjE,iBAAiB,CAAC,EAAE,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,EAAE,CAAC,uBAAuB,CAAC,CAAC,CAAC;IAE9B,sCAAsC;IACtC,MAAM,aAAa,GAAG,CAAC,KAAkE,EAAQ,EAAE;QACjG,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;YAC1B,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,cAAc,IAAI,kBAAkB,EAAE,CAAC;gBACzC,kBAAkB,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;gBACzC,iBAAiB,CAAC,EAAE,CAAC,CAAC;YACxB,CAAC;QACH,CAAC;IACH,CAAC,CAAC;IAEF,sCAAsC;IACtC,MAAM,mCAAmC,GAAG;QAC1C,WAAW,EAAE,MAAA,OAAO,CAAC,uBAAuB,mCAAI,EAAE;QAClD,aAAa,EAAE,MAAA,OAAO,CAAC,yBAAyB,mCAAI,EAAE;QACtD,eAAe,EAAE,MAAA,OAAO,CAAC,2BAA2B,mCAAI,EAAE;KAC3D,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAgB,EAAE;QAC3C,sCAAsC;QACtC,OAAO,CACL,0CACG,cAAc;aACZ,MAAM,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC;aAC5B,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;YACf,IAAI,SAAS,IAAI,OAAO,EAAE,CAAC;gBACzB,OAAO,CACL,4BAAI,GAAG,EAAE,kBAAkB,OAAO,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,yBAAyB,uBAAqB,IAAI;oBACpG,oBAAC,YAAY,oBAAM,OAAmC,EAAI,CACvD,CACN,CAAC;YACJ,CAAC;YACD,OAAO,CACL,4BAAI,GAAG,EAAE,cAAc,OAAO,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,yBAAyB,uBAAqB,IAAI;gBAChG,oBAAC,QAAQ,oBAAM,OAA+B,IAAE,cAAc,EAAE,cAAc,IAAI,CAC/E,CACN,CAAC;YACF,OAAO,yCAAK,CAAC;QACf,CAAC,CAAC,CACH,CACJ,CAAC;QAEF,OAAO,CACL,0CACG,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;YACxB,OAAO,CACL,4BAAI,GAAG,EAAE,OAAO,CAAC,EAAE,EAAE,SAAS,EAAE,yBAAyB,uBAAqB,IAAI;gBAChF,oBAAC,QAAQ,oBAAM,OAA+B,IAAE,cAAc,EAAE,cAAc,IAAI,CAC/E,CACN,CAAC;QACJ,CAAC,CAAC,CACD,CACJ,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,0CACG,CAAC,uBAAuB,IAAI,YAAY,IAAI,sCAAsC,CAAC,gBAAgB,CAAC,IAAI,CACvG,oBAAC,SAAS,IAAC,kBAAkB,QAAC,SAAS,EAAE,0BAA0B,gBAAa,iBAAiB;QAE7F,sCAAsC,CAAC,CAAC,YAAY,IAAI,gBAAgB,CAAC,IAAI,UAAU,KAAK,SAAS,IAAI,CACvG,oBAAC,KAAK,IACJ,UAAU,QACV,eAAe,EAAC,eAAe,EAC/B,aAAa,EAAC,QAAQ,EACtB,SAAS,EAAE,6BAA6B;YAExC,oBAAC,IAAI,IAAC,SAAS,EAAE,cAAc,IAAG,QAAQ,EAAE,CAAQ;YACpD,oBAAC,UAAU,kBACE,6BAA6B,EACxC,SAAS,EAAE,EAAE,QAAQ,EAAE,kBAAkB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY,EAAE,EAC3E,SAAS,EAAE,kBAAkB,CAAC,CAAC,CAAC,OAAO,CAAC,uBAAuB,CAAC,CAAC,CAAC,OAAO,CAAC,qBAAqB,EAC/F,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,CAAC,kBAAkB,CAAC,EACzD,MAAM,EAAE,mBAAmB,CAAC,KAAK,CAAC,GAClC,CACI,CACT;QAEF,CAAC,YAAY,IAAI,sCAAsC,CAAC,gBAAgB,CAAC,IAAI,CAC5E,4BACE,GAAG,EAAE,oBAAoB,EACzB,SAAS,EACP,CAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,MAAM,MAAK,MAAM;gBAChC,CAAC,CAAC,iCAAiC,CAAC,KAAK,CAAC;gBAC1C,CAAC,CAAC,uBAAuB,CAAC,UAAU,EAAE,sCAAsC,CAAC,kBAAkB,CAAC,gBAEzF,uBAAuB;YAGhC,sCAAsC,CAAC,gBAAgB,IAAI,CACzD,oBAAC,KAAK,IAAC,SAAS,EAAE,4BAA4B,EAAE;gBAC9C,oBAAC,oBAAoB,IAAC,OAAO,EAAE,mCAAmC,GAAI,CAChE,CACT;YAEF,kBAAkB,EAAE,CAClB,CACN;QAEC,sCAAsC,CAAC,gBAAgB,IAAI,kBAAkB,IAAI,CAC/E,oBAAC,SAAS,IACR,MAAM,EAAE,0BAA0B,CAAC,KAAK,CAAC,EACzC,WAAW,EAAE,OAAO,CAAC,+BAA+B,EACpD,KAAK,EAAE,cAAc,EACrB,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,EAAE;gBACxB,iBAAiB,CAAC,QAAQ,IAAI,EAAE,CAAC,CAAC;gBAClC,kBAAkB,CAAC,QAAQ,IAAI,EAAE,EAAE,KAAK,CAAC,CAAC;YAC5C,CAAC,EACD,SAAS,EAAE,IAAI,EACf,YAAY,EAAE,cAAc,CAAC,MAAM,IAAI,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,6BAA6B,CAAC,CAAC,CAAC,SAAS,GAC/F,CACH;QAEF,CAAC,YAAY,IAAI,sCAAsC,CAAC,CAAC,gBAAgB,IAAI,CAC5E,oBAAC,KAAK,IACJ,aAAa,EAAC,QAAQ,EACtB,MAAM,EACJ,CAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,MAAM,MAAK,MAAM;gBAChC,CAAC,CAAC,6BAA6B,CAAC,KAAK,CAAC;gBACtC,CAAC,CAAC,mBAAmB,CAAC,UAAU,CAAC,uBAElB,IAAI;YAEvB,oBAAC,OAAO,IAAC,KAAK,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,yBAAyB,EAAE,QAAQ,EAAC,WAAW,EAAC,aAAa,EAAC,OAAO,GAAG,CAC3F,CACT,CACS,CACb,CACA,CACJ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport { Stack, FocusZone, Spinner, useTheme } from '@fluentui/react';\n/* @conditional-compile-remove(rtt) */\nimport { TextField } from '@fluentui/react';\nimport React, { useEffect, useRef, useState, useCallback } from 'react';\n/* @conditional-compile-remove(rtt) */\nimport { useMemo } from 'react';\nimport { _Caption } from './Caption';\nimport {\n  captionContainerClassName,\n  captionsBannerClassName,\n  captionsBannerFullHeightClassName,\n  captionsContainerClassName,\n  loadingBannerFullHeightStyles,\n  loadingBannerStyles\n} from './styles/Captions.style';\n/* @conditional-compile-remove(rtt) */\nimport { rttDisclosureBannerClassName } from './styles/Captions.style';\nimport { OnRenderAvatarCallback } from '../types';\nimport { useLocale } from '../localization';\n/* @conditional-compile-remove(rtt) */\nimport { RealTimeText } from './RealTimeText';\n/* @conditional-compile-remove(rtt) */\nimport { _RTTDisclosureBanner } from './RTTDisclosureBanner';\n/* @conditional-compile-remove(rtt) */\nimport { sortCaptionsAndRealTimeTexts } from './utils/sortCaptionsAndRealTimeTexts';\n/* @conditional-compile-remove(rtt) */\nimport {\n  expandIconClassName,\n  bannerTitleContainerClassName,\n  realTimeTextInputBoxStyles\n} from './styles/Captions.style';\n/* @conditional-compile-remove(rtt) */\nimport { titleClassName } from './styles/CaptionsSettingsModal.styles';\n/* @conditional-compile-remove(rtt) */\nimport { Text, IconButton } from '@fluentui/react';\n\n/**\n * @public\n * information required for each line of caption\n */\nexport type CaptionsInformation = {\n  /**\n   * unique id for each caption\n   */\n  id: string;\n  /**\n   * speaker's display name\n   */\n  displayName: string;\n  /**\n   * content of the caption\n   */\n  captionText: string;\n  /**\n   * id of the speaker\n   */\n  userId?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * timestamp when the caption was created\n   * Please note that this value is essential for determining the order of captions and real time text messages\n   * If you are using both captions and real time text, please ensure that the createdTimeStamp is populated\n   */\n  createdTimeStamp?: Date;\n};\n\n/* @conditional-compile-remove(rtt) */\n/**\n * @public\n * information required for each line of real time text\n */\nexport type RealTimeTextInformation = {\n  /**\n   * The id of the real time text.\n   */\n  id: number;\n  /**\n   * sender's display name\n   */\n  displayName: string;\n  /**\n   * id of the sender\n   */\n  userId?: string;\n  /**\n   * The real time text message.\n   */\n  message: string;\n  /**\n   * if the real time text received is partial\n   */\n  isTyping: boolean;\n  /**\n   * timestamp when the real time text was finalized\n   */\n  finalizedTimeStamp: Date;\n  /**\n   * If message originated from the local participant\n   * default value is false\n   */\n  isMe?: boolean;\n};\n/**\n * @public\n * strings for captions banner\n */\nexport interface CaptionsBannerStrings {\n  /**\n   * Spinner text for captions banner\n   */\n  captionsBannerSpinnerText?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Default text for RTT input text box\n   */\n  realTimeTextInputBoxDefaultText?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Error message for RTT input text box when the size exceeds the limit 2000\n   */\n  realTimeTextInputErrorMessage?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Real time text disclosure banner title\n   */\n  realTimeTextBannerTitle?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Real time text disclosure banner content\n   */\n  realTimeTextBannerContent?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Real time text disclosure banner link label\n   */\n  realTimeTextBannerLinkLabel?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Title for the container when only captions is enabled\n   */\n  captionsOnlyContainerTitle?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Title for the container when only real time text is enabled\n   */\n  realTimeTextOnlyContainerTitle?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Title for the container when both captions and real time text is enabled\n   */\n  captionsAndRealTimeTextContainerTitle?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Expand button aria label\n   */\n  expandButtonAriaLabel?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Minimize button aria label\n   */\n  minimizeButtonAriaLabel?: string;\n}\n\n/**\n * @public\n * CaptionsBanner Component Props.\n */\nexport interface CaptionsBannerProps {\n  /**\n   * Array of captions to be displayed\n   */\n  captions: CaptionsInformation[];\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Array of finalized and partial real time text messages\n   */\n  realTimeTexts?: {\n    completedMessages?: RealTimeTextInformation[];\n    currentInProgress?: RealTimeTextInformation[];\n    myInProgress?: RealTimeTextInformation;\n  };\n  /**\n   * Flag to indicate if captions are on\n   */\n  isCaptionsOn?: boolean;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Flag to indicate if real time text is on\n   */\n  isRealTimeTextOn?: boolean;\n  /**\n   * Flag to indicate if captions are being started\n   * This is used to show spinner while captions are being started\n   */\n  startCaptionsInProgress?: boolean;\n  /**\n   * Optional callback to override render of the avatar.\n   *\n   * @param userId - user Id\n   */\n  onRenderAvatar?: OnRenderAvatarCallback;\n  /**\n   * Optional strings for the component\n   */\n  strings?: CaptionsBannerStrings;\n  /**\n   * Optional form factor for the component.\n   * @defaultValue 'default'\n   */\n  formFactor?: 'default' | 'compact';\n  /**\n   * Optional options for the component.\n   */\n  captionsOptions?: {\n    height: 'full' | 'default';\n  };\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Optional callback to send real time text.\n   */\n  onSendRealTimeText?: (text: string, isFinalized: boolean) => Promise<void>;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Latest local real time text\n   */\n  latestLocalRealTimeText?: RealTimeTextInformation;\n}\n\nconst SCROLL_OFFSET_ALLOWANCE = 20;\n\n/**\n * @public\n * A component for displaying a CaptionsBanner with user icon, displayName and captions text.\n */\nexport const CaptionsBanner = (props: CaptionsBannerProps): JSX.Element => {\n  const {\n    captions,\n    /* @conditional-compile-remove(rtt) */\n    realTimeTexts,\n    isCaptionsOn,\n    startCaptionsInProgress,\n    onRenderAvatar,\n    formFactor = 'default',\n    captionsOptions,\n    /* @conditional-compile-remove(rtt) */\n    isRealTimeTextOn,\n    /* @conditional-compile-remove(rtt) */\n    onSendRealTimeText,\n    /* @conditional-compile-remove(rtt) */\n    latestLocalRealTimeText\n  } = props;\n  const localeStrings = useLocale().strings.captionsBanner;\n  const strings = { ...localeStrings, ...props.strings };\n  const captionsScrollDivRef = useRef<HTMLUListElement>(null);\n  const [isAtBottomOfScroll, setIsAtBottomOfScroll] = useState<boolean>(true);\n  const theme = useTheme();\n  /* @conditional-compile-remove(rtt) */\n  const [expandBannerHeight, setExpandBannerHeight] = useState<boolean>(false);\n  /* @conditional-compile-remove(rtt) */\n  const getTitle = (): string => {\n    if (isCaptionsOn && isRealTimeTextOn) {\n      return strings.captionsAndRealTimeTextContainerTitle ?? '';\n    } else if (isCaptionsOn) {\n      return strings.captionsOnlyContainerTitle ?? '';\n    } else if (isRealTimeTextOn) {\n      return strings.realTimeTextOnlyContainerTitle ?? '';\n    }\n    return '';\n  };\n  /* @conditional-compile-remove(rtt) */\n  // merge realtimetexts and captions into one array based on timestamp\n  // Combine captions and realTimeTexts into one list\n  const combinedList: (CaptionsInformation | RealTimeTextInformation)[] = useMemo(() => {\n    return sortCaptionsAndRealTimeTexts(captions, realTimeTexts?.completedMessages ?? []);\n  }, [captions, realTimeTexts?.completedMessages]);\n\n  /* @conditional-compile-remove(rtt) */\n  const mergedCaptions: (CaptionsInformation | RealTimeTextInformation)[] = useMemo(() => {\n    return [...combinedList, ...(realTimeTexts?.currentInProgress ?? []), realTimeTexts?.myInProgress].slice(-50) as (\n      | CaptionsInformation\n      | RealTimeTextInformation\n    )[];\n  }, [combinedList, realTimeTexts]);\n\n  const scrollToBottom = (): void => {\n    if (captionsScrollDivRef.current) {\n      captionsScrollDivRef.current.scrollTop = captionsScrollDivRef.current.scrollHeight;\n    }\n  };\n\n  const handleScrollToTheBottom = useCallback((): void => {\n    if (!captionsScrollDivRef.current) {\n      return;\n    }\n    const atBottom =\n      Math.ceil(captionsScrollDivRef.current.scrollTop) >=\n      captionsScrollDivRef.current.scrollHeight - captionsScrollDivRef.current.clientHeight - SCROLL_OFFSET_ALLOWANCE;\n\n    setIsAtBottomOfScroll(atBottom);\n  }, []);\n\n  useEffect(() => {\n    const captionsScrollDiv = captionsScrollDivRef.current;\n    captionsScrollDiv?.addEventListener('scroll', handleScrollToTheBottom);\n\n    return () => {\n      captionsScrollDiv?.removeEventListener('scroll', handleScrollToTheBottom);\n    };\n  }, [handleScrollToTheBottom, isCaptionsOn, /* @conditional-compile-remove(rtt) */ isRealTimeTextOn]);\n\n  useEffect(() => {\n    // only auto scroll to bottom is already is at bottom of scroll before new caption comes in\n    if (isAtBottomOfScroll) {\n      scrollToBottom();\n    }\n  }, [captions, /* @conditional-compile-remove(rtt) */ realTimeTexts, isAtBottomOfScroll]);\n  /* @conditional-compile-remove(rtt) */\n  const [textFieldValue, setTextFieldValue] = useState<string>('');\n  /* @conditional-compile-remove(rtt) */\n  useEffect(() => {\n    // if the latest real time text sent by myself is final, clear the text field\n    if (latestLocalRealTimeText && !latestLocalRealTimeText.isTyping) {\n      setTextFieldValue('');\n    }\n  }, [latestLocalRealTimeText]);\n\n  /* @conditional-compile-remove(rtt) */\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>): void => {\n    if (event.key === 'Enter') {\n      event.preventDefault();\n      if (textFieldValue && onSendRealTimeText) {\n        onSendRealTimeText(textFieldValue, true);\n        setTextFieldValue('');\n      }\n    }\n  };\n\n  /* @conditional-compile-remove(rtt) */\n  const realTimeTextDisclosureBannerStrings = {\n    bannerTitle: strings.realTimeTextBannerTitle ?? '',\n    bannerContent: strings.realTimeTextBannerContent ?? '',\n    bannerLinkLabel: strings.realTimeTextBannerLinkLabel ?? ''\n  };\n\n  const captionsTrampoline = (): JSX.Element => {\n    /* @conditional-compile-remove(rtt) */\n    return (\n      <>\n        {mergedCaptions\n          .filter((caption) => caption)\n          .map((caption) => {\n            if ('message' in caption) {\n              return (\n                <li key={`RealTimeText - ${caption.id}`} className={captionContainerClassName} data-is-focusable={true}>\n                  <RealTimeText {...(caption as RealTimeTextInformation)} />\n                </li>\n              );\n            }\n            return (\n              <li key={`Captions - ${caption.id}`} className={captionContainerClassName} data-is-focusable={true}>\n                <_Caption {...(caption as CaptionsInformation)} onRenderAvatar={onRenderAvatar} />\n              </li>\n            );\n            return <></>;\n          })}\n      </>\n    );\n\n    return (\n      <>\n        {captions.map((caption) => {\n          return (\n            <li key={caption.id} className={captionContainerClassName} data-is-focusable={true}>\n              <_Caption {...(caption as CaptionsInformation)} onRenderAvatar={onRenderAvatar} />\n            </li>\n          );\n        })}\n      </>\n    );\n  };\n\n  return (\n    <>\n      {(startCaptionsInProgress || isCaptionsOn || /* @conditional-compile-remove(rtt) */ isRealTimeTextOn) && (\n        <FocusZone shouldFocusOnMount className={captionsContainerClassName} data-ui-id=\"captions-banner\">\n          {\n            /* @conditional-compile-remove(rtt) */ (isCaptionsOn || isRealTimeTextOn) && formFactor === 'compact' && (\n              <Stack\n                horizontal\n                horizontalAlign=\"space-between\"\n                verticalAlign=\"center\"\n                className={bannerTitleContainerClassName}\n              >\n                <Text className={titleClassName}>{getTitle()}</Text>\n                <IconButton\n                  data-ui-id=\"captions-banner-expand-icon\"\n                  iconProps={{ iconName: expandBannerHeight ? 'MinimizeIcon' : 'ExpandIcon' }}\n                  ariaLabel={expandBannerHeight ? strings.minimizeButtonAriaLabel : strings.expandButtonAriaLabel}\n                  onClick={() => setExpandBannerHeight(!expandBannerHeight)}\n                  styles={expandIconClassName(theme)}\n                />\n              </Stack>\n            )\n          }\n          {(isCaptionsOn || /* @conditional-compile-remove(rtt) */ isRealTimeTextOn) && (\n            <ul\n              ref={captionsScrollDivRef}\n              className={\n                captionsOptions?.height === 'full'\n                  ? captionsBannerFullHeightClassName(theme)\n                  : captionsBannerClassName(formFactor, /* @conditional-compile-remove(rtt) */ expandBannerHeight)\n              }\n              data-ui-id=\"captions-banner-inner\"\n            >\n              {\n                /* @conditional-compile-remove(rtt) */ isRealTimeTextOn && (\n                  <Stack className={rttDisclosureBannerClassName()}>\n                    <_RTTDisclosureBanner strings={realTimeTextDisclosureBannerStrings} />\n                  </Stack>\n                )\n              }\n              {captionsTrampoline()}\n            </ul>\n          )}\n          {\n            /* @conditional-compile-remove(rtt) */ isRealTimeTextOn && onSendRealTimeText && (\n              <TextField\n                styles={realTimeTextInputBoxStyles(theme)}\n                placeholder={strings.realTimeTextInputBoxDefaultText}\n                value={textFieldValue}\n                onKeyDown={handleKeyDown}\n                onChange={(_, newValue) => {\n                  setTextFieldValue(newValue || '');\n                  onSendRealTimeText(newValue || '', false);\n                }}\n                maxLength={2000}\n                errorMessage={textFieldValue.length >= 2000 ? strings.realTimeTextInputErrorMessage : undefined}\n              />\n            )\n          }\n          {!isCaptionsOn && /* @conditional-compile-remove(rtt) */ !isRealTimeTextOn && (\n            <Stack\n              verticalAlign=\"center\"\n              styles={\n                captionsOptions?.height === 'full'\n                  ? loadingBannerFullHeightStyles(theme)\n                  : loadingBannerStyles(formFactor)\n              }\n              data-is-focusable={true}\n            >\n              <Spinner label={strings?.captionsBannerSpinnerText} ariaLive=\"assertive\" labelPosition=\"right\" />\n            </Stack>\n          )}\n        </FocusZone>\n      )}\n    </>\n  );\n};\n"]}
+{"version":3,"file":"CaptionsBanner.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/CaptionsBanner.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport { Stack, FocusZone, Spinner, useTheme } from '@fluentui/react';\n/* @conditional-compile-remove(rtt) */\nimport { TextField } from '@fluentui/react';\nimport React, { useEffect, useRef, useState, useCallback } from 'react';\n/* @conditional-compile-remove(rtt) */\nimport { useMemo } from 'react';\nimport { _Caption } from './Caption';\nimport {\n  captionContainerClassName,\n  captionsBannerClassName,\n  captionsBannerFullHeightClassName,\n  captionsContainerClassName,\n  loadingBannerFullHeightStyles,\n  loadingBannerStyles\n} from './styles/Captions.style';\n/* @conditional-compile-remove(rtt) */\nimport { rttDisclosureBannerClassName } from './styles/Captions.style';\nimport { OnRenderAvatarCallback } from '../types';\nimport { useLocale } from '../localization';\n/* @conditional-compile-remove(rtt) */\nimport { RealTimeText } from './RealTimeText';\n/* @conditional-compile-remove(rtt) */\nimport { _RTTDisclosureBanner } from './RTTDisclosureBanner';\n/* @conditional-compile-remove(rtt) */\nimport { sortCaptionsAndRealTimeTexts } from './utils/sortCaptionsAndRealTimeTexts';\n/* @conditional-compile-remove(rtt) */\nimport {\n  expandIconClassName,\n  bannerTitleContainerClassName,\n  realTimeTextInputBoxStyles\n} from './styles/Captions.style';\n/* @conditional-compile-remove(rtt) */\nimport { titleClassName } from './styles/CaptionsSettingsModal.styles';\n/* @conditional-compile-remove(rtt) */\nimport { Text, IconButton } from '@fluentui/react';\n\n/**\n * @public\n * information required for each line of caption\n */\nexport type CaptionsInformation = {\n  /**\n   * unique id for each caption\n   */\n  id: string;\n  /**\n   * speaker's display name\n   */\n  displayName: string;\n  /**\n   * content of the caption\n   */\n  captionText: string;\n  /**\n   * id of the speaker\n   */\n  userId?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * timestamp when the caption was created\n   * Please note that this value is essential for determining the order of captions and real time text messages\n   * If you are using both captions and real time text, please ensure that the createdTimeStamp is populated\n   */\n  createdTimeStamp?: Date;\n};\n\n/* @conditional-compile-remove(rtt) */\n/**\n * @public\n * information required for each line of real time text\n */\nexport type RealTimeTextInformation = {\n  /**\n   * The id of the real time text.\n   */\n  id: number;\n  /**\n   * sender's display name\n   */\n  displayName: string;\n  /**\n   * id of the sender\n   */\n  userId?: string;\n  /**\n   * The real time text message.\n   */\n  message: string;\n  /**\n   * if the real time text received is partial\n   */\n  isTyping: boolean;\n  /**\n   * timestamp when the real time text was finalized\n   */\n  finalizedTimeStamp: Date;\n  /**\n   * If message originated from the local participant\n   * default value is false\n   */\n  isMe?: boolean;\n};\n/**\n * @public\n * strings for captions banner\n */\nexport interface CaptionsBannerStrings {\n  /**\n   * Spinner text for captions banner\n   */\n  captionsBannerSpinnerText?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Default text for RTT input text box\n   */\n  realTimeTextInputBoxDefaultText?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Error message for RTT input text box when the size exceeds the limit 2000\n   */\n  realTimeTextInputErrorMessage?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Real time text disclosure banner title\n   */\n  realTimeTextBannerTitle?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Real time text disclosure banner content\n   */\n  realTimeTextBannerContent?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Real time text disclosure banner link label\n   */\n  realTimeTextBannerLinkLabel?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Title for the container when only captions is enabled\n   */\n  captionsOnlyContainerTitle?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Title for the container when only real time text is enabled\n   */\n  realTimeTextOnlyContainerTitle?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Title for the container when both captions and real time text is enabled\n   */\n  captionsAndRealTimeTextContainerTitle?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Expand button aria label\n   */\n  expandButtonAriaLabel?: string;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Minimize button aria label\n   */\n  minimizeButtonAriaLabel?: string;\n}\n\n/**\n * @public\n * CaptionsBanner Component Props.\n */\nexport interface CaptionsBannerProps {\n  /**\n   * Array of captions to be displayed\n   */\n  captions: CaptionsInformation[];\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Array of finalized and partial real time text messages\n   */\n  realTimeTexts?: {\n    completedMessages?: RealTimeTextInformation[];\n    currentInProgress?: RealTimeTextInformation[];\n    myInProgress?: RealTimeTextInformation;\n  };\n  /**\n   * Flag to indicate if captions are on\n   */\n  isCaptionsOn?: boolean;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Flag to indicate if real time text is on\n   */\n  isRealTimeTextOn?: boolean;\n  /**\n   * Flag to indicate if captions are being started\n   * This is used to show spinner while captions are being started\n   */\n  startCaptionsInProgress?: boolean;\n  /**\n   * Optional callback to override render of the avatar.\n   *\n   * @param userId - user Id\n   */\n  onRenderAvatar?: OnRenderAvatarCallback;\n  /**\n   * Optional strings for the component\n   */\n  strings?: CaptionsBannerStrings;\n  /**\n   * Optional form factor for the component.\n   * @defaultValue 'default'\n   */\n  formFactor?: 'default' | 'compact';\n  /**\n   * Optional options for the component.\n   */\n  captionsOptions?: {\n    height: 'full' | 'default';\n  };\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Optional callback to send real time text.\n   */\n  onSendRealTimeText?: (text: string, isFinalized: boolean) => Promise<void>;\n  /* @conditional-compile-remove(rtt) */\n  /**\n   * Latest local real time text\n   */\n  latestLocalRealTimeText?: RealTimeTextInformation;\n}\n\nconst SCROLL_OFFSET_ALLOWANCE = 20;\n\n/**\n * @public\n * A component for displaying a CaptionsBanner with user icon, displayName and captions text.\n */\nexport const CaptionsBanner = (props: CaptionsBannerProps): JSX.Element => {\n  const {\n    captions,\n    /* @conditional-compile-remove(rtt) */\n    realTimeTexts,\n    isCaptionsOn,\n    startCaptionsInProgress,\n    onRenderAvatar,\n    formFactor = 'default',\n    captionsOptions,\n    /* @conditional-compile-remove(rtt) */\n    isRealTimeTextOn,\n    /* @conditional-compile-remove(rtt) */\n    onSendRealTimeText,\n    /* @conditional-compile-remove(rtt) */\n    latestLocalRealTimeText\n  } = props;\n  const localeStrings = useLocale().strings.captionsBanner;\n  const strings = { ...localeStrings, ...props.strings };\n  const captionsScrollDivRef = useRef<HTMLUListElement>(null);\n  const [isAtBottomOfScroll, setIsAtBottomOfScroll] = useState<boolean>(true);\n  const theme = useTheme();\n  /* @conditional-compile-remove(rtt) */\n  const [expandBannerHeight, setExpandBannerHeight] = useState<boolean>(false);\n  /* @conditional-compile-remove(rtt) */\n  const getTitle = (): string => {\n    if (isCaptionsOn && isRealTimeTextOn) {\n      return strings.captionsAndRealTimeTextContainerTitle ?? '';\n    } else if (isCaptionsOn) {\n      return strings.captionsOnlyContainerTitle ?? '';\n    } else if (isRealTimeTextOn) {\n      return strings.realTimeTextOnlyContainerTitle ?? '';\n    }\n    return '';\n  };\n  /* @conditional-compile-remove(rtt) */\n  // merge realtimetexts and captions into one array based on timestamp\n  // Combine captions and realTimeTexts into one list\n  const combinedList: (CaptionsInformation | RealTimeTextInformation)[] = useMemo(() => {\n    return sortCaptionsAndRealTimeTexts(captions, realTimeTexts?.completedMessages ?? []);\n  }, [captions, realTimeTexts?.completedMessages]);\n\n  /* @conditional-compile-remove(rtt) */\n  const mergedCaptions: (CaptionsInformation | RealTimeTextInformation)[] = useMemo(() => {\n    return [...combinedList, ...(realTimeTexts?.currentInProgress ?? []), realTimeTexts?.myInProgress].slice(-50) as (\n      | CaptionsInformation\n      | RealTimeTextInformation\n    )[];\n  }, [combinedList, realTimeTexts]);\n\n  const scrollToBottom = (): void => {\n    if (captionsScrollDivRef.current) {\n      captionsScrollDivRef.current.scrollTop = captionsScrollDivRef.current.scrollHeight;\n    }\n  };\n\n  const handleScrollToTheBottom = useCallback((): void => {\n    if (!captionsScrollDivRef.current) {\n      return;\n    }\n    const atBottom =\n      Math.ceil(captionsScrollDivRef.current.scrollTop) >=\n      captionsScrollDivRef.current.scrollHeight - captionsScrollDivRef.current.clientHeight - SCROLL_OFFSET_ALLOWANCE;\n\n    setIsAtBottomOfScroll(atBottom);\n  }, []);\n\n  useEffect(() => {\n    const captionsScrollDiv = captionsScrollDivRef.current;\n    captionsScrollDiv?.addEventListener('scroll', handleScrollToTheBottom);\n\n    return () => {\n      captionsScrollDiv?.removeEventListener('scroll', handleScrollToTheBottom);\n    };\n  }, [handleScrollToTheBottom, isCaptionsOn, /* @conditional-compile-remove(rtt) */ isRealTimeTextOn]);\n\n  useEffect(() => {\n    // only auto scroll to bottom is already is at bottom of scroll before new caption comes in\n    if (isAtBottomOfScroll) {\n      scrollToBottom();\n    }\n  }, [captions, /* @conditional-compile-remove(rtt) */ realTimeTexts, isAtBottomOfScroll]);\n  /* @conditional-compile-remove(rtt) */\n  const [textFieldValue, setTextFieldValue] = useState<string>('');\n  /* @conditional-compile-remove(rtt) */\n  useEffect(() => {\n    // if the latest real time text sent by myself is final, clear the text field\n    if (latestLocalRealTimeText && !latestLocalRealTimeText.isTyping) {\n      setTextFieldValue('');\n    }\n  }, [latestLocalRealTimeText]);\n\n  /* @conditional-compile-remove(rtt) */\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>): void => {\n    if (event.key === 'Enter') {\n      event.preventDefault();\n      if (textFieldValue && onSendRealTimeText) {\n        onSendRealTimeText(textFieldValue, true);\n        setTextFieldValue('');\n      }\n    }\n  };\n\n  /* @conditional-compile-remove(rtt) */\n  const realTimeTextDisclosureBannerStrings = {\n    bannerTitle: strings.realTimeTextBannerTitle ?? '',\n    bannerContent: strings.realTimeTextBannerContent ?? '',\n    bannerLinkLabel: strings.realTimeTextBannerLinkLabel ?? ''\n  };\n\n  const captionsTrampoline = (): JSX.Element => {\n    /* @conditional-compile-remove(rtt) */\n    return (\n      <>\n        {mergedCaptions\n          .filter((caption) => caption)\n          .map((caption) => {\n            if ('message' in caption) {\n              return (\n                <li key={`RealTimeText - ${caption.id}`} className={captionContainerClassName} data-is-focusable={true}>\n                  <RealTimeText {...(caption as RealTimeTextInformation)} />\n                </li>\n              );\n            }\n            return (\n              <li key={`Captions - ${caption.id}`} className={captionContainerClassName} data-is-focusable={true}>\n                <_Caption {...(caption as CaptionsInformation)} onRenderAvatar={onRenderAvatar} />\n              </li>\n            );\n            return <></>;\n          })}\n      </>\n    );\n\n    return (\n      <>\n        {captions.map((caption) => {\n          return (\n            <li key={caption.id} className={captionContainerClassName} data-is-focusable={true}>\n              <_Caption {...(caption as CaptionsInformation)} onRenderAvatar={onRenderAvatar} />\n            </li>\n          );\n        })}\n      </>\n    );\n  };\n\n  return (\n    <>\n      {(startCaptionsInProgress || isCaptionsOn || /* @conditional-compile-remove(rtt) */ isRealTimeTextOn) && (\n        <FocusZone shouldFocusOnMount className={captionsContainerClassName} data-ui-id=\"captions-banner\">\n          {\n            /* @conditional-compile-remove(rtt) */ (isCaptionsOn || isRealTimeTextOn) && formFactor === 'compact' && (\n              <Stack\n                horizontal\n                horizontalAlign=\"space-between\"\n                verticalAlign=\"center\"\n                className={bannerTitleContainerClassName}\n              >\n                <Text className={titleClassName}>{getTitle()}</Text>\n                <IconButton\n                  data-ui-id=\"captions-banner-expand-icon\"\n                  iconProps={{ iconName: expandBannerHeight ? 'MinimizeIcon' : 'ExpandIcon' }}\n                  ariaLabel={expandBannerHeight ? strings.minimizeButtonAriaLabel : strings.expandButtonAriaLabel}\n                  onClick={() => setExpandBannerHeight(!expandBannerHeight)}\n                  styles={expandIconClassName(theme)}\n                />\n              </Stack>\n            )\n          }\n          {(isCaptionsOn || /* @conditional-compile-remove(rtt) */ isRealTimeTextOn) && (\n            <ul\n              ref={captionsScrollDivRef}\n              className={\n                captionsOptions?.height === 'full'\n                  ? captionsBannerFullHeightClassName(theme)\n                  : captionsBannerClassName(formFactor, /* @conditional-compile-remove(rtt) */ expandBannerHeight)\n              }\n              data-ui-id=\"captions-banner-inner\"\n            >\n              {\n                /* @conditional-compile-remove(rtt) */ isRealTimeTextOn && (\n                  <li>\n                    <Stack className={rttDisclosureBannerClassName()}>\n                      <_RTTDisclosureBanner strings={realTimeTextDisclosureBannerStrings} />\n                    </Stack>\n                  </li>\n                )\n              }\n              {captionsTrampoline()}\n            </ul>\n          )}\n          {\n            /* @conditional-compile-remove(rtt) */ isRealTimeTextOn && onSendRealTimeText && (\n              <TextField\n                styles={realTimeTextInputBoxStyles(theme)}\n                placeholder={strings.realTimeTextInputBoxDefaultText}\n                value={textFieldValue}\n                onKeyDown={handleKeyDown}\n                onChange={(_, newValue) => {\n                  setTextFieldValue(newValue || '');\n                  onSendRealTimeText(newValue || '', false);\n                }}\n                maxLength={2000}\n                errorMessage={textFieldValue.length >= 2000 ? strings.realTimeTextInputErrorMessage : undefined}\n              />\n            )\n          }\n          {!isCaptionsOn && /* @conditional-compile-remove(rtt) */ !isRealTimeTextOn && (\n            <Stack\n              verticalAlign=\"center\"\n              styles={\n                captionsOptions?.height === 'full'\n                  ? loadingBannerFullHeightStyles(theme)\n                  : loadingBannerStyles(formFactor)\n              }\n              data-is-focusable={true}\n            >\n              <Spinner label={strings?.captionsBannerSpinnerText} ariaLive=\"assertive\" labelPosition=\"right\" />\n            </Stack>\n          )}\n        </FocusZone>\n      )}\n    </>\n  );\n};\n"]}

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

@@ -12,7 +12,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import React, { useCallback } from 'react';
 import { useMemo, useState, useEffect } from 'react';
 import { Modal, Stack, useTheme, Text, IconButton, Dropdown, DefaultButton, PrimaryButton } from '@fluentui/react';
-import { buttonsContainerClassName, buttonStyles, dropdownContainerClassName, dropdownInfoTextStyle, dropdownStyles, themedCaptionsSettingsModalStyle, titleClassName, titleContainerClassName } from './styles/CaptionsSettingsModal.styles';
+import { buttonsContainerClassName, buttonStyles, defaultButtonStyles, dropdownContainerClassName, dropdownInfoTextStyle, dropdownStyles, themedCaptionsSettingsModalStyle, titleClassName, titleContainerClassName } from './styles/CaptionsSettingsModal.styles';
 import { defaultSpokenLanguage } from './utils';
 import { _spokenLanguageToCaptionLanguage } from '../types';
 import { _preventDismissOnEvent } from "../../../acs-ui-common/src";
@@ -145,13 +145,13 @@ export const CaptionsSettingsModal = (props) => {
     const CaptionsSettingsModalStyle = useMemo(() => themedCaptionsSettingsModalStyle(theme), [theme]);
     return (React.createElement(React.Fragment, null, React.createElement(Modal, { titleAriaId: strings === null || strings === void 0 ? void 0 : strings.captionsSettingsModalAriaLabel, isOpen: showModal, onDismiss: onDismiss, isBlocking: true, styles: CaptionsSettingsModalStyle },
         React.createElement(Stack, { horizontal: true, horizontalAlign: "space-between", verticalAlign: "center", className: titleContainerClassName },
-            React.createElement(Text, { className: titleClassName }, strings === null || strings === void 0 ? void 0 : strings.captionsSettingsModalTitle),
+            React.createElement(Text, { className: titleClassName, role: "heading", "aria-level": 1 }, strings === null || strings === void 0 ? void 0 : strings.captionsSettingsModalTitle),
             React.createElement(IconButton, { iconProps: { iconName: 'Cancel' }, ariaLabel: strings === null || strings === void 0 ? void 0 : strings.captionsSettingsCloseModalButtonAriaLabel, onClick: onDismiss, style: { color: theme.palette.black } })),
         React.createElement(Stack, { className: dropdownContainerClassName }, CaptionsSettingsComponent()),
         React.createElement(Stack, { horizontal: true, horizontalAlign: "end", className: buttonsContainerClassName },
             React.createElement(PrimaryButton, { styles: buttonStyles(theme), onClick: onConfirm },
                 React.createElement("span", null, strings === null || strings === void 0 ? void 0 : strings.captionsSettingsConfirmButtonLabel)),
-            React.createElement(DefaultButton, { onClick: onDismiss, styles: buttonStyles(theme) },
+            React.createElement(DefaultButton, { onClick: onDismiss, styles: defaultButtonStyles() },
                 React.createElement("span", null, strings === null || strings === void 0 ? void 0 : strings.captionsSettingsCancelButtonLabel))))));
 };
 //# sourceMappingURL=CaptionsSettingsModal.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CaptionsSettingsModal.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/CaptionsSettingsModal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback } from 'react';\nimport { useMemo, useState, useEffect } from 'react';\nimport {\n  IModalStyles,\n  Modal,\n  Stack,\n  useTheme,\n  Text,\n  IconButton,\n  Dropdown,\n  IDropdownOption,\n  DefaultButton,\n  PrimaryButton\n} from '@fluentui/react';\n\nimport {\n  buttonsContainerClassName,\n  buttonStyles,\n  dropdownContainerClassName,\n  dropdownInfoTextStyle,\n  dropdownStyles,\n  themedCaptionsSettingsModalStyle,\n  titleClassName,\n  titleContainerClassName\n} from './styles/CaptionsSettingsModal.styles';\nimport { CaptionsOptions } from './StartCaptionsButton';\nimport { defaultSpokenLanguage } from './utils';\nimport {\n  SpokenLanguageStrings,\n  CaptionLanguageStrings,\n  _spokenLanguageToCaptionLanguage,\n  SupportedSpokenLanguage,\n  SupportedCaptionLanguage,\n  SpokenLanguageDropdownOptions,\n  CaptionLanguageDropdownOptions\n} from '../types';\nimport { _preventDismissOnEvent } from '@internal/acs-ui-common';\nimport { useLocale } from '../localization';\n\n/**\n * @public\n * strings for captions setting modal\n */\nexport interface CaptionsSettingsModalStrings {\n  /**\n   * Title for the modal\n   */\n  captionsSettingsModalTitle?: string;\n  /**\n   * Label for the spoken language dropdown menu\n   */\n  captionsSettingsSpokenLanguageDropdownLabel?: string;\n  /**\n   * Label for the caption language dropdown menu\n   */\n  captionsSettingsCaptionLanguageDropdownLabel?: string;\n  /**\n   * Disclaimer for the spoken language dropdown menu\n   */\n  captionsSettingsSpokenLanguageDropdownInfoText?: string;\n  /**\n   * Disclaimer for the caption language dropdown menu\n   */\n  captionsSettingsCaptionLanguageDropdownInfoText?: string;\n  /**\n   * Label for the confirm button\n   */\n  captionsSettingsConfirmButtonLabel?: string;\n  /**\n   * Label for the cancel button\n   */\n  captionsSettingsCancelButtonLabel?: string;\n  /**\n   * Aria label for the modal\n   */\n  captionsSettingsModalAriaLabel?: string;\n  /**\n   * Aria label for the close modal button\n   */\n  captionsSettingsCloseModalButtonAriaLabel?: string;\n}\n\n/**\n * @public\n * CaptionsSettingsModal Component Props.\n */\nexport interface CaptionsSettingsModalProps {\n  /**\n   * List of supported spoken languages\n   */\n  supportedSpokenLanguages: SupportedSpokenLanguage[];\n  /**\n   * List of supported caption languages\n   */\n  supportedCaptionLanguages?: SupportedCaptionLanguage[];\n  /**\n   * Callback to set spoken language\n   */\n  onSetSpokenLanguage: (language: SupportedSpokenLanguage) => Promise<void>;\n  /**\n   * Callback to set caption language\n   */\n  onSetCaptionLanguage?: (language: SupportedCaptionLanguage) => Promise<void>;\n  /**\n   * Callback to start captions\n   */\n  onStartCaptions: (options?: CaptionsOptions) => Promise<void>;\n  /**\n   * Current spoken language\n   */\n  currentSpokenLanguage: SupportedSpokenLanguage;\n  /**\n   * Current caption language\n   */\n  currentCaptionLanguage?: SupportedCaptionLanguage;\n  /**\n   * 1 to 1 mapping between language code and language string for spoken languages\n   */\n  spokenLanguageStrings?: SpokenLanguageStrings;\n  /**\n   * 1 to 1 mapping between language code and language string for caption languages\n   */\n  captionLanguageStrings?: CaptionLanguageStrings;\n  /**\n   * Flag to indicate if captions feature is active\n   */\n  isCaptionsFeatureActive?: boolean;\n  /**\n   * Strings for the captions settings modal\n   */\n  strings?: CaptionsSettingsModalStrings;\n  /**\n   * Flag to show the modal\n   */\n  showModal?: boolean;\n  /**\n   * Callback that is triggered when the modal is dismissed\n   */\n  onDismissCaptionsSettings?: () => void;\n  /**\n   * Flag to show the caption language dropdown\n   */\n  changeCaptionLanguage?: boolean;\n}\n\n/**\n * @public\n * a component for setting spoken languages\n */\nexport const CaptionsSettingsModal = (props: CaptionsSettingsModalProps): JSX.Element => {\n  const {\n    supportedSpokenLanguages,\n    supportedCaptionLanguages,\n    currentSpokenLanguage,\n    currentCaptionLanguage,\n    isCaptionsFeatureActive,\n    showModal,\n    onSetSpokenLanguage,\n    onSetCaptionLanguage,\n    onDismissCaptionsSettings,\n    onStartCaptions,\n    changeCaptionLanguage = false\n  } = props;\n  const theme = useTheme();\n  const localeStrings = useLocale().strings.captionsSettingsModal;\n  const localSpokenLanguageStrings = useLocale().strings.spokenLanguages;\n  const localCaptionLanguageStrings = useLocale().strings.captionLanguages;\n  const strings = { ...localeStrings, ...props.strings };\n  const spokenLanguageStrings = useMemo(() => {\n    return { ...localSpokenLanguageStrings, ...props.spokenLanguageStrings };\n  }, [localSpokenLanguageStrings, props.spokenLanguageStrings]);\n  const captionLanguageStrings = useMemo(() => {\n    return { ...localCaptionLanguageStrings, ...props.captionLanguageStrings };\n  }, [localCaptionLanguageStrings, props.captionLanguageStrings]);\n  const [hasSetSpokenLanguage, setHasSetSpokenLanguage] = useState(false);\n\n  const [selectedSpokenLanguage, setSelectedSpokenLanguage] = useState<SpokenLanguageDropdownOptions>({\n    key: currentSpokenLanguage || defaultSpokenLanguage,\n    text: currentSpokenLanguage || defaultSpokenLanguage\n  });\n\n  const [selectedCaptionLanguage, setSelectedCaptionLanguage] = useState<CaptionLanguageDropdownOptions>({\n    key:\n      currentCaptionLanguage ||\n      (_spokenLanguageToCaptionLanguage[selectedSpokenLanguage.key] as keyof CaptionLanguageStrings),\n    text: currentCaptionLanguage || _spokenLanguageToCaptionLanguage[selectedSpokenLanguage.key]\n  });\n\n  useEffect(() => {\n    // set spoken language when start captions with a spoken language specified.\n    // this is to fix the bug when a second user starts captions with a new spoken language, captions bot ignore that spoken language\n    if (isCaptionsFeatureActive && !hasSetSpokenLanguage) {\n      onSetSpokenLanguage(selectedSpokenLanguage.key);\n      // we only need to call set spoken language once when first starting captions\n      setHasSetSpokenLanguage(true);\n    }\n  }, [isCaptionsFeatureActive, onSetSpokenLanguage, selectedSpokenLanguage.key, hasSetSpokenLanguage]);\n\n  const onDismiss = useCallback((): void => {\n    if (onDismissCaptionsSettings) {\n      onDismissCaptionsSettings();\n    }\n  }, [onDismissCaptionsSettings]);\n\n  const onConfirm = useCallback(async (): Promise<void> => {\n    const spokenLanguageCode = selectedSpokenLanguage.key;\n    const captionLanguageCode = selectedCaptionLanguage.key;\n    if (isCaptionsFeatureActive) {\n      onSetSpokenLanguage(spokenLanguageCode);\n      if (changeCaptionLanguage) {\n        onSetCaptionLanguage && onSetCaptionLanguage(captionLanguageCode);\n      }\n    } else {\n      await onStartCaptions({ spokenLanguage: spokenLanguageCode });\n    }\n    onDismiss();\n  }, [\n    onDismiss,\n    isCaptionsFeatureActive,\n    onSetSpokenLanguage,\n    onSetCaptionLanguage,\n    onStartCaptions,\n    selectedSpokenLanguage.key,\n    selectedCaptionLanguage.key,\n    changeCaptionLanguage\n  ]);\n\n  const spokenLanguageDropdownOptions: IDropdownOption[] = useMemo(() => {\n    return supportedSpokenLanguages.map((languageCode) => {\n      return {\n        key: languageCode,\n        text: spokenLanguageStrings ? spokenLanguageStrings[languageCode] : languageCode\n      };\n    });\n  }, [supportedSpokenLanguages, spokenLanguageStrings]);\n\n  const captionLanguageDropdownOptions: IDropdownOption[] | undefined = useMemo(() => {\n    return supportedCaptionLanguages?.map((languageCode) => {\n      return {\n        key: languageCode,\n        text: captionLanguageStrings ? captionLanguageStrings[languageCode] : languageCode\n      };\n    });\n  }, [supportedCaptionLanguages, captionLanguageStrings]);\n\n  const sortedSpokenLanguageDropdownOptions: IDropdownOption[] = useMemo(() => {\n    const copy = [...spokenLanguageDropdownOptions];\n    return copy.sort((a, b) => (a.text > b.text ? 1 : -1));\n  }, [spokenLanguageDropdownOptions]);\n\n  const sortedCaptionLanguageDropdownOptions: IDropdownOption[] = useMemo(() => {\n    const copy = [...(captionLanguageDropdownOptions ?? [])];\n    return copy.sort((a, b) => (a.text > b.text ? 1 : -1));\n  }, [captionLanguageDropdownOptions]);\n\n  const onSpokenLanguageChange = (\n    event: React.FormEvent<HTMLDivElement>,\n    option: SpokenLanguageDropdownOptions | undefined\n  ): void => {\n    if (option) {\n      setSelectedSpokenLanguage(option);\n    }\n  };\n\n  const onCaptionLanguageChange = (\n    event: React.FormEvent<HTMLDivElement>,\n    option: CaptionLanguageDropdownOptions | undefined\n  ): void => {\n    if (option) {\n      setSelectedCaptionLanguage(option);\n    }\n  };\n\n  const calloutProps = useMemo(\n    () => ({\n      preventDismissOnEvent: _preventDismissOnEvent\n    }),\n    []\n  );\n\n  const CaptionsSettingsComponent = useCallback((): JSX.Element => {\n    const placeholderSpokenLanguage = currentSpokenLanguage ?? defaultSpokenLanguage;\n    const placeholderCaptionLanguage =\n      currentCaptionLanguage ?? _spokenLanguageToCaptionLanguage[placeholderSpokenLanguage];\n    return (\n      <Stack>\n        <Dropdown\n          label={strings?.captionsSettingsSpokenLanguageDropdownLabel}\n          selectedKey={selectedSpokenLanguage ? selectedSpokenLanguage.key : undefined}\n          onChange={(ev, option) => onSpokenLanguageChange(ev, option as SpokenLanguageDropdownOptions)}\n          calloutProps={calloutProps}\n          placeholder={placeholderSpokenLanguage}\n          options={sortedSpokenLanguageDropdownOptions}\n          styles={dropdownStyles}\n        />\n        <Text className={dropdownInfoTextStyle(theme)}>{strings?.captionsSettingsSpokenLanguageDropdownInfoText}</Text>\n        {changeCaptionLanguage && (\n          <>\n            <Dropdown\n              label={strings?.captionsSettingsCaptionLanguageDropdownLabel}\n              selectedKey={selectedCaptionLanguage ? selectedCaptionLanguage.key : undefined}\n              onChange={(ev, option) => onCaptionLanguageChange(ev, option as CaptionLanguageDropdownOptions)}\n              calloutProps={calloutProps}\n              placeholder={placeholderCaptionLanguage}\n              options={sortedCaptionLanguageDropdownOptions}\n              styles={dropdownStyles}\n            />\n            <Text className={dropdownInfoTextStyle(theme)}>\n              {strings?.captionsSettingsCaptionLanguageDropdownInfoText}\n            </Text>\n          </>\n        )}\n      </Stack>\n    );\n  }, [\n    calloutProps,\n    currentSpokenLanguage,\n    currentCaptionLanguage,\n    sortedSpokenLanguageDropdownOptions,\n    sortedCaptionLanguageDropdownOptions,\n    selectedCaptionLanguage,\n    selectedSpokenLanguage,\n    strings?.captionsSettingsSpokenLanguageDropdownInfoText,\n    strings?.captionsSettingsCaptionLanguageDropdownLabel,\n    strings?.captionsSettingsSpokenLanguageDropdownLabel,\n    strings?.captionsSettingsCaptionLanguageDropdownInfoText,\n    theme,\n    changeCaptionLanguage\n  ]);\n\n  const CaptionsSettingsModalStyle: Partial<IModalStyles> = useMemo(\n    () => themedCaptionsSettingsModalStyle(theme),\n    [theme]\n  );\n\n  return (\n    <>\n      {\n        <Modal\n          titleAriaId={strings?.captionsSettingsModalAriaLabel}\n          isOpen={showModal}\n          onDismiss={onDismiss}\n          isBlocking={true}\n          styles={CaptionsSettingsModalStyle}\n        >\n          <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\" className={titleContainerClassName}>\n            <Text className={titleClassName}>{strings?.captionsSettingsModalTitle}</Text>\n            <IconButton\n              iconProps={{ iconName: 'Cancel' }}\n              ariaLabel={strings?.captionsSettingsCloseModalButtonAriaLabel}\n              onClick={onDismiss}\n              style={{ color: theme.palette.black }}\n            />\n          </Stack>\n\n          <Stack className={dropdownContainerClassName}>{CaptionsSettingsComponent()}</Stack>\n          <Stack horizontal horizontalAlign=\"end\" className={buttonsContainerClassName}>\n            <PrimaryButton styles={buttonStyles(theme)} onClick={onConfirm}>\n              <span>{strings?.captionsSettingsConfirmButtonLabel}</span>\n            </PrimaryButton>\n            <DefaultButton onClick={onDismiss} styles={buttonStyles(theme)}>\n              <span>{strings?.captionsSettingsCancelButtonLabel}</span>\n            </DefaultButton>\n          </Stack>\n        </Modal>\n      }\n    </>\n  );\n};\n"]}
+{"version":3,"file":"CaptionsSettingsModal.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/CaptionsSettingsModal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback } from 'react';\nimport { useMemo, useState, useEffect } from 'react';\nimport {\n  IModalStyles,\n  Modal,\n  Stack,\n  useTheme,\n  Text,\n  IconButton,\n  Dropdown,\n  IDropdownOption,\n  DefaultButton,\n  PrimaryButton\n} from '@fluentui/react';\n\nimport {\n  buttonsContainerClassName,\n  buttonStyles,\n  defaultButtonStyles,\n  dropdownContainerClassName,\n  dropdownInfoTextStyle,\n  dropdownStyles,\n  themedCaptionsSettingsModalStyle,\n  titleClassName,\n  titleContainerClassName\n} from './styles/CaptionsSettingsModal.styles';\nimport { CaptionsOptions } from './StartCaptionsButton';\nimport { defaultSpokenLanguage } from './utils';\nimport {\n  SpokenLanguageStrings,\n  CaptionLanguageStrings,\n  _spokenLanguageToCaptionLanguage,\n  SupportedSpokenLanguage,\n  SupportedCaptionLanguage,\n  SpokenLanguageDropdownOptions,\n  CaptionLanguageDropdownOptions\n} from '../types';\nimport { _preventDismissOnEvent } from '@internal/acs-ui-common';\nimport { useLocale } from '../localization';\n\n/**\n * @public\n * strings for captions setting modal\n */\nexport interface CaptionsSettingsModalStrings {\n  /**\n   * Title for the modal\n   */\n  captionsSettingsModalTitle?: string;\n  /**\n   * Label for the spoken language dropdown menu\n   */\n  captionsSettingsSpokenLanguageDropdownLabel?: string;\n  /**\n   * Label for the caption language dropdown menu\n   */\n  captionsSettingsCaptionLanguageDropdownLabel?: string;\n  /**\n   * Disclaimer for the spoken language dropdown menu\n   */\n  captionsSettingsSpokenLanguageDropdownInfoText?: string;\n  /**\n   * Disclaimer for the caption language dropdown menu\n   */\n  captionsSettingsCaptionLanguageDropdownInfoText?: string;\n  /**\n   * Label for the confirm button\n   */\n  captionsSettingsConfirmButtonLabel?: string;\n  /**\n   * Label for the cancel button\n   */\n  captionsSettingsCancelButtonLabel?: string;\n  /**\n   * Aria label for the modal\n   */\n  captionsSettingsModalAriaLabel?: string;\n  /**\n   * Aria label for the close modal button\n   */\n  captionsSettingsCloseModalButtonAriaLabel?: string;\n}\n\n/**\n * @public\n * CaptionsSettingsModal Component Props.\n */\nexport interface CaptionsSettingsModalProps {\n  /**\n   * List of supported spoken languages\n   */\n  supportedSpokenLanguages: SupportedSpokenLanguage[];\n  /**\n   * List of supported caption languages\n   */\n  supportedCaptionLanguages?: SupportedCaptionLanguage[];\n  /**\n   * Callback to set spoken language\n   */\n  onSetSpokenLanguage: (language: SupportedSpokenLanguage) => Promise<void>;\n  /**\n   * Callback to set caption language\n   */\n  onSetCaptionLanguage?: (language: SupportedCaptionLanguage) => Promise<void>;\n  /**\n   * Callback to start captions\n   */\n  onStartCaptions: (options?: CaptionsOptions) => Promise<void>;\n  /**\n   * Current spoken language\n   */\n  currentSpokenLanguage: SupportedSpokenLanguage;\n  /**\n   * Current caption language\n   */\n  currentCaptionLanguage?: SupportedCaptionLanguage;\n  /**\n   * 1 to 1 mapping between language code and language string for spoken languages\n   */\n  spokenLanguageStrings?: SpokenLanguageStrings;\n  /**\n   * 1 to 1 mapping between language code and language string for caption languages\n   */\n  captionLanguageStrings?: CaptionLanguageStrings;\n  /**\n   * Flag to indicate if captions feature is active\n   */\n  isCaptionsFeatureActive?: boolean;\n  /**\n   * Strings for the captions settings modal\n   */\n  strings?: CaptionsSettingsModalStrings;\n  /**\n   * Flag to show the modal\n   */\n  showModal?: boolean;\n  /**\n   * Callback that is triggered when the modal is dismissed\n   */\n  onDismissCaptionsSettings?: () => void;\n  /**\n   * Flag to show the caption language dropdown\n   */\n  changeCaptionLanguage?: boolean;\n}\n\n/**\n * @public\n * a component for setting spoken languages\n */\nexport const CaptionsSettingsModal = (props: CaptionsSettingsModalProps): JSX.Element => {\n  const {\n    supportedSpokenLanguages,\n    supportedCaptionLanguages,\n    currentSpokenLanguage,\n    currentCaptionLanguage,\n    isCaptionsFeatureActive,\n    showModal,\n    onSetSpokenLanguage,\n    onSetCaptionLanguage,\n    onDismissCaptionsSettings,\n    onStartCaptions,\n    changeCaptionLanguage = false\n  } = props;\n  const theme = useTheme();\n  const localeStrings = useLocale().strings.captionsSettingsModal;\n  const localSpokenLanguageStrings = useLocale().strings.spokenLanguages;\n  const localCaptionLanguageStrings = useLocale().strings.captionLanguages;\n  const strings = { ...localeStrings, ...props.strings };\n  const spokenLanguageStrings = useMemo(() => {\n    return { ...localSpokenLanguageStrings, ...props.spokenLanguageStrings };\n  }, [localSpokenLanguageStrings, props.spokenLanguageStrings]);\n  const captionLanguageStrings = useMemo(() => {\n    return { ...localCaptionLanguageStrings, ...props.captionLanguageStrings };\n  }, [localCaptionLanguageStrings, props.captionLanguageStrings]);\n  const [hasSetSpokenLanguage, setHasSetSpokenLanguage] = useState(false);\n\n  const [selectedSpokenLanguage, setSelectedSpokenLanguage] = useState<SpokenLanguageDropdownOptions>({\n    key: currentSpokenLanguage || defaultSpokenLanguage,\n    text: currentSpokenLanguage || defaultSpokenLanguage\n  });\n\n  const [selectedCaptionLanguage, setSelectedCaptionLanguage] = useState<CaptionLanguageDropdownOptions>({\n    key:\n      currentCaptionLanguage ||\n      (_spokenLanguageToCaptionLanguage[selectedSpokenLanguage.key] as keyof CaptionLanguageStrings),\n    text: currentCaptionLanguage || _spokenLanguageToCaptionLanguage[selectedSpokenLanguage.key]\n  });\n\n  useEffect(() => {\n    // set spoken language when start captions with a spoken language specified.\n    // this is to fix the bug when a second user starts captions with a new spoken language, captions bot ignore that spoken language\n    if (isCaptionsFeatureActive && !hasSetSpokenLanguage) {\n      onSetSpokenLanguage(selectedSpokenLanguage.key);\n      // we only need to call set spoken language once when first starting captions\n      setHasSetSpokenLanguage(true);\n    }\n  }, [isCaptionsFeatureActive, onSetSpokenLanguage, selectedSpokenLanguage.key, hasSetSpokenLanguage]);\n\n  const onDismiss = useCallback((): void => {\n    if (onDismissCaptionsSettings) {\n      onDismissCaptionsSettings();\n    }\n  }, [onDismissCaptionsSettings]);\n\n  const onConfirm = useCallback(async (): Promise<void> => {\n    const spokenLanguageCode = selectedSpokenLanguage.key;\n    const captionLanguageCode = selectedCaptionLanguage.key;\n    if (isCaptionsFeatureActive) {\n      onSetSpokenLanguage(spokenLanguageCode);\n      if (changeCaptionLanguage) {\n        onSetCaptionLanguage && onSetCaptionLanguage(captionLanguageCode);\n      }\n    } else {\n      await onStartCaptions({ spokenLanguage: spokenLanguageCode });\n    }\n    onDismiss();\n  }, [\n    onDismiss,\n    isCaptionsFeatureActive,\n    onSetSpokenLanguage,\n    onSetCaptionLanguage,\n    onStartCaptions,\n    selectedSpokenLanguage.key,\n    selectedCaptionLanguage.key,\n    changeCaptionLanguage\n  ]);\n\n  const spokenLanguageDropdownOptions: IDropdownOption[] = useMemo(() => {\n    return supportedSpokenLanguages.map((languageCode) => {\n      return {\n        key: languageCode,\n        text: spokenLanguageStrings ? spokenLanguageStrings[languageCode] : languageCode\n      };\n    });\n  }, [supportedSpokenLanguages, spokenLanguageStrings]);\n\n  const captionLanguageDropdownOptions: IDropdownOption[] | undefined = useMemo(() => {\n    return supportedCaptionLanguages?.map((languageCode) => {\n      return {\n        key: languageCode,\n        text: captionLanguageStrings ? captionLanguageStrings[languageCode] : languageCode\n      };\n    });\n  }, [supportedCaptionLanguages, captionLanguageStrings]);\n\n  const sortedSpokenLanguageDropdownOptions: IDropdownOption[] = useMemo(() => {\n    const copy = [...spokenLanguageDropdownOptions];\n    return copy.sort((a, b) => (a.text > b.text ? 1 : -1));\n  }, [spokenLanguageDropdownOptions]);\n\n  const sortedCaptionLanguageDropdownOptions: IDropdownOption[] = useMemo(() => {\n    const copy = [...(captionLanguageDropdownOptions ?? [])];\n    return copy.sort((a, b) => (a.text > b.text ? 1 : -1));\n  }, [captionLanguageDropdownOptions]);\n\n  const onSpokenLanguageChange = (\n    event: React.FormEvent<HTMLDivElement>,\n    option: SpokenLanguageDropdownOptions | undefined\n  ): void => {\n    if (option) {\n      setSelectedSpokenLanguage(option);\n    }\n  };\n\n  const onCaptionLanguageChange = (\n    event: React.FormEvent<HTMLDivElement>,\n    option: CaptionLanguageDropdownOptions | undefined\n  ): void => {\n    if (option) {\n      setSelectedCaptionLanguage(option);\n    }\n  };\n\n  const calloutProps = useMemo(\n    () => ({\n      preventDismissOnEvent: _preventDismissOnEvent\n    }),\n    []\n  );\n\n  const CaptionsSettingsComponent = useCallback((): JSX.Element => {\n    const placeholderSpokenLanguage = currentSpokenLanguage ?? defaultSpokenLanguage;\n    const placeholderCaptionLanguage =\n      currentCaptionLanguage ?? _spokenLanguageToCaptionLanguage[placeholderSpokenLanguage];\n    return (\n      <Stack>\n        <Dropdown\n          label={strings?.captionsSettingsSpokenLanguageDropdownLabel}\n          selectedKey={selectedSpokenLanguage ? selectedSpokenLanguage.key : undefined}\n          onChange={(ev, option) => onSpokenLanguageChange(ev, option as SpokenLanguageDropdownOptions)}\n          calloutProps={calloutProps}\n          placeholder={placeholderSpokenLanguage}\n          options={sortedSpokenLanguageDropdownOptions}\n          styles={dropdownStyles}\n        />\n        <Text className={dropdownInfoTextStyle(theme)}>{strings?.captionsSettingsSpokenLanguageDropdownInfoText}</Text>\n        {changeCaptionLanguage && (\n          <>\n            <Dropdown\n              label={strings?.captionsSettingsCaptionLanguageDropdownLabel}\n              selectedKey={selectedCaptionLanguage ? selectedCaptionLanguage.key : undefined}\n              onChange={(ev, option) => onCaptionLanguageChange(ev, option as CaptionLanguageDropdownOptions)}\n              calloutProps={calloutProps}\n              placeholder={placeholderCaptionLanguage}\n              options={sortedCaptionLanguageDropdownOptions}\n              styles={dropdownStyles}\n            />\n            <Text className={dropdownInfoTextStyle(theme)}>\n              {strings?.captionsSettingsCaptionLanguageDropdownInfoText}\n            </Text>\n          </>\n        )}\n      </Stack>\n    );\n  }, [\n    calloutProps,\n    currentSpokenLanguage,\n    currentCaptionLanguage,\n    sortedSpokenLanguageDropdownOptions,\n    sortedCaptionLanguageDropdownOptions,\n    selectedCaptionLanguage,\n    selectedSpokenLanguage,\n    strings?.captionsSettingsSpokenLanguageDropdownInfoText,\n    strings?.captionsSettingsCaptionLanguageDropdownLabel,\n    strings?.captionsSettingsSpokenLanguageDropdownLabel,\n    strings?.captionsSettingsCaptionLanguageDropdownInfoText,\n    theme,\n    changeCaptionLanguage\n  ]);\n\n  const CaptionsSettingsModalStyle: Partial<IModalStyles> = useMemo(\n    () => themedCaptionsSettingsModalStyle(theme),\n    [theme]\n  );\n\n  return (\n    <>\n      {\n        <Modal\n          titleAriaId={strings?.captionsSettingsModalAriaLabel}\n          isOpen={showModal}\n          onDismiss={onDismiss}\n          isBlocking={true}\n          styles={CaptionsSettingsModalStyle}\n        >\n          <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\" className={titleContainerClassName}>\n            <Text className={titleClassName} role=\"heading\" aria-level={1}>\n              {strings?.captionsSettingsModalTitle}\n            </Text>\n            <IconButton\n              iconProps={{ iconName: 'Cancel' }}\n              ariaLabel={strings?.captionsSettingsCloseModalButtonAriaLabel}\n              onClick={onDismiss}\n              style={{ color: theme.palette.black }}\n            />\n          </Stack>\n\n          <Stack className={dropdownContainerClassName}>{CaptionsSettingsComponent()}</Stack>\n          <Stack horizontal horizontalAlign=\"end\" className={buttonsContainerClassName}>\n            <PrimaryButton styles={buttonStyles(theme)} onClick={onConfirm}>\n              <span>{strings?.captionsSettingsConfirmButtonLabel}</span>\n            </PrimaryButton>\n            <DefaultButton onClick={onDismiss} styles={defaultButtonStyles()}>\n              <span>{strings?.captionsSettingsCancelButtonLabel}</span>\n            </DefaultButton>\n          </Stack>\n        </Modal>\n      }\n    </>\n  );\n};\n"]}

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

@@ -16,7 +16,7 @@ import { useMemo } from 'react';
 /* @conditional-compile-remove(rtt) */
 import { Modal, Stack, useTheme, Text, IconButton, DefaultButton, PrimaryButton } from '@fluentui/react';
 /* @conditional-compile-remove(rtt) */
-import { buttonsContainerClassName, buttonStyles, themedCaptionsSettingsModalStyle, titleClassName, titleContainerClassName } from './styles/CaptionsSettingsModal.styles';
+import { buttonsContainerClassName, buttonStyles, defaultButtonStyles, themedCaptionsSettingsModalStyle, titleClassName, titleContainerClassName } from './styles/CaptionsSettingsModal.styles';
 /* @conditional-compile-remove(rtt) */
 import { useLocale } from '../localization';
 /* @conditional-compile-remove(rtt) */
@@ -43,13 +43,13 @@ export const RealTimeTextModal = (props) => {
     const RealTimeTextModalStyle = useMemo(() => themedCaptionsSettingsModalStyle(theme), [theme]);
     return (React.createElement(React.Fragment, null, React.createElement(Modal, { titleAriaId: strings === null || strings === void 0 ? void 0 : strings.realTimeTextModalAriaLabel, isOpen: showModal, onDismiss: onDismiss, isBlocking: true, styles: RealTimeTextModalStyle },
         React.createElement(Stack, { horizontal: true, horizontalAlign: "space-between", verticalAlign: "center", className: titleContainerClassName },
-            React.createElement(Text, { className: titleClassName }, strings === null || strings === void 0 ? void 0 : strings.realTimeTextModalTitle),
+            React.createElement(Text, { role: "heading", className: titleClassName, "aria-level": 1 }, strings === null || strings === void 0 ? void 0 : strings.realTimeTextModalTitle),
             React.createElement(IconButton, { iconProps: { iconName: 'Cancel' }, ariaLabel: strings === null || strings === void 0 ? void 0 : strings.realTimeTextCloseModalButtonAriaLabel, onClick: onDismiss, style: { color: theme.palette.black } })),
         React.createElement(Text, null, strings === null || strings === void 0 ? void 0 : strings.realTimeTextModalText),
         React.createElement(Stack, { horizontal: true, horizontalAlign: "end", className: buttonsContainerClassName },
             React.createElement(PrimaryButton, { styles: buttonStyles(theme), onClick: onConfirm, "data-ui-id": "realTimeText-modal-confirm-button" },
                 React.createElement("span", null, strings === null || strings === void 0 ? void 0 : strings.realTimeTextConfirmButtonLabel)),
-            React.createElement(DefaultButton, { onClick: onDismiss, styles: buttonStyles(theme) },
+            React.createElement(DefaultButton, { onClick: onDismiss, styles: defaultButtonStyles() },
                 React.createElement("span", null, strings === null || strings === void 0 ? void 0 : strings.realTimeTextCancelButtonLabel))))));
 };
 //# sourceMappingURL=RealTimeTextModal.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"RealTimeTextModal.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/RealTimeTextModal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n/* @conditional-compile-remove(rtt) */\nimport React, { useCallback } from 'react';\n/* @conditional-compile-remove(rtt) */\nimport { useMemo } from 'react';\n/* @conditional-compile-remove(rtt) */\nimport { IModalStyles, Modal, Stack, useTheme, Text, IconButton, DefaultButton, PrimaryButton } from '@fluentui/react';\n/* @conditional-compile-remove(rtt) */\nimport { _preventDismissOnEvent } from '@internal/acs-ui-common';\n/* @conditional-compile-remove(rtt) */\nimport {\n  buttonsContainerClassName,\n  buttonStyles,\n  themedCaptionsSettingsModalStyle,\n  titleClassName,\n  titleContainerClassName\n} from './styles/CaptionsSettingsModal.styles';\n/* @conditional-compile-remove(rtt) */\nimport { useLocale } from '../localization';\n\n/* @conditional-compile-remove(rtt) */\n/**\n * @public\n * strings for realTimeText modal\n */\nexport interface RealTimeTextModalStrings {\n  /** The title of the RealTimeText modal */\n  realTimeTextModalTitle?: string;\n  /** The text of the RealTimeText modal */\n  realTimeTextModalText?: string;\n  /** The label for the confirm button */\n  realTimeTextConfirmButtonLabel?: string;\n  /** The label for the cancel button */\n  realTimeTextCancelButtonLabel?: string;\n  /** The aria label for the modal */\n  realTimeTextModalAriaLabel?: string;\n  /** The aria label for the close button */\n  realTimeTextCloseModalButtonAriaLabel?: string;\n}\n/* @conditional-compile-remove(rtt) */\n/**\n * @public\n * RealTimeTextModal Component Props.\n */\nexport interface RealTimeTextModalProps {\n  /** The strings for the RealTimeText modal */\n  strings?: RealTimeTextModalStrings;\n  /** The flag to show the modal */\n  showModal?: boolean;\n  /** The function to dismiss the modal */\n  onDismissModal?: () => void;\n  /**\n   * Use this function to show RealTimeText UI in the calling experience.\n   * Note that real time text should not be started for everyone in the call until the first real time text is received.\n   */\n  onStartRealTimeText?: () => void;\n}\n/* @conditional-compile-remove(rtt) */\n/**\n * @public\n * a component for realTimeText modal\n */\nexport const RealTimeTextModal = (props: RealTimeTextModalProps): JSX.Element => {\n  const { showModal, onDismissModal, onStartRealTimeText } = props;\n  const localeStrings = useLocale().strings.realTimeTextModal;\n  const strings = { ...localeStrings, ...props.strings };\n\n  const theme = useTheme();\n\n  const onDismiss = useCallback((): void => {\n    if (onDismissModal) {\n      onDismissModal();\n    }\n  }, [onDismissModal]);\n\n  const onConfirm = useCallback(async (): Promise<void> => {\n    if (onStartRealTimeText) {\n      await onStartRealTimeText();\n    }\n    onDismiss();\n  }, [onDismiss, onStartRealTimeText]);\n\n  const RealTimeTextModalStyle: Partial<IModalStyles> = useMemo(() => themedCaptionsSettingsModalStyle(theme), [theme]);\n\n  return (\n    <>\n      {\n        <Modal\n          titleAriaId={strings?.realTimeTextModalAriaLabel}\n          isOpen={showModal}\n          onDismiss={onDismiss}\n          isBlocking={true}\n          styles={RealTimeTextModalStyle}\n        >\n          <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\" className={titleContainerClassName}>\n            <Text className={titleClassName}>{strings?.realTimeTextModalTitle}</Text>\n            <IconButton\n              iconProps={{ iconName: 'Cancel' }}\n              ariaLabel={strings?.realTimeTextCloseModalButtonAriaLabel}\n              onClick={onDismiss}\n              style={{ color: theme.palette.black }}\n            />\n          </Stack>\n          <Text>{strings?.realTimeTextModalText}</Text>\n\n          <Stack horizontal horizontalAlign=\"end\" className={buttonsContainerClassName}>\n            <PrimaryButton\n              styles={buttonStyles(theme)}\n              onClick={onConfirm}\n              data-ui-id=\"realTimeText-modal-confirm-button\"\n            >\n              <span>{strings?.realTimeTextConfirmButtonLabel}</span>\n            </PrimaryButton>\n            <DefaultButton onClick={onDismiss} styles={buttonStyles(theme)}>\n              <span>{strings?.realTimeTextCancelButtonLabel}</span>\n            </DefaultButton>\n          </Stack>\n        </Modal>\n      }\n    </>\n  );\n};\n"]}
+{"version":3,"file":"RealTimeTextModal.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/RealTimeTextModal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n/* @conditional-compile-remove(rtt) */\nimport React, { useCallback } from 'react';\n/* @conditional-compile-remove(rtt) */\nimport { useMemo } from 'react';\n/* @conditional-compile-remove(rtt) */\nimport { IModalStyles, Modal, Stack, useTheme, Text, IconButton, DefaultButton, PrimaryButton } from '@fluentui/react';\n/* @conditional-compile-remove(rtt) */\nimport { _preventDismissOnEvent } from '@internal/acs-ui-common';\n/* @conditional-compile-remove(rtt) */\nimport {\n  buttonsContainerClassName,\n  buttonStyles,\n  defaultButtonStyles,\n  themedCaptionsSettingsModalStyle,\n  titleClassName,\n  titleContainerClassName\n} from './styles/CaptionsSettingsModal.styles';\n/* @conditional-compile-remove(rtt) */\nimport { useLocale } from '../localization';\n\n/* @conditional-compile-remove(rtt) */\n/**\n * @public\n * strings for realTimeText modal\n */\nexport interface RealTimeTextModalStrings {\n  /** The title of the RealTimeText modal */\n  realTimeTextModalTitle?: string;\n  /** The text of the RealTimeText modal */\n  realTimeTextModalText?: string;\n  /** The label for the confirm button */\n  realTimeTextConfirmButtonLabel?: string;\n  /** The label for the cancel button */\n  realTimeTextCancelButtonLabel?: string;\n  /** The aria label for the modal */\n  realTimeTextModalAriaLabel?: string;\n  /** The aria label for the close button */\n  realTimeTextCloseModalButtonAriaLabel?: string;\n}\n/* @conditional-compile-remove(rtt) */\n/**\n * @public\n * RealTimeTextModal Component Props.\n */\nexport interface RealTimeTextModalProps {\n  /** The strings for the RealTimeText modal */\n  strings?: RealTimeTextModalStrings;\n  /** The flag to show the modal */\n  showModal?: boolean;\n  /** The function to dismiss the modal */\n  onDismissModal?: () => void;\n  /**\n   * Use this function to show RealTimeText UI in the calling experience.\n   * Note that real time text should not be started for everyone in the call until the first real time text is received.\n   */\n  onStartRealTimeText?: () => void;\n}\n/* @conditional-compile-remove(rtt) */\n/**\n * @public\n * a component for realTimeText modal\n */\nexport const RealTimeTextModal = (props: RealTimeTextModalProps): JSX.Element => {\n  const { showModal, onDismissModal, onStartRealTimeText } = props;\n  const localeStrings = useLocale().strings.realTimeTextModal;\n  const strings = { ...localeStrings, ...props.strings };\n\n  const theme = useTheme();\n\n  const onDismiss = useCallback((): void => {\n    if (onDismissModal) {\n      onDismissModal();\n    }\n  }, [onDismissModal]);\n\n  const onConfirm = useCallback(async (): Promise<void> => {\n    if (onStartRealTimeText) {\n      await onStartRealTimeText();\n    }\n    onDismiss();\n  }, [onDismiss, onStartRealTimeText]);\n\n  const RealTimeTextModalStyle: Partial<IModalStyles> = useMemo(() => themedCaptionsSettingsModalStyle(theme), [theme]);\n\n  return (\n    <>\n      {\n        <Modal\n          titleAriaId={strings?.realTimeTextModalAriaLabel}\n          isOpen={showModal}\n          onDismiss={onDismiss}\n          isBlocking={true}\n          styles={RealTimeTextModalStyle}\n        >\n          <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\" className={titleContainerClassName}>\n            <Text role=\"heading\" className={titleClassName} aria-level={1}>\n              {strings?.realTimeTextModalTitle}\n            </Text>\n            <IconButton\n              iconProps={{ iconName: 'Cancel' }}\n              ariaLabel={strings?.realTimeTextCloseModalButtonAriaLabel}\n              onClick={onDismiss}\n              style={{ color: theme.palette.black }}\n            />\n          </Stack>\n          <Text>{strings?.realTimeTextModalText}</Text>\n\n          <Stack horizontal horizontalAlign=\"end\" className={buttonsContainerClassName}>\n            <PrimaryButton\n              styles={buttonStyles(theme)}\n              onClick={onConfirm}\n              data-ui-id=\"realTimeText-modal-confirm-button\"\n            >\n              <span>{strings?.realTimeTextConfirmButtonLabel}</span>\n            </PrimaryButton>\n            <DefaultButton onClick={onDismiss} styles={defaultButtonStyles()}>\n              <span>{strings?.realTimeTextCancelButtonLabel}</span>\n            </DefaultButton>\n          </Stack>\n        </Modal>\n      }\n    </>\n  );\n};\n"]}

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

@@ -81,7 +81,7 @@ export const TogetherModeOverlay = memo((props) => {
         }
         setTogetherModeParticipantStatus(updatedParticipantStatus);
     }, [hoveredParticipantID, updatedParticipantStatus]);
-    return (React.createElement("div", { style: { position: 'absolute', width: '100%', height: '100%' } }, Object.values(togetherModeParticipantStatus).map((participantStatus) => {
+    return (React.createElement("div", { style: { position: 'absolute', width: '100%', height: '100%', overflow: 'hidden' } }, Object.values(togetherModeParticipantStatus).map((participantStatus) => {
         var _a, _b;
         return participantStatus.id && (React.createElement("div", { key: participantStatus.id, "data-ui-id": `together-mode-participant-${participantStatus.id}`, style: Object.assign({}, getTogetherModeParticipantOverlayStyle(participantStatus.seatPositionStyle)), onMouseEnter: () => setHoveredParticipantID(participantStatus.id), onMouseLeave: () => setHoveredParticipantID('') },
             React.createElement("div", null,

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

@@ -1 +1 @@
-{"version":3,"file":"TogetherModeOverlay.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/TogetherModeOverlay.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,gDAAgD;AAChD,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASlE,gDAAgD;AAChD,OAAO,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5F,gDAAgD;AAChD,OAAO,EAAE,mCAAmC,EAAE,MAAM,oCAAoC,CAAC;AACzF,gDAAgD;AAChD,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACjE,gDAAgD;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,8CAA8C,CAAC;AAChF,gDAAgD;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAG5C,gDAAgD;AAChD,OAAO,EACL,mBAAmB,EACnB,sCAAsC,EACtC,gCAAgC,EAChC,0BAA0B,EAC1B,sBAAsB,EACtB,gCAAgC,EAChC,qBAAqB,EACrB,kCAAkC,EAClC,uCAAuC,EACvC,sCAAsC,EAEvC,MAAM,8BAA8B,CAAC;AACtC,gDAAgD;AAChD,OAAO,EAAgB,QAAQ,EAAE,MAAM,YAAY,CAAC;AACpD,gDAAgD;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAqBzD,gDAAgD;AAChD;;;;GAIG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,IAAI,CACrC,CAAC,KAMA,EAAE,EAAE;IACH,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,cAAc,GAAI,KAAiC,CAAC,cAAc,CAAC;IAEzE,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,yBAAyB,EAAE,GAAG,KAAK,CAAC;IAChH,MAAM,CAAC,6BAA6B,EAAE,gCAAgC,CAAC,GAAG,QAAQ,CAE/E,EAAE,CAAC,CAAC;IACP,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAErE;;;;OAIG;IACH,MAAM,wBAAwB,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5C,MAAM,eAAe,GAAG,CAAC,GAAG,kBAAkB,EAAE,gBAAgB,CAAC,CAAC;QAElE,MAAM,8BAA8B,GAAG,eAAe,CAAC,MAAM,CAC3D,CAAC,CAAC,EAAE,EAAE,WAAC,OAAA,CAAA,MAAA,CAAC,CAAC,WAAW,0CAAE,WAAW,KAAI,yBAAyB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAA,EAAA,CACzE,CAAC;QAEF,MAAM,cAAc,GAAqD,EAAE,CAAC;QAC5E,KAAK,MAAM,CAAC,IAAI,8BAA8B,EAAE,CAAC;YAC/C,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,CAAC,CAAC;YAC5E,MAAM,eAAe,GAAG,yBAAyB,CAAC,MAAM,CAAC,CAAC;YAC1D,IAAI,eAAe,EAAE,CAAC;gBACpB,cAAc,CAAC,MAAM,CAAC,GAAG;oBACvB,EAAE,EAAE,MAAM;oBACV,QAAQ,EAAE,iBAAiB,IAAI,QAAQ;oBACvC,YAAY,EAAE,CAAC,CAAC,UAAU;oBAC1B,aAAa,EAAE,CAAC,CAAC,SAAS;oBAC1B,OAAO;oBACP,WAAW,EAAE,WAAW,IAAI,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,sBAAsB;oBAC9E,eAAe,EAAE,CAAC,CAAC,CAAC,SAAS,IAAI,UAAU,IAAI,oBAAoB,KAAK,MAAM,CAAC;oBAC/E,UAAU,EAAE,mBAAmB,CAAC,eAAe,CAAC,KAAK,EAAE,eAAe,CAAC,MAAM,CAAC;oBAC9E,iBAAiB,EAAE,gCAAgC,CAAC,eAAe,CAAC;iBACrE,CAAC;YACJ,CAAC;QACH,CAAC;QAED,0GAA0G;QAC1G,MAAM,mCAAmC,GAAG,MAAM,CAAC,IAAI,CAAC,6BAA6B,CAAC,CAAC,MAAM,CAC3F,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC,CAC5B,CAAC;QAEF,MAAM,UAAU,mCAAQ,6BAA6B,GAAK,cAAc,CAAE,CAAC;QAE3E,mCAAmC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;YACjD,OAAO,UAAU,CAAC,EAAE,CAAC,CAAC;QACxB,CAAC,CAAC,CAAC;QAEH,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,IAAI,CACrD,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,6BAA6B,CAAC,GAAG,CAAC,CAAC,CAChG,CAAC;QAEF,MAAM,wCAAwC,GAC5C,kBAAkB,IAAI,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,IAAI,CAAC,6BAA6B,CAAC,CAAC,MAAM,CAAC;QAC7G,OAAO,wCAAwC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,6BAA6B,CAAC;IAC/F,CAAC,EAAE;QACD,kBAAkB;QAClB,gBAAgB;QAChB,6BAA6B;QAC7B,yBAAyB;QACzB,iBAAiB;QACjB,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,sBAAsB;QAClD,oBAAoB;KACrB,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,oBAAoB,IAAI,CAAC,wBAAwB,CAAC,oBAAoB,CAAC,EAAE,CAAC;YAC5E,uBAAuB,CAAC,EAAE,CAAC,CAAC;QAC9B,CAAC;QAED,gCAAgC,CAAC,wBAAwB,CAAC,CAAC;IAC7D,CAAC,EAAE,CAAC,oBAAoB,EAAE,wBAAwB,CAAC,CAAC,CAAC;IAErD,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAChE,MAAM,CAAC,MAAM,CAAC,6BAA6B,CAAC,CAAC,GAAG,CAC/C,CAAC,iBAAiB,EAAE,EAAE;;QACpB,OAAA,iBAAiB,CAAC,EAAE,IAAI,CACtB,6BACE,GAAG,EAAE,iBAAiB,CAAC,EAAE,gBACb,6BAA6B,iBAAiB,CAAC,EAAE,EAAE,EAC/D,KAAK,oBACA,sCAAsC,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,GAEhF,YAAY,EAAE,GAAG,EAAE,CAAC,uBAAuB,CAAC,iBAAiB,CAAC,EAAE,CAAC,EACjE,YAAY,EAAE,GAAG,EAAE,CAAC,uBAAuB,CAAC,EAAE,CAAC;YAE/C;gBACG,iBAAiB,CAAC,eAAe,IAAI,CACpC,6BAAK,KAAK,oBAAO,gCAAgC;oBAC/C,6BACE,KAAK,oBACA,sCAAsC,CACvC,cAAc,CAAC,6BAA6B,EAC5C,KAAK,CAAC,OAAO,CAAC,cAAc,CAC7B;wBAGF,iBAAiB,CAAC,YAAY,IAAI,oBAAC,cAAc,OAAG;wBACpD,iBAAiB,CAAC,eAAe,IAAI,CACpC,oBAAC,IAAI,IACH,KAAK,oBACA,kCAAkC,CACnC,oBAAoB,KAAK,iBAAiB,CAAC,EAAE,EAC7C,UAAU,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,YAAY,CAAC,KAAK,CAAC,EAClE,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAC3E,KAGF,iBAAiB,CAAC,WAAW,CACzB,CACR;wBACA,iBAAiB,CAAC,OAAO,IAAI,CAC5B,oBAAC,KAAK,IAAC,SAAS,EAAE,WAAW,CAAC,qBAAqB,CAAC;4BAClD,oBAAC,IAAI,IAAC,QAAQ,EAAC,iBAAiB,GAAG,CAC7B,CACT;wBACA,iBAAiB,CAAC,aAAa,IAAI,CAClC,oBAAC,KAAK,IAAC,SAAS,EAAE,WAAW,CAAC,qBAAqB,CAAC;4BAClD,oBAAC,IAAI,IAAC,QAAQ,EAAC,sBAAsB,GAAG,CAClC,CACT,CACG,CACF,CACP;gBAEA,CAAA,MAAA,iBAAiB,CAAC,QAAQ,0CAAE,YAAY,KAAI;gBAC3C,sFAAsF;gBACtF,6GAA6G;gBAC7G,sGAAsG;gBACtG,6BACE,KAAK,EAAE,mBAAmB,CACxB,UAAU,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,YAAY,CAAC,MAAM,CAAC;wBACjE,0BAA0B,EAC5B,UAAU,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,YAAY,CAAC,MAAM,CAAC,GAAG,sBAAsB,CAC7F;oBAED,2CACc,sCAAsC,iBAAiB,CAAC,EAAE,EAAE,EACxE,KAAK,oBACA,uCAAuC,CACxC,SAAS,EACT,iBAAiB,CAAC,UAAU,IAAI,CAAC,EACjC,iBAAiB,CAAC,iBAAiB,CAAC,YAAY,CAAC,KAAK,CACvD;wBAGH,6BACE,KAAK,EAAE,qBAAqB,CAC1B,mCAAmC,EACnC,iBAAiB,CAAC,UAAU,IAAI,CAAC,EACjC,MAAA,CAAC,iBAAiB,CAAC,QAAQ;gCACzB,gBAAgB,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,QAAQ,CAAC,YAAY,EAAE,iBAAiB,CAAC,CAAC,mCAC9E,EAAE,CACL,GACD,CACE,CACF,CACP,CACG,CACF,CACP,CAAA;KAAA,CACJ,CACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(together-mode) */\nimport React, { useMemo, useState, memo, useEffect } from 'react';\n/* @conditional-compile-remove(together-mode) */\nimport {\n  Reaction,\n  ReactionResources,\n  VideoGalleryTogetherModeParticipantPosition,\n  VideoGalleryLocalParticipant,\n  VideoGalleryRemoteParticipant\n} from '../types';\n/* @conditional-compile-remove(together-mode) */\nimport { moveAnimationStyles, spriteAnimationStyles } from './styles/ReactionOverlay.style';\n/* @conditional-compile-remove(together-mode) */\nimport { REACTION_NUMBER_OF_ANIMATION_FRAMES } from './VideoGallery/utils/reactionUtils';\n/* @conditional-compile-remove(together-mode) */\nimport { Icon, mergeStyles, Stack, Text } from '@fluentui/react';\n/* @conditional-compile-remove(together-mode) */\nimport { getEmojiResource } from './VideoGallery/utils/videoGalleryLayoutUtils';\n/* @conditional-compile-remove(together-mode) */\nimport { useLocale } from '../localization';\n/* @conditional-compile-remove(together-mode) */\nimport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\n/* @conditional-compile-remove(together-mode) */\nimport {\n  calculateScaledSize,\n  getTogetherModeParticipantOverlayStyle,\n  participantStatusTransitionStyle,\n  REACTION_MAX_TRAVEL_HEIGHT,\n  REACTION_TRAVEL_HEIGHT,\n  setTogetherModeSeatPositionStyle,\n  togetherModeIconStyle,\n  togetherModeParticipantDisplayName,\n  togetherModeParticipantEmojiSpriteStyle,\n  togetherModeParticipantStatusContainer,\n  TogetherModeSeatStyle\n} from './styles/TogetherMode.styles';\n/* @conditional-compile-remove(together-mode) */\nimport { CallingTheme, useTheme } from '../theming';\n/* @conditional-compile-remove(together-mode) */\nimport { RaisedHandIcon } from './assets/RaisedHandIcon';\n/* @conditional-compile-remove(together-mode) */\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/* @conditional-compile-remove(together-mode) */\n/**\n * Signaling action overlay component props\n * @internal\n */\ntype TogetherModeParticipantStatus = {\n  reaction?: Reaction;\n  scaledSize?: number;\n  isHandRaised?: boolean;\n  isSpotlighted?: boolean;\n  isMuted?: boolean;\n  id: string;\n  seatPositionStyle: TogetherModeSeatStyle;\n  displayName: string;\n  showDisplayName: boolean;\n};\n\n/* @conditional-compile-remove(together-mode) */\n/**\n * TogetherModeOverlay component renders an empty JSX element.\n *\n * @returns {JSX.Element} An empty JSX element.\n */\nexport const TogetherModeOverlay = memo(\n  (props: {\n    emojiSize: number;\n    reactionResources: ReactionResources;\n    localParticipant: VideoGalleryLocalParticipant;\n    remoteParticipants: VideoGalleryRemoteParticipant[];\n    togetherModeSeatPositions: VideoGalleryTogetherModeParticipantPosition;\n  }) => {\n    const locale = useLocale();\n    const theme = useTheme();\n    const callingPalette = (theme as unknown as CallingTheme).callingPalette;\n\n    const { emojiSize, reactionResources, remoteParticipants, localParticipant, togetherModeSeatPositions } = props;\n    const [togetherModeParticipantStatus, setTogetherModeParticipantStatus] = useState<{\n      [key: string]: TogetherModeParticipantStatus;\n    }>({});\n    const [hoveredParticipantID, setHoveredParticipantID] = useState('');\n\n    /*\n     * The useMemo hook is used to calculate the participant status for the Together Mode overlay.\n     * It updates the togetherModeParticipantStatus state when there's a change in the remoteParticipants, localParticipant,\n     * raisedHand, spotlight, isMuted, displayName, or hoveredParticipantID.\n     */\n    const updatedParticipantStatus = useMemo(() => {\n      const allParticipants = [...remoteParticipants, localParticipant];\n\n      const participantsWithVideoAvailable = allParticipants.filter(\n        (p) => p.videoStream?.isAvailable && togetherModeSeatPositions[p.userId]\n      );\n\n      const updatedSignals: { [key: string]: TogetherModeParticipantStatus } = {};\n      for (const p of participantsWithVideoAvailable) {\n        const { userId, reaction, raisedHand, spotlight, isMuted, displayName } = p;\n        const seatingPosition = togetherModeSeatPositions[userId];\n        if (seatingPosition) {\n          updatedSignals[userId] = {\n            id: userId,\n            reaction: reactionResources && reaction,\n            isHandRaised: !!raisedHand,\n            isSpotlighted: !!spotlight,\n            isMuted,\n            displayName: displayName || locale.strings.videoGallery.displayNamePlaceholder,\n            showDisplayName: !!(spotlight || raisedHand || hoveredParticipantID === userId),\n            scaledSize: calculateScaledSize(seatingPosition.width, seatingPosition.height),\n            seatPositionStyle: setTogetherModeSeatPositionStyle(seatingPosition)\n          };\n        }\n      }\n\n      // This is used to remove the participants bounding box from the DOM when they are no longer in the stream\n      const participantsNotInTogetherModeStream = Object.keys(togetherModeParticipantStatus).filter(\n        (id) => !updatedSignals[id]\n      );\n\n      const newSignals = { ...togetherModeParticipantStatus, ...updatedSignals };\n\n      participantsNotInTogetherModeStream.forEach((id) => {\n        delete newSignals[id];\n      });\n\n      const hasSignalingChange = Object.keys(newSignals).some(\n        (key) => JSON.stringify(newSignals[key]) !== JSON.stringify(togetherModeParticipantStatus[key])\n      );\n\n      const updateTogetherModeParticipantStatusState =\n        hasSignalingChange || Object.keys(newSignals).length !== Object.keys(togetherModeParticipantStatus).length;\n      return updateTogetherModeParticipantStatusState ? newSignals : togetherModeParticipantStatus;\n    }, [\n      remoteParticipants,\n      localParticipant,\n      togetherModeParticipantStatus,\n      togetherModeSeatPositions,\n      reactionResources,\n      locale.strings.videoGallery.displayNamePlaceholder,\n      hoveredParticipantID\n    ]);\n\n    useEffect(() => {\n      if (hoveredParticipantID && !updatedParticipantStatus[hoveredParticipantID]) {\n        setHoveredParticipantID('');\n      }\n\n      setTogetherModeParticipantStatus(updatedParticipantStatus);\n    }, [hoveredParticipantID, updatedParticipantStatus]);\n\n    return (\n      <div style={{ position: 'absolute', width: '100%', height: '100%' }}>\n        {Object.values(togetherModeParticipantStatus).map(\n          (participantStatus) =>\n            participantStatus.id && (\n              <div\n                key={participantStatus.id}\n                data-ui-id={`together-mode-participant-${participantStatus.id}`}\n                style={{\n                  ...getTogetherModeParticipantOverlayStyle(participantStatus.seatPositionStyle)\n                }}\n                onMouseEnter={() => setHoveredParticipantID(participantStatus.id)}\n                onMouseLeave={() => setHoveredParticipantID('')}\n              >\n                <div>\n                  {participantStatus.showDisplayName && (\n                    <div style={{ ...participantStatusTransitionStyle }}>\n                      <div\n                        style={{\n                          ...togetherModeParticipantStatusContainer(\n                            callingPalette.videoTileLabelBackgroundLight,\n                            theme.effects.roundedCorner4\n                          )\n                        }}\n                      >\n                        {participantStatus.isHandRaised && <RaisedHandIcon />}\n                        {participantStatus.showDisplayName && (\n                          <Text\n                            style={{\n                              ...togetherModeParticipantDisplayName(\n                                hoveredParticipantID === participantStatus.id,\n                                parseFloat(participantStatus.seatPositionStyle.seatPosition.width),\n                                participantStatus.displayName ? theme.palette.neutralSecondary : 'inherit'\n                              )\n                            }}\n                          >\n                            {participantStatus.displayName}\n                          </Text>\n                        )}\n                        {participantStatus.isMuted && (\n                          <Stack className={mergeStyles(togetherModeIconStyle)}>\n                            <Icon iconName=\"VideoTileMicOff\" />\n                          </Stack>\n                        )}\n                        {participantStatus.isSpotlighted && (\n                          <Stack className={mergeStyles(togetherModeIconStyle)}>\n                            <Icon iconName=\"VideoTileSpotlighted\" />\n                          </Stack>\n                        )}\n                      </div>\n                    </div>\n                  )}\n\n                  {participantStatus.reaction?.reactionType && (\n                    // First div - Section that fixes the travel height and applies the movement animation\n                    // Second div - Responsible for ensuring the sprite emoji is always centered in the participant seat position\n                    // Third div - Play Animation as the other animation applies on the base play animation for the sprite\n                    <div\n                      style={moveAnimationStyles(\n                        parseFloat(participantStatus.seatPositionStyle.seatPosition.height) *\n                          REACTION_MAX_TRAVEL_HEIGHT,\n                        parseFloat(participantStatus.seatPositionStyle.seatPosition.height) * REACTION_TRAVEL_HEIGHT\n                      )}\n                    >\n                      <div\n                        data-ui-id={`together-mode-participant-reaction-${participantStatus.id}`}\n                        style={{\n                          ...togetherModeParticipantEmojiSpriteStyle(\n                            emojiSize,\n                            participantStatus.scaledSize || 1,\n                            participantStatus.seatPositionStyle.seatPosition.width\n                          )\n                        }}\n                      >\n                        <div\n                          style={spriteAnimationStyles(\n                            REACTION_NUMBER_OF_ANIMATION_FRAMES,\n                            participantStatus.scaledSize || 1,\n                            (participantStatus.reaction &&\n                              getEmojiResource(participantStatus?.reaction.reactionType, reactionResources)) ??\n                              ''\n                          )}\n                        />\n                      </div>\n                    </div>\n                  )}\n                </div>\n              </div>\n            )\n        )}\n      </div>\n    );\n  }\n);\n"]}
+{"version":3,"file":"TogetherModeOverlay.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/TogetherModeOverlay.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(together-mode) */\nimport React, { useMemo, useState, memo, useEffect } from 'react';\n/* @conditional-compile-remove(together-mode) */\nimport {\n  Reaction,\n  ReactionResources,\n  VideoGalleryTogetherModeParticipantPosition,\n  VideoGalleryLocalParticipant,\n  VideoGalleryRemoteParticipant\n} from '../types';\n/* @conditional-compile-remove(together-mode) */\nimport { moveAnimationStyles, spriteAnimationStyles } from './styles/ReactionOverlay.style';\n/* @conditional-compile-remove(together-mode) */\nimport { REACTION_NUMBER_OF_ANIMATION_FRAMES } from './VideoGallery/utils/reactionUtils';\n/* @conditional-compile-remove(together-mode) */\nimport { Icon, mergeStyles, Stack, Text } from '@fluentui/react';\n/* @conditional-compile-remove(together-mode) */\nimport { getEmojiResource } from './VideoGallery/utils/videoGalleryLayoutUtils';\n/* @conditional-compile-remove(together-mode) */\nimport { useLocale } from '../localization';\n/* @conditional-compile-remove(together-mode) */\nimport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\n/* @conditional-compile-remove(together-mode) */\nimport {\n  calculateScaledSize,\n  getTogetherModeParticipantOverlayStyle,\n  participantStatusTransitionStyle,\n  REACTION_MAX_TRAVEL_HEIGHT,\n  REACTION_TRAVEL_HEIGHT,\n  setTogetherModeSeatPositionStyle,\n  togetherModeIconStyle,\n  togetherModeParticipantDisplayName,\n  togetherModeParticipantEmojiSpriteStyle,\n  togetherModeParticipantStatusContainer,\n  TogetherModeSeatStyle\n} from './styles/TogetherMode.styles';\n/* @conditional-compile-remove(together-mode) */\nimport { CallingTheme, useTheme } from '../theming';\n/* @conditional-compile-remove(together-mode) */\nimport { RaisedHandIcon } from './assets/RaisedHandIcon';\n/* @conditional-compile-remove(together-mode) */\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/* @conditional-compile-remove(together-mode) */\n/**\n * Signaling action overlay component props\n * @internal\n */\ntype TogetherModeParticipantStatus = {\n  reaction?: Reaction;\n  scaledSize?: number;\n  isHandRaised?: boolean;\n  isSpotlighted?: boolean;\n  isMuted?: boolean;\n  id: string;\n  seatPositionStyle: TogetherModeSeatStyle;\n  displayName: string;\n  showDisplayName: boolean;\n};\n\n/* @conditional-compile-remove(together-mode) */\n/**\n * TogetherModeOverlay component renders an empty JSX element.\n *\n * @returns {JSX.Element} An empty JSX element.\n */\nexport const TogetherModeOverlay = memo(\n  (props: {\n    emojiSize: number;\n    reactionResources: ReactionResources;\n    localParticipant: VideoGalleryLocalParticipant;\n    remoteParticipants: VideoGalleryRemoteParticipant[];\n    togetherModeSeatPositions: VideoGalleryTogetherModeParticipantPosition;\n  }) => {\n    const locale = useLocale();\n    const theme = useTheme();\n    const callingPalette = (theme as unknown as CallingTheme).callingPalette;\n\n    const { emojiSize, reactionResources, remoteParticipants, localParticipant, togetherModeSeatPositions } = props;\n    const [togetherModeParticipantStatus, setTogetherModeParticipantStatus] = useState<{\n      [key: string]: TogetherModeParticipantStatus;\n    }>({});\n    const [hoveredParticipantID, setHoveredParticipantID] = useState('');\n\n    /*\n     * The useMemo hook is used to calculate the participant status for the Together Mode overlay.\n     * It updates the togetherModeParticipantStatus state when there's a change in the remoteParticipants, localParticipant,\n     * raisedHand, spotlight, isMuted, displayName, or hoveredParticipantID.\n     */\n    const updatedParticipantStatus = useMemo(() => {\n      const allParticipants = [...remoteParticipants, localParticipant];\n\n      const participantsWithVideoAvailable = allParticipants.filter(\n        (p) => p.videoStream?.isAvailable && togetherModeSeatPositions[p.userId]\n      );\n\n      const updatedSignals: { [key: string]: TogetherModeParticipantStatus } = {};\n      for (const p of participantsWithVideoAvailable) {\n        const { userId, reaction, raisedHand, spotlight, isMuted, displayName } = p;\n        const seatingPosition = togetherModeSeatPositions[userId];\n        if (seatingPosition) {\n          updatedSignals[userId] = {\n            id: userId,\n            reaction: reactionResources && reaction,\n            isHandRaised: !!raisedHand,\n            isSpotlighted: !!spotlight,\n            isMuted,\n            displayName: displayName || locale.strings.videoGallery.displayNamePlaceholder,\n            showDisplayName: !!(spotlight || raisedHand || hoveredParticipantID === userId),\n            scaledSize: calculateScaledSize(seatingPosition.width, seatingPosition.height),\n            seatPositionStyle: setTogetherModeSeatPositionStyle(seatingPosition)\n          };\n        }\n      }\n\n      // This is used to remove the participants bounding box from the DOM when they are no longer in the stream\n      const participantsNotInTogetherModeStream = Object.keys(togetherModeParticipantStatus).filter(\n        (id) => !updatedSignals[id]\n      );\n\n      const newSignals = { ...togetherModeParticipantStatus, ...updatedSignals };\n\n      participantsNotInTogetherModeStream.forEach((id) => {\n        delete newSignals[id];\n      });\n\n      const hasSignalingChange = Object.keys(newSignals).some(\n        (key) => JSON.stringify(newSignals[key]) !== JSON.stringify(togetherModeParticipantStatus[key])\n      );\n\n      const updateTogetherModeParticipantStatusState =\n        hasSignalingChange || Object.keys(newSignals).length !== Object.keys(togetherModeParticipantStatus).length;\n      return updateTogetherModeParticipantStatusState ? newSignals : togetherModeParticipantStatus;\n    }, [\n      remoteParticipants,\n      localParticipant,\n      togetherModeParticipantStatus,\n      togetherModeSeatPositions,\n      reactionResources,\n      locale.strings.videoGallery.displayNamePlaceholder,\n      hoveredParticipantID\n    ]);\n\n    useEffect(() => {\n      if (hoveredParticipantID && !updatedParticipantStatus[hoveredParticipantID]) {\n        setHoveredParticipantID('');\n      }\n\n      setTogetherModeParticipantStatus(updatedParticipantStatus);\n    }, [hoveredParticipantID, updatedParticipantStatus]);\n\n    return (\n      <div style={{ position: 'absolute', width: '100%', height: '100%', overflow: 'hidden' }}>\n        {Object.values(togetherModeParticipantStatus).map(\n          (participantStatus) =>\n            participantStatus.id && (\n              <div\n                key={participantStatus.id}\n                data-ui-id={`together-mode-participant-${participantStatus.id}`}\n                style={{\n                  ...getTogetherModeParticipantOverlayStyle(participantStatus.seatPositionStyle)\n                }}\n                onMouseEnter={() => setHoveredParticipantID(participantStatus.id)}\n                onMouseLeave={() => setHoveredParticipantID('')}\n              >\n                <div>\n                  {participantStatus.showDisplayName && (\n                    <div style={{ ...participantStatusTransitionStyle }}>\n                      <div\n                        style={{\n                          ...togetherModeParticipantStatusContainer(\n                            callingPalette.videoTileLabelBackgroundLight,\n                            theme.effects.roundedCorner4\n                          )\n                        }}\n                      >\n                        {participantStatus.isHandRaised && <RaisedHandIcon />}\n                        {participantStatus.showDisplayName && (\n                          <Text\n                            style={{\n                              ...togetherModeParticipantDisplayName(\n                                hoveredParticipantID === participantStatus.id,\n                                parseFloat(participantStatus.seatPositionStyle.seatPosition.width),\n                                participantStatus.displayName ? theme.palette.neutralSecondary : 'inherit'\n                              )\n                            }}\n                          >\n                            {participantStatus.displayName}\n                          </Text>\n                        )}\n                        {participantStatus.isMuted && (\n                          <Stack className={mergeStyles(togetherModeIconStyle)}>\n                            <Icon iconName=\"VideoTileMicOff\" />\n                          </Stack>\n                        )}\n                        {participantStatus.isSpotlighted && (\n                          <Stack className={mergeStyles(togetherModeIconStyle)}>\n                            <Icon iconName=\"VideoTileSpotlighted\" />\n                          </Stack>\n                        )}\n                      </div>\n                    </div>\n                  )}\n\n                  {participantStatus.reaction?.reactionType && (\n                    // First div - Section that fixes the travel height and applies the movement animation\n                    // Second div - Responsible for ensuring the sprite emoji is always centered in the participant seat position\n                    // Third div - Play Animation as the other animation applies on the base play animation for the sprite\n                    <div\n                      style={moveAnimationStyles(\n                        parseFloat(participantStatus.seatPositionStyle.seatPosition.height) *\n                          REACTION_MAX_TRAVEL_HEIGHT,\n                        parseFloat(participantStatus.seatPositionStyle.seatPosition.height) * REACTION_TRAVEL_HEIGHT\n                      )}\n                    >\n                      <div\n                        data-ui-id={`together-mode-participant-reaction-${participantStatus.id}`}\n                        style={{\n                          ...togetherModeParticipantEmojiSpriteStyle(\n                            emojiSize,\n                            participantStatus.scaledSize || 1,\n                            participantStatus.seatPositionStyle.seatPosition.width\n                          )\n                        }}\n                      >\n                        <div\n                          style={spriteAnimationStyles(\n                            REACTION_NUMBER_OF_ANIMATION_FRAMES,\n                            participantStatus.scaledSize || 1,\n                            (participantStatus.reaction &&\n                              getEmojiResource(participantStatus?.reaction.reactionType, reactionResources)) ??\n                              ''\n                          )}\n                        />\n                      </div>\n                    </div>\n                  )}\n                </div>\n              </div>\n            )\n        )}\n      </div>\n    );\n  }\n);\n"]}

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

@@ -27,6 +27,10 @@ export declare const buttonsContainerClassName: string;
  * @private
  */
 export declare const buttonStyles: (theme: Theme) => IButtonStyles;
+/**
+ * @private
+ */
+export declare const defaultButtonStyles: () => IButtonStyles;
 /**
  * @private
  */

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

@@ -76,6 +76,17 @@ export const buttonStyles = (theme) => {
         }
     };
 };
+/**
+ * @private
+ */
+export const defaultButtonStyles = () => {
+    return {
+        root: {
+            borderRadius: _pxToRem(2),
+            margin: _pxToRem(8)
+        }
+    };
+};
 /**
  * @private
  */

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

@@ -1 +1 @@
-{"version":3,"file":"CaptionsSettingsModal.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/CaptionsSettingsModal.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAgD,WAAW,EAAS,MAAM,iBAAiB,CAAC;AACnG,OAAO,EAAE,QAAQ,EAAE,sCAAgC;AAEnD;;GAEG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,CAAC,KAAY,EAAyB,EAAE,CAAC,CAAC;IACxF,IAAI,EAAE;QACJ,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;QAC1C,OAAO,EAAE,QAAQ,CAAC,EAAE,CAAC;QACrB,KAAK,EAAE,QAAQ,CAAC,GAAG,CAAC;QACpB,MAAM,EAAE,aAAa;QACrB,SAAS,EAAE,MAAM;KAClB;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,WAAW,CAAC;IACxC,UAAU,EAAE,GAAG;IACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;IACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;CACzB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,WAAW,CAAC;IACjD,aAAa,EAAE,QAAQ,CAAC,EAAE,CAAC;CAC5B,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,WAAW,CAAC;IACpD,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;CACzB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,KAAY,EAAU,EAAE,CAC5D,WAAW,CAAC;IACV,UAAU,EAAE,GAAG;IACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;IACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;IACxB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB;IACrC,aAAa,EAAE,QAAQ,CAAC,EAAE,CAAC;CAC5B,CAAC,CAAC;AAEL;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,WAAW,CAAC;IACnD,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;CACzB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAY,EAAiB,EAAE;IAC1D,OAAO;QACL,IAAI,EAAE;YACJ,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;YACzB,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC;SACpB;QACD,WAAW,EAAE;YACX,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;YAC3C,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;YACvC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;SAC3B;QACD,WAAW,EAAE;YACX,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;YAC3C,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;YACvC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;SAC3B;QACD,WAAW,EAAE;YACX,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;YAC3C,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;YACvC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;SAC3B;KACF,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAA6B;IACtD,OAAO,EAAE;QACP,MAAM,EAAE,QAAQ,CAAC,GAAG,CAAC;QACrB,QAAQ,EAAE,MAAM;KACjB;IACD,kBAAkB,EAAE;QAClB,QAAQ,EAAE,MAAM;QAChB,QAAQ,EAAE,OAAO;KAClB;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, IDropdownStyles, IModalStyles, mergeStyles, Theme } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/**\n * @private\n */\nexport const themedCaptionsSettingsModalStyle = (theme: Theme): Partial<IModalStyles> => ({\n  main: {\n    borderRadius: theme.effects.roundedCorner6,\n    padding: _pxToRem(24),\n    width: _pxToRem(440),\n    height: 'fit-content',\n    overflowY: 'auto'\n  }\n});\n\n/**\n * @private\n */\nexport const titleClassName = mergeStyles({\n  fontWeight: 600,\n  fontSize: _pxToRem(20),\n  lineHeight: _pxToRem(28)\n});\n\n/**\n * @private\n */\nexport const titleContainerClassName = mergeStyles({\n  paddingBottom: _pxToRem(20)\n});\n\n/**\n * @private\n */\nexport const dropdownContainerClassName = mergeStyles({\n  paddingTop: _pxToRem(16)\n});\n\n/**\n * @private\n */\nexport const dropdownInfoTextStyle = (theme: Theme): string =>\n  mergeStyles({\n    fontWeight: 400,\n    fontSize: _pxToRem(12),\n    lineHeight: _pxToRem(16),\n    color: theme.palette.neutralSecondary,\n    paddingBottom: _pxToRem(24)\n  });\n\n/**\n * @private\n */\nexport const buttonsContainerClassName = mergeStyles({\n  paddingTop: _pxToRem(16)\n});\n\n/**\n * @private\n */\nexport const buttonStyles = (theme: Theme): IButtonStyles => {\n  return {\n    root: {\n      borderRadius: _pxToRem(2),\n      margin: _pxToRem(8)\n    },\n    rootHovered: {\n      backgroundColor: theme.palette.themePrimary,\n      borderColor: theme.palette.themePrimary,\n      color: theme.palette.white\n    },\n    rootFocused: {\n      backgroundColor: theme.palette.themePrimary,\n      borderColor: theme.palette.themePrimary,\n      color: theme.palette.white\n    },\n    rootPressed: {\n      backgroundColor: theme.palette.themePrimary,\n      borderColor: theme.palette.themePrimary,\n      color: theme.palette.white\n    }\n  };\n};\n\n/**\n * @private\n */\nexport const dropdownStyles: Partial<IDropdownStyles> = {\n  callout: {\n    height: _pxToRem(300),\n    overflow: 'auto'\n  },\n  dropdownOptionText: {\n    textWrap: 'auto',\n    overflow: 'unset'\n  }\n};\n"]}
+{"version":3,"file":"CaptionsSettingsModal.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/CaptionsSettingsModal.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, IDropdownStyles, IModalStyles, mergeStyles, Theme } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/**\n * @private\n */\nexport const themedCaptionsSettingsModalStyle = (theme: Theme): Partial<IModalStyles> => ({\n  main: {\n    borderRadius: theme.effects.roundedCorner6,\n    padding: _pxToRem(24),\n    width: _pxToRem(440),\n    height: 'fit-content',\n    overflowY: 'auto'\n  }\n});\n\n/**\n * @private\n */\nexport const titleClassName = mergeStyles({\n  fontWeight: 600,\n  fontSize: _pxToRem(20),\n  lineHeight: _pxToRem(28)\n});\n\n/**\n * @private\n */\nexport const titleContainerClassName = mergeStyles({\n  paddingBottom: _pxToRem(20)\n});\n\n/**\n * @private\n */\nexport const dropdownContainerClassName = mergeStyles({\n  paddingTop: _pxToRem(16)\n});\n\n/**\n * @private\n */\nexport const dropdownInfoTextStyle = (theme: Theme): string =>\n  mergeStyles({\n    fontWeight: 400,\n    fontSize: _pxToRem(12),\n    lineHeight: _pxToRem(16),\n    color: theme.palette.neutralSecondary,\n    paddingBottom: _pxToRem(24)\n  });\n\n/**\n * @private\n */\nexport const buttonsContainerClassName = mergeStyles({\n  paddingTop: _pxToRem(16)\n});\n\n/**\n * @private\n */\nexport const buttonStyles = (theme: Theme): IButtonStyles => {\n  return {\n    root: {\n      borderRadius: _pxToRem(2),\n      margin: _pxToRem(8)\n    },\n    rootHovered: {\n      backgroundColor: theme.palette.themePrimary,\n      borderColor: theme.palette.themePrimary,\n      color: theme.palette.white\n    },\n    rootFocused: {\n      backgroundColor: theme.palette.themePrimary,\n      borderColor: theme.palette.themePrimary,\n      color: theme.palette.white\n    },\n    rootPressed: {\n      backgroundColor: theme.palette.themePrimary,\n      borderColor: theme.palette.themePrimary,\n      color: theme.palette.white\n    }\n  };\n};\n\n/**\n * @private\n */\nexport const defaultButtonStyles = (): IButtonStyles => {\n  return {\n    root: {\n      borderRadius: _pxToRem(2),\n      margin: _pxToRem(8)\n    }\n  };\n};\n\n/**\n * @private\n */\nexport const dropdownStyles: Partial<IDropdownStyles> = {\n  callout: {\n    height: _pxToRem(300),\n    overflow: 'auto'\n  },\n  dropdownOptionText: {\n    textWrap: 'auto',\n    overflow: 'unset'\n  }\n};\n"]}

package/dist/dist-esm/react-components/src/localization/LocalizationProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"LocalizationProvider.js","sourceRoot":"","sources":["../../../../../../react-components/src/localization/LocalizationProvider.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAgCzD,OAAO,EAAE,sBAAsB,EAAE,MAAM,WAAW,CAAC;AAqLnD;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAAkB,sBAAsB,CAAC,CAAC;AAcpF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAgC,EAAe,EAAE;IACpF,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACnC,OAAO,oBAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,MAAM,IAAG,QAAQ,CAA0B,CAAC;AACpF,CAAC,CAAC;AAEF,kCAAkC;AAClC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAoB,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { createContext, useContext } from 'react';\nimport {\n  CameraButtonStrings,\n  EndCallButtonStrings,\n  ErrorBarStrings,\n  MessageStatusIndicatorStrings,\n  MessageThreadStrings,\n  MicrophoneButtonStrings,\n  DevicesButtonStrings,\n  ParticipantsButtonStrings,\n  ParticipantItemStrings,\n  ScreenShareButtonStrings,\n  SendBoxStrings,\n  TypingIndicatorStrings,\n  VideoGalleryStrings,\n  CaptionsSettingsModalStrings,\n  CaptionsBannerStrings,\n  StartCaptionsButtonStrings\n} from '../components';\nimport { NotificationStackStrings } from '../components';\nimport { RaiseHandButtonStrings } from '../components';\nimport { HoldButtonStrings } from '../components';\nimport { DialpadStrings } from '../components';\n/* @conditional-compile-remove(call-readiness) */\nimport { SitePermissionsStrings } from '../components/DevicePermissions/SitePermissionsScaffolding';\n/* @conditional-compile-remove(call-readiness) */\nimport { BrowserPermissionDeniedStrings } from '../components/DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nimport { BrowserPermissionDeniedIOSStrings } from '../components/DevicePermissions/BrowserPermissionDeniedIOS';\n/* @conditional-compile-remove(call-readiness) */ /* @conditional-compile-remove(unsupported-browser) */\nimport { UnsupportedBrowserStrings } from '../components/UnsupportedBrowser';\nimport { VideoTileStrings } from '../components/VideoTile';\nimport { COMPONENT_LOCALE_EN_US } from './locales';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { UnsupportedBrowserVersionStrings } from '../components/UnsupportedBrowserVersion';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { UnsupportedOperatingSystemStrings } from '../components/UnsupportedOperatingSystem';\nimport { VerticalGalleryStrings } from '../components/VerticalGallery';\n/* @conditional-compile-remove(total-participant-count) */\nimport { ParticipantListStrings } from '../components/ParticipantList';\n/* @conditional-compile-remove(mention) */\nimport { MentionPopoverStrings } from '../components/MentionPopover';\nimport { ImageOverlayStrings } from '../components/ImageOverlay';\nimport { ReactionButtonStrings } from '../components';\n/* @conditional-compile-remove(rich-text-editor) */\nimport { RichTextSendBoxStrings } from '../components/RichTextEditor/RichTextSendBox';\nimport { MeetingConferencePhoneInfoModalStrings } from '../components/MeetingConferencePhoneInfo';\nimport { IncomingCallNotificationStrings } from '../components/IncomingCallNotification';\n/* @conditional-compile-remove(rtt) */\nimport { RealTimeTextModalStrings } from '../components/RealTimeTextModal';\n/* @conditional-compile-remove(rtt) */\nimport { RealTimeTextStrings } from '../components/RealTimeText';\nimport { CaptionLanguageStrings, SpokenLanguageStrings } from '../types';\n/* @conditional-compile-remove(rtt) */\nimport { StartRealTimeTextButtonStrings } from '../components/StartRealTimeTextButton';\n\n/**\n * Locale information for all components exported from this library.\n *\n * @public\n */\nexport interface ComponentLocale {\n  /** Strings for components */\n  strings: ComponentStrings;\n  /* @conditional-compile-remove(date-time-customization) */\n  /**\n   * Optional function to provide customized date format.\n   * @beta\n   */\n  onDisplayDateTimeString?: (messageDate: Date) => string;\n}\n\n/**\n * Strings used by all components exported from this library.\n *\n * @public\n */\nexport interface ComponentStrings {\n  /** Strings for MessageThread */\n  messageThread: MessageThreadStrings;\n  /** Strings for ParticipantItem */\n  participantItem: ParticipantItemStrings;\n  /** Strings for CameraButton */\n  cameraButton: CameraButtonStrings;\n  /** Strings for MicrophoneButton */\n  microphoneButton: MicrophoneButtonStrings;\n  /** Strings for EndCallButton */\n  endCallButton: EndCallButtonStrings;\n  /** Strings for DevicesButton */\n  devicesButton: DevicesButtonStrings;\n  /** Strings for ParticipantsButton */\n  participantsButton: ParticipantsButtonStrings;\n  /** Strings for ScreenShareButton */\n  screenShareButton: ScreenShareButtonStrings;\n  /** Strings for RaiseHandButton */\n  raiseHandButton: RaiseHandButtonStrings;\n  /**\n   * Strings for ReactionButton\n   * */\n  reactionButton: ReactionButtonStrings;\n  /** Strings for TypingIndicator */\n  typingIndicator: TypingIndicatorStrings;\n  /** Strings for SendBox */\n  sendBox: SendBoxStrings;\n  /* @conditional-compile-remove(rich-text-editor) */\n  /** Strings for RichTextSendBox */\n  richTextSendBox: RichTextSendBoxStrings;\n  /* @conditional-compile-remove(mention) */\n  /** Strings for MentionPopover */\n  mentionPopover: MentionPopoverStrings;\n  /** Strings for ImageOverlay */\n  imageOverlay: ImageOverlayStrings;\n  /** Strings for MessageStatusIndicator */\n  messageStatusIndicator: MessageStatusIndicatorStrings;\n  /** Strings for ErrorBar */\n  errorBar: ErrorBarStrings;\n\n  /** Strings for NotificationStack */\n  notificationStack: NotificationStackStrings;\n  /** Strings for VideoGallery */\n  videoGallery: VideoGalleryStrings;\n  /** Strings for Dialpad */\n  dialpad: DialpadStrings;\n  /** Strings for VideoTile */\n  videoTile: VideoTileStrings;\n  /** Strings for HoldButton */\n  holdButton: HoldButtonStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission request prompt */\n  CameraAndMicrophoneSitePermissionsRequest: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission request prompt */\n  CameraSitePermissionsRequest: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission request prompt */\n  MicrophoneSitePermissionsRequest: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission generic checking prompt */\n  CameraAndMicrophoneSitePermissionsCheck: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission generic checking prompt */\n  CameraSitePermissionsCheck: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission generic checking prompt */\n  MicrophoneSitePermissionsCheck: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt */\n  CameraAndMicrophoneSitePermissionsDenied: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt for safari browsers*/\n  CameraAndMicrophoneSitePermissionsDeniedSafari: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt */\n  CameraSitePermissionsDenied: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt */\n  MicrophoneSitePermissionsDenied: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt for safari browsers*/\n  CameraSitePermissionsDeniedSafari: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt for safari browsers*/\n  MicrophoneSitePermissionsDeniedSafari: SitePermissionsStrings;\n  /* @conditional-compile-remove(unsupported-browser) */\n  /** Strings for unsupported browser UI */\n  UnsupportedBrowser: UnsupportedBrowserStrings;\n  /* @conditional-compile-remove(unsupported-browser) */\n  /** Strings for unsupported browser version UI */\n  UnsupportedBrowserVersion: UnsupportedBrowserVersionStrings;\n  /* @conditional-compile-remove(unsupported-browser) */\n  /** Strings for unsupported browser version UI */\n  UnsupportedOperatingSystem: UnsupportedOperatingSystemStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for BrowserPemissionDenied */\n  BrowserPermissionDenied: BrowserPermissionDeniedStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for BrowserPemissionDeniedIOS */\n  BrowserPermissionDeniedIOS: BrowserPermissionDeniedIOSStrings;\n  /**\n   * Strings for the VerticalGallery.\n   */\n  verticalGallery: VerticalGalleryStrings;\n  /* @conditional-compile-remove(total-participant-count) */\n  /** Strings for the participant list component */\n  ParticipantList: ParticipantListStrings;\n  /** Strings for the MeetingConferencePhoneInfoModal */\n  meetingConferencePhoneInfo: MeetingConferencePhoneInfoModalStrings;\n  IncomingCallNotification: IncomingCallNotificationStrings;\n  /* @conditional-compile-remove(rtt) */\n  /** Strings for the RealTimeTextModal */\n  realTimeTextModal: RealTimeTextModalStrings;\n  /* @conditional-compile-remove(rtt) */\n  /** Strings for RealTimeText */\n  realTimeText: RealTimeTextStrings;\n  /** Strings for Captions Setting Modal */\n  captionsSettingsModal: CaptionsSettingsModalStrings;\n  /**\n   * 1 to 1 mapping between language code and language string for spoken languages\n   */\n  spokenLanguages: SpokenLanguageStrings;\n  /**\n   * 1 to 1 mapping between language code and language string for caption languages\n   */\n  captionLanguages: CaptionLanguageStrings;\n  /** Strings for CaptionsBanner */\n  captionsBanner: CaptionsBannerStrings;\n  /** Strings for Start Captions Button */\n  startCaptionsButton: StartCaptionsButtonStrings;\n  /* @conditional-compile-remove(rtt) */\n  /** Strings for Start RealTimeText Button */\n  startRealTimeTextButton: StartRealTimeTextButtonStrings;\n}\n\n/**\n * Context for providing localized strings to components exported from this library.\n *\n * @public\n */\nexport const LocaleContext = createContext<ComponentLocale>(COMPONENT_LOCALE_EN_US);\n\n/**\n * Props for {@link LocalizationProvider}.\n *\n * @public\n */\nexport type LocalizationProviderProps = {\n  /** Locale context to provide components */\n  locale: ComponentLocale;\n  /** Children to provide locale context. */\n  children: React.ReactNode;\n};\n\n/**\n * Provider to provide localized strings for this library's react components.\n *\n * @remarks Components will be provided localized strings in English (US) by default if this\n * provider is not used.\n *\n * @public\n */\nexport const LocalizationProvider = (props: LocalizationProviderProps): JSX.Element => {\n  const { locale, children } = props;\n  return <LocaleContext.Provider value={locale}>{children}</LocaleContext.Provider>;\n};\n\n/** React hook to access locale */\nexport const useLocale = (): ComponentLocale => useContext(LocaleContext);\n"]}
+{"version":3,"file":"LocalizationProvider.js","sourceRoot":"","sources":["../../../../../../react-components/src/localization/LocalizationProvider.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAgCzD,OAAO,EAAE,sBAAsB,EAAE,MAAM,WAAW,CAAC;AAqLnD;;;;GAIG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,aAAa,CAAkB,sBAAsB,CAAC,CAAC;AAcpF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAgC,EAAe,EAAE;IACpF,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACnC,OAAO,oBAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,MAAM,IAAG,QAAQ,CAA0B,CAAC;AACpF,CAAC,CAAC;AAEF,kCAAkC;AAClC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAoB,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { createContext, useContext } from 'react';\nimport {\n  CameraButtonStrings,\n  EndCallButtonStrings,\n  ErrorBarStrings,\n  MessageStatusIndicatorStrings,\n  MessageThreadStrings,\n  MicrophoneButtonStrings,\n  DevicesButtonStrings,\n  ParticipantsButtonStrings,\n  ParticipantItemStrings,\n  ScreenShareButtonStrings,\n  SendBoxStrings,\n  TypingIndicatorStrings,\n  VideoGalleryStrings,\n  CaptionsSettingsModalStrings,\n  CaptionsBannerStrings,\n  StartCaptionsButtonStrings\n} from '../components';\nimport { NotificationStackStrings } from '../components';\nimport { RaiseHandButtonStrings } from '../components';\nimport { HoldButtonStrings } from '../components';\nimport { DialpadStrings } from '../components';\n/* @conditional-compile-remove(call-readiness) */\nimport { SitePermissionsStrings } from '../components/DevicePermissions/SitePermissionsScaffolding';\n/* @conditional-compile-remove(call-readiness) */\nimport { BrowserPermissionDeniedStrings } from '../components/DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nimport { BrowserPermissionDeniedIOSStrings } from '../components/DevicePermissions/BrowserPermissionDeniedIOS';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { UnsupportedBrowserStrings } from '../components/UnsupportedBrowser';\nimport { VideoTileStrings } from '../components/VideoTile';\nimport { COMPONENT_LOCALE_EN_US } from './locales';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { UnsupportedBrowserVersionStrings } from '../components/UnsupportedBrowserVersion';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { UnsupportedOperatingSystemStrings } from '../components/UnsupportedOperatingSystem';\nimport { VerticalGalleryStrings } from '../components/VerticalGallery';\n/* @conditional-compile-remove(total-participant-count) */\nimport { ParticipantListStrings } from '../components/ParticipantList';\n/* @conditional-compile-remove(mention) */\nimport { MentionPopoverStrings } from '../components/MentionPopover';\nimport { ImageOverlayStrings } from '../components/ImageOverlay';\nimport { ReactionButtonStrings } from '../components';\n/* @conditional-compile-remove(rich-text-editor) */\nimport { RichTextSendBoxStrings } from '../components/RichTextEditor/RichTextSendBox';\nimport { MeetingConferencePhoneInfoModalStrings } from '../components/MeetingConferencePhoneInfo';\nimport { IncomingCallNotificationStrings } from '../components/IncomingCallNotification';\n/* @conditional-compile-remove(rtt) */\nimport { RealTimeTextModalStrings } from '../components/RealTimeTextModal';\n/* @conditional-compile-remove(rtt) */\nimport { RealTimeTextStrings } from '../components/RealTimeText';\nimport { CaptionLanguageStrings, SpokenLanguageStrings } from '../types';\n/* @conditional-compile-remove(rtt) */\nimport { StartRealTimeTextButtonStrings } from '../components/StartRealTimeTextButton';\n\n/**\n * Locale information for all components exported from this library.\n *\n * @public\n */\nexport interface ComponentLocale {\n  /** Strings for components */\n  strings: ComponentStrings;\n  /* @conditional-compile-remove(date-time-customization) */\n  /**\n   * Optional function to provide customized date format.\n   * @beta\n   */\n  onDisplayDateTimeString?: (messageDate: Date) => string;\n}\n\n/**\n * Strings used by all components exported from this library.\n *\n * @public\n */\nexport interface ComponentStrings {\n  /** Strings for MessageThread */\n  messageThread: MessageThreadStrings;\n  /** Strings for ParticipantItem */\n  participantItem: ParticipantItemStrings;\n  /** Strings for CameraButton */\n  cameraButton: CameraButtonStrings;\n  /** Strings for MicrophoneButton */\n  microphoneButton: MicrophoneButtonStrings;\n  /** Strings for EndCallButton */\n  endCallButton: EndCallButtonStrings;\n  /** Strings for DevicesButton */\n  devicesButton: DevicesButtonStrings;\n  /** Strings for ParticipantsButton */\n  participantsButton: ParticipantsButtonStrings;\n  /** Strings for ScreenShareButton */\n  screenShareButton: ScreenShareButtonStrings;\n  /** Strings for RaiseHandButton */\n  raiseHandButton: RaiseHandButtonStrings;\n  /**\n   * Strings for ReactionButton\n   * */\n  reactionButton: ReactionButtonStrings;\n  /** Strings for TypingIndicator */\n  typingIndicator: TypingIndicatorStrings;\n  /** Strings for SendBox */\n  sendBox: SendBoxStrings;\n  /* @conditional-compile-remove(rich-text-editor) */\n  /** Strings for RichTextSendBox */\n  richTextSendBox: RichTextSendBoxStrings;\n  /* @conditional-compile-remove(mention) */\n  /** Strings for MentionPopover */\n  mentionPopover: MentionPopoverStrings;\n  /** Strings for ImageOverlay */\n  imageOverlay: ImageOverlayStrings;\n  /** Strings for MessageStatusIndicator */\n  messageStatusIndicator: MessageStatusIndicatorStrings;\n  /** Strings for ErrorBar */\n  errorBar: ErrorBarStrings;\n\n  /** Strings for NotificationStack */\n  notificationStack: NotificationStackStrings;\n  /** Strings for VideoGallery */\n  videoGallery: VideoGalleryStrings;\n  /** Strings for Dialpad */\n  dialpad: DialpadStrings;\n  /** Strings for VideoTile */\n  videoTile: VideoTileStrings;\n  /** Strings for HoldButton */\n  holdButton: HoldButtonStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission request prompt */\n  CameraAndMicrophoneSitePermissionsRequest: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission request prompt */\n  CameraSitePermissionsRequest: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission request prompt */\n  MicrophoneSitePermissionsRequest: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission generic checking prompt */\n  CameraAndMicrophoneSitePermissionsCheck: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission generic checking prompt */\n  CameraSitePermissionsCheck: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission generic checking prompt */\n  MicrophoneSitePermissionsCheck: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt */\n  CameraAndMicrophoneSitePermissionsDenied: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt for safari browsers*/\n  CameraAndMicrophoneSitePermissionsDeniedSafari: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt */\n  CameraSitePermissionsDenied: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt */\n  MicrophoneSitePermissionsDenied: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt for safari browsers*/\n  CameraSitePermissionsDeniedSafari: SitePermissionsStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for a site's permission denied prompt for safari browsers*/\n  MicrophoneSitePermissionsDeniedSafari: SitePermissionsStrings;\n  /* @conditional-compile-remove(unsupported-browser) */\n  /** Strings for unsupported browser UI */\n  UnsupportedBrowser: UnsupportedBrowserStrings;\n  /* @conditional-compile-remove(unsupported-browser) */\n  /** Strings for unsupported browser version UI */\n  UnsupportedBrowserVersion: UnsupportedBrowserVersionStrings;\n  /* @conditional-compile-remove(unsupported-browser) */\n  /** Strings for unsupported browser version UI */\n  UnsupportedOperatingSystem: UnsupportedOperatingSystemStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for BrowserPemissionDenied */\n  BrowserPermissionDenied: BrowserPermissionDeniedStrings;\n  /* @conditional-compile-remove(call-readiness) */\n  /** Strings for BrowserPemissionDeniedIOS */\n  BrowserPermissionDeniedIOS: BrowserPermissionDeniedIOSStrings;\n  /**\n   * Strings for the VerticalGallery.\n   */\n  verticalGallery: VerticalGalleryStrings;\n  /* @conditional-compile-remove(total-participant-count) */\n  /** Strings for the participant list component */\n  ParticipantList: ParticipantListStrings;\n  /** Strings for the MeetingConferencePhoneInfoModal */\n  meetingConferencePhoneInfo: MeetingConferencePhoneInfoModalStrings;\n  IncomingCallNotification: IncomingCallNotificationStrings;\n  /* @conditional-compile-remove(rtt) */\n  /** Strings for the RealTimeTextModal */\n  realTimeTextModal: RealTimeTextModalStrings;\n  /* @conditional-compile-remove(rtt) */\n  /** Strings for RealTimeText */\n  realTimeText: RealTimeTextStrings;\n  /** Strings for Captions Setting Modal */\n  captionsSettingsModal: CaptionsSettingsModalStrings;\n  /**\n   * 1 to 1 mapping between language code and language string for spoken languages\n   */\n  spokenLanguages: SpokenLanguageStrings;\n  /**\n   * 1 to 1 mapping between language code and language string for caption languages\n   */\n  captionLanguages: CaptionLanguageStrings;\n  /** Strings for CaptionsBanner */\n  captionsBanner: CaptionsBannerStrings;\n  /** Strings for Start Captions Button */\n  startCaptionsButton: StartCaptionsButtonStrings;\n  /* @conditional-compile-remove(rtt) */\n  /** Strings for Start RealTimeText Button */\n  startRealTimeTextButton: StartRealTimeTextButtonStrings;\n}\n\n/**\n * Context for providing localized strings to components exported from this library.\n *\n * @public\n */\nexport const LocaleContext = createContext<ComponentLocale>(COMPONENT_LOCALE_EN_US);\n\n/**\n * Props for {@link LocalizationProvider}.\n *\n * @public\n */\nexport type LocalizationProviderProps = {\n  /** Locale context to provide components */\n  locale: ComponentLocale;\n  /** Children to provide locale context. */\n  children: React.ReactNode;\n};\n\n/**\n * Provider to provide localized strings for this library's react components.\n *\n * @remarks Components will be provided localized strings in English (US) by default if this\n * provider is not used.\n *\n * @public\n */\nexport const LocalizationProvider = (props: LocalizationProviderProps): JSX.Element => {\n  const { locale, children } = props;\n  return <LocaleContext.Provider value={locale}>{children}</LocaleContext.Provider>;\n};\n\n/** React hook to access locale */\nexport const useLocale = (): ComponentLocale => useContext(LocaleContext);\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@azure/communication-react",
-  "version": "1.27.0-alpha-202504260017",
+  "version": "1.27.0-alpha-202504300018",
   "sideEffects": false,
   "description": "React library for building modern communication user experiences utilizing Azure Communication Services",
   "keywords": [