@azure/communication-react 1.5.1-alpha-202304200013 → 1.5.1-alpha-202304220013

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.5.1-alpha-202304200013';
+module.exports = '1.5.1-alpha-202304220013';
 //# 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,0BAA0B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.5.1-alpha-202304200013';\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,0BAA0B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.5.1-alpha-202304220013';\n"]}

package/dist/dist-esm/calling-component-bindings/src/errorBarSelector.js

@@ -120,6 +120,8 @@ export const errorBarSelector = createSelector([getLatestErrors, getDiagnostics,
         appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.startVideo', 'startVideoGeneric');
     }
     appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.unmute', 'unmuteGeneric');
+    /* @conditional-compile-remove(video-background-effects) */
+    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'VideoEffectsFeature.startEffects', 'unableToStartVideoEffect');
     if (((_s = latestErrors['CallAgent.join']) === null || _s === void 0 ? void 0 : _s.message) === 'CallAgent.join: Invalid meeting link') {
         appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'CallAgent.join', 'failedToJoinCallInvalidMeetingLink');
     }

package/dist/dist-esm/calling-component-bindings/src/errorBarSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"errorBarSelector.js","sourceRoot":"","sources":["../../../../../calling-component-bindings/src/errorBarSelector.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAEL,gBAAgB,EAChB,cAAc,EACd,eAAe,EACf,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAajE;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAqB,cAAc,CAC9D,CAAC,eAAe,EAAE,cAAc,EAAE,gBAAgB,EAAE,kBAAkB,CAAC,EACvE,CACE,YAAwB,EACxB,WAAW,EACX,aAAa,EACb,eAAe,EACgC,EAAE;;IACjD,kHAAkH;IAClH,8CAA8C;IAC9C,wEAAwE;IACxE,iCAAiC;IACjC,EAAE;IACF,iHAAiH;IACjH,8BAA8B;IAC9B,MAAM,mBAAmB,GAAyB,EAAE,CAAC;IAErD,MAAM,QAAQ,GAAG,GAAY,EAAE;QAC7B,2DAA2D;QAC3D,OAAO,CAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,WAAW,CAAC,OAAO,MAAK,QAAQ,CAAC;QACzD,OAAO,4CAA4C,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAChF,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,GAAY,EAAE;QAC5B,2DAA2D;QAC3D,OAAO,CAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,WAAW,CAAC,QAAQ,MAAK,KAAK,CAAC;QACvD,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAEF,2GAA2G;IAC3G,IACE,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,CAAC,MAAM,CAAC,qBAAqB,0CAAE,KAAK,MAAK,iBAAiB,CAAC,GAAG;QAClF,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,OAAO,CAAC,MAAM,CAAC,qBAAqB,0CAAE,KAAK,MAAK,iBAAiB,CAAC,IAAI,EACnF;QACA,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,uBAAuB,EAAE,CAAC,CAAC;KAC7D;IACD,IAAI,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,0BAA0B,0CAAE,KAAK,MAAK,IAAI,EAAE;QACxE,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,oBAAoB,EAAE,CAAC,CAAC;KAC1D;IACD,IAAI,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,6BAA6B,0CAAE,KAAK,MAAK,IAAI,EAAE;QAC3E,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,uBAAuB,EAAE,CAAC,CAAC;KAC7D;IACD,IAAI,CAAA,MAAA,aAAa,CAAC,YAAY,0CAAE,KAAK,MAAK,KAAK,IAAI,QAAQ,EAAE,EAAE;QAC7D,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,kCAAkC,EAAE,CAAC,CAAC;KACxE;IACD,IAAI,CAAA,MAAA,aAAa,CAAC,YAAY,0CAAE,KAAK,MAAK,KAAK,IAAI,CAAC,QAAQ,EAAE,EAAE;QAC9D,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,4BAA4B,EAAE,CAAC,CAAC;KAClE;IAED,IAAI,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,0BAA0B,0CAAE,KAAK,MAAK,IAAI,IAAI,OAAO,EAAE,EAAE;QACrF,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,iCAAiC,EAAE,CAAC,CAAC;KACvE;SAAM,IAAI,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,0BAA0B,0CAAE,KAAK,MAAK,IAAI,EAAE;QAC/E,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,4BAA4B,EAAE,CAAC,CAAC;KAClE;IAED,MAAM,oCAAoC,GACxC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,0BAA0B,MAAI,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,wBAAwB,CAAA,CAAC;IAC7G,IAAI,oCAAoC,EAAE;QACxC,IAAI,oCAAoC,CAAC,KAAK,KAAK,iBAAiB,CAAC,GAAG,EAAE;YACxE,4FAA4F;YAC5F,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,6BAA6B,EAAE,CAAC,CAAC;SACnE;aAAM,IAAI,oCAAoC,CAAC,KAAK,KAAK,iBAAiB,CAAC,IAAI,EAAE;YAChF,4CAA4C;YAC5C,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,+BAA+B,EAAE,CAAC,CAAC;SACrE;KACF;IAED,MAAM,mCAAmC,GAAG,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,yBAAyB,CAAC;IAChG,IAAI,mCAAmC,EAAE;QACvC,IAAI,mCAAmC,CAAC,KAAK,KAAK,iBAAiB,CAAC,GAAG,EAAE;YACvE,mFAAmF;YACnF,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,0BAA0B,EAAE,CAAC,CAAC;SAChE;aAAM,IAAI,mCAAmC,CAAC,KAAK,KAAK,iBAAiB,CAAC,IAAI,EAAE;YAC/E,wCAAwC;YACxC,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,4BAA4B,EAAE,CAAC,CAAC;SAClE;KACF;IACD,IAAI,CAAA,MAAA,aAAa,CAAC,YAAY,0CAAE,KAAK,MAAK,KAAK,IAAI,QAAQ,EAAE,EAAE;QAC7D,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,8BAA8B,EAAE,CAAC,CAAC;KACpE;SAAM,IAAI,CAAA,MAAA,aAAa,CAAC,YAAY,0CAAE,KAAK,MAAK,KAAK,EAAE;QACtD,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,wBAAwB,EAAE,CAAC,CAAC;KAC9D;SAAM;QACL,IAAI,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,YAAY,0CAAE,KAAK,MAAK,IAAI,EAAE;YAC1D,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,mCAAmC,EAAE,CAAC,CAAC;SACzE;KACF;IAED;;OAEG;IACH,IAAI,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,sBAAsB,0CAAE,KAAK,MAAK,IAAI,IAAI,OAAO,EAAE,EAAE;QACjF,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,6BAA6B,EAAE,CAAC,CAAC;KACnE;IAED;;OAEG;IACH,IAAI,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,4BAA4B,0CAAE,KAAK,MAAK,IAAI,IAAI,OAAO,EAAE,EAAE;QACvF,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,kCAAkC,EAAE,CAAC,CAAC;KACxE;SAAM,IAAI,CAAA,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,CAAC,MAAM,CAAC,4BAA4B,0CAAE,KAAK,MAAK,IAAI,EAAE;QACjF,mBAAmB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,2BAA2B,EAAE,CAAC,CAAC;KACjE;IAED,mDAAmD;IACnD,0BAA0B,CAAC,mBAAmB,EAAE,YAAY,EAAE,gBAAgB,EAAE,kBAAkB,CAAC,CAAC;IACpG,0BAA0B,CAAC,mBAAmB,EAAE,YAAY,EAAE,WAAW,EAAE,aAAa,CAAC,CAAC;IAC1F,0BAA0B,CAAC,mBAAmB,EAAE,YAAY,EAAE,wBAAwB,EAAE,wBAAwB,CAAC,CAAC;IAElH,IACE,CAAA,MAAA,YAAY,CAAC,iBAAiB,CAAC,0CAAE,OAAO,MAAK,iEAAiE,EAC9G;QACA,0BAA0B,CAAC,mBAAmB,EAAE,YAAY,EAAE,iBAAiB,EAAE,wBAAwB,CAAC,CAAC;KAC5G;SAAM,IACL,CAAA,MAAA,YAAY,CAAC,iBAAiB,CAAC,0CAAE,OAAO,MAAK,gEAAgE,EAC7G;QACA,0BAA0B,CAAC,mBAAmB,EAAE,YAAY,EAAE,iBAAiB,EAAE,wBAAwB,CAAC,CAAC;KAC5G;SAAM;QACL,0BAA0B,CAAC,mBAAmB,EAAE,YAAY,EAAE,iBAAiB,EAAE,mBAAmB,CAAC,CAAC;KACvG;IAED,0BAA0B,CAAC,mBAAmB,EAAE,YAAY,EAAE,aAAa,EAAE,eAAe,CAAC,CAAC;IAE9F,IAAI,CAAA,MAAA,YAAY,CAAC,gBAAgB,CAAC,0CAAE,OAAO,MAAK,sCAAsC,EAAE;QACtF,0BAA0B,CACxB,mBAAmB,EACnB,YAAY,EACZ,gBAAgB,EAChB,oCAAoC,CACrC,CAAC;KACH;SAAM;QACL,0BAA0B,CAAC,mBAAmB,EAAE,YAAY,EAAE,gBAAgB,EAAE,yBAAyB,CAAC,CAAC;KAC5G;IAED,8FAA8F;IAC9F,mBAAmB,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;IAC1C,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,CAAC;AACtD,CAAC,CACF,CAAC;AAEF,MAAM,0BAA0B,GAAG,CACjC,mBAAyC,EACzC,YAAwB,EACxB,MAAuB,EACvB,eAA0B,EACpB,EAAE;IACR,IAAI,YAAY,CAAC,MAAM,CAAC,KAAK,SAAS,EAAE;QACtC,OAAO;KACR;IACD,mBAAmB,CAAC,IAAI,CAAC;QACvB,IAAI,EAAE,eAAe;QACrB,SAAS,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC,SAAS;KAC1C,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport {\n  CallingBaseSelectorProps,\n  getDeviceManager,\n  getDiagnostics,\n  getLatestErrors,\n  getEnvironmentInfo\n} from './baseSelectors';\nimport { ActiveErrorMessage, ErrorType } from '@internal/react-components';\nimport { createSelector } from 'reselect';\nimport { CallClientState, CallErrors, CallErrorTarget } from '@internal/calling-stateful-client';\nimport { DiagnosticQuality } from '@azure/communication-calling';\n/**\n * Selector type for {@link ErrorBar} component.\n *\n * @public\n */\nexport type ErrorBarSelector = (\n  state: CallClientState,\n  props: CallingBaseSelectorProps\n) => {\n  activeErrorMessages: ActiveErrorMessage[];\n};\n\n/**\n * Select the first 3 active errors from the state for the `ErrorBar` component.\n *\n * In case there are many errors, only the first three errors are returned to avoid\n * filling up the UI with too many errors.\n *\n * Invariants:\n *   - `ErrorType` is never repeated in the returned errors.\n *   - Errors are returned in a fixed order by `ErrorType`.\n *\n * @public\n */\nexport const errorBarSelector: ErrorBarSelector = createSelector(\n  [getLatestErrors, getDiagnostics, getDeviceManager, getEnvironmentInfo],\n  (\n    latestErrors: CallErrors,\n    diagnostics,\n    deviceManager,\n    environmentInfo\n  ): { activeErrorMessages: ActiveErrorMessage[] } => {\n    // The order in which the errors are returned is significant: The `ErrorBar` shows errors on the UI in that order.\n    // There are several options for the ordering:\n    //   - Sorted by when the errors happened (latest first / oldest first).\n    //   - Stable sort by error type.\n    //\n    // We chose to stable sort by error type: We intend to show only a small number of errors on the UI and we do not\n    // have timestamps for errors.\n    const activeErrorMessages: ActiveErrorMessage[] = [];\n\n    const isSafari = (): boolean => {\n      /* @conditional-compile-remove(calling-environment-info) */\n      return environmentInfo?.environment.browser === 'safari';\n      return /^((?!chrome|android|crios|fxios).)*safari/i.test(navigator.userAgent);\n    };\n\n    const isMacOS = (): boolean => {\n      /* @conditional-compile-remove(calling-environment-info) */\n      return environmentInfo?.environment.platform === 'mac';\n      return false;\n    };\n\n    // Errors reported via diagnostics are more reliable than from API method failures, so process those first.\n    if (\n      diagnostics?.network.latest.networkReceiveQuality?.value === DiagnosticQuality.Bad ||\n      diagnostics?.network.latest.networkReceiveQuality?.value === DiagnosticQuality.Poor\n    ) {\n      activeErrorMessages.push({ type: 'callNetworkQualityLow' });\n    }\n    if (diagnostics?.media.latest.noSpeakerDevicesEnumerated?.value === true) {\n      activeErrorMessages.push({ type: 'callNoSpeakerFound' });\n    }\n    if (diagnostics?.media.latest.noMicrophoneDevicesEnumerated?.value === true) {\n      activeErrorMessages.push({ type: 'callNoMicrophoneFound' });\n    }\n    if (deviceManager.deviceAccess?.audio === false && isSafari()) {\n      activeErrorMessages.push({ type: 'callMicrophoneAccessDeniedSafari' });\n    }\n    if (deviceManager.deviceAccess?.audio === false && !isSafari()) {\n      activeErrorMessages.push({ type: 'callMicrophoneAccessDenied' });\n    }\n\n    if (diagnostics?.media.latest.microphonePermissionDenied?.value === true && isMacOS()) {\n      activeErrorMessages.push({ type: 'callMacOsMicrophoneAccessDenied' });\n    } else if (diagnostics?.media.latest.microphonePermissionDenied?.value === true) {\n      activeErrorMessages.push({ type: 'callMicrophoneAccessDenied' });\n    }\n\n    const microphoneMuteUnexpectedlyDiagnostic =\n      diagnostics?.media.latest.microphoneMuteUnexpectedly || diagnostics?.media.latest.microphoneNotFunctioning;\n    if (microphoneMuteUnexpectedlyDiagnostic) {\n      if (microphoneMuteUnexpectedlyDiagnostic.value === DiagnosticQuality.Bad) {\n        // Inform the user that microphone stopped working and inform them to start microphone again\n        activeErrorMessages.push({ type: 'callMicrophoneMutedBySystem' });\n      } else if (microphoneMuteUnexpectedlyDiagnostic.value === DiagnosticQuality.Good) {\n        // Inform the user that microphone recovered\n        activeErrorMessages.push({ type: 'callMicrophoneUnmutedBySystem' });\n      }\n    }\n\n    const cameraStoppedUnexpectedlyDiagnostic = diagnostics?.media.latest.cameraStoppedUnexpectedly;\n    if (cameraStoppedUnexpectedlyDiagnostic) {\n      if (cameraStoppedUnexpectedlyDiagnostic.value === DiagnosticQuality.Bad) {\n        // Inform the user that camera stopped working and inform them to start video again\n        activeErrorMessages.push({ type: 'callVideoStoppedBySystem' });\n      } else if (cameraStoppedUnexpectedlyDiagnostic.value === DiagnosticQuality.Good) {\n        // Inform the user that camera recovered\n        activeErrorMessages.push({ type: 'callVideoRecoveredBySystem' });\n      }\n    }\n    if (deviceManager.deviceAccess?.video === false && isSafari()) {\n      activeErrorMessages.push({ type: 'callCameraAccessDeniedSafari' });\n    } else if (deviceManager.deviceAccess?.video === false) {\n      activeErrorMessages.push({ type: 'callCameraAccessDenied' });\n    } else {\n      if (diagnostics?.media.latest.cameraFreeze?.value === true) {\n        activeErrorMessages.push({ type: 'cameraFrozenForRemoteParticipants' });\n      }\n    }\n\n    /**\n     * show the Mac specific strings if the platform is detected as mac\n     */\n    if (diagnostics?.media.latest.cameraPermissionDenied?.value === true && isMacOS()) {\n      activeErrorMessages.push({ type: 'callMacOsCameraAccessDenied' });\n    }\n\n    /**\n     * This UFD only works on mac still so we should only see it fire on mac.\n     */\n    if (diagnostics?.media.latest.screenshareRecordingDisabled?.value === true && isMacOS()) {\n      activeErrorMessages.push({ type: 'callMacOsScreenShareAccessDenied' });\n    } else if (diagnostics?.media.latest.screenshareRecordingDisabled?.value === true) {\n      activeErrorMessages.push({ type: 'startScreenSharingGeneric' });\n    }\n\n    // Prefer to show errors with privacy implications.\n    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.stopVideo', 'stopVideoGeneric');\n    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.mute', 'muteGeneric');\n    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.stopScreenSharing', 'stopScreenShareGeneric');\n\n    if (\n      latestErrors['Call.startVideo']?.message === 'Call.startVideo: Video operation failure SourceUnavailableError'\n    ) {\n      appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.startVideo', 'callCameraAlreadyInUse');\n    } else if (\n      latestErrors['Call.startVideo']?.message === 'Call.startVideo: Video operation failure permissionDeniedError'\n    ) {\n      appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.startVideo', 'callCameraAccessDenied');\n    } else {\n      appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.startVideo', 'startVideoGeneric');\n    }\n\n    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.unmute', 'unmuteGeneric');\n\n    if (latestErrors['CallAgent.join']?.message === 'CallAgent.join: Invalid meeting link') {\n      appendActiveErrorIfDefined(\n        activeErrorMessages,\n        latestErrors,\n        'CallAgent.join',\n        'failedToJoinCallInvalidMeetingLink'\n      );\n    } else {\n      appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'CallAgent.join', 'failedToJoinCallGeneric');\n    }\n\n    // We only return the first few errors to avoid filling up the UI with too many `MessageBar`s.\n    activeErrorMessages.splice(maxErrorCount);\n    return { activeErrorMessages: activeErrorMessages };\n  }\n);\n\nconst appendActiveErrorIfDefined = (\n  activeErrorMessages: ActiveErrorMessage[],\n  latestErrors: CallErrors,\n  target: CallErrorTarget,\n  activeErrorType: ErrorType\n): void => {\n  if (latestErrors[target] === undefined) {\n    return;\n  }\n  activeErrorMessages.push({\n    type: activeErrorType,\n    timestamp: latestErrors[target].timestamp\n  });\n};\n\nconst maxErrorCount = 3;\n\"../../react-components/src\"\"../../calling-stateful-client/src\""]}
+{"version":3,"file":"errorBarSelector.js","sourceRoot":"","sources":["../../../../../calling-component-bindings/src/errorBarSelector.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport {\n  CallingBaseSelectorProps,\n  getDeviceManager,\n  getDiagnostics,\n  getLatestErrors,\n  getEnvironmentInfo\n} from './baseSelectors';\nimport { ActiveErrorMessage, ErrorType } from '@internal/react-components';\nimport { createSelector } from 'reselect';\nimport { CallClientState, CallErrors, CallErrorTarget } from '@internal/calling-stateful-client';\nimport { DiagnosticQuality } from '@azure/communication-calling';\n/**\n * Selector type for {@link ErrorBar} component.\n *\n * @public\n */\nexport type ErrorBarSelector = (\n  state: CallClientState,\n  props: CallingBaseSelectorProps\n) => {\n  activeErrorMessages: ActiveErrorMessage[];\n};\n\n/**\n * Select the first 3 active errors from the state for the `ErrorBar` component.\n *\n * In case there are many errors, only the first three errors are returned to avoid\n * filling up the UI with too many errors.\n *\n * Invariants:\n *   - `ErrorType` is never repeated in the returned errors.\n *   - Errors are returned in a fixed order by `ErrorType`.\n *\n * @public\n */\nexport const errorBarSelector: ErrorBarSelector = createSelector(\n  [getLatestErrors, getDiagnostics, getDeviceManager, getEnvironmentInfo],\n  (\n    latestErrors: CallErrors,\n    diagnostics,\n    deviceManager,\n    environmentInfo\n  ): { activeErrorMessages: ActiveErrorMessage[] } => {\n    // The order in which the errors are returned is significant: The `ErrorBar` shows errors on the UI in that order.\n    // There are several options for the ordering:\n    //   - Sorted by when the errors happened (latest first / oldest first).\n    //   - Stable sort by error type.\n    //\n    // We chose to stable sort by error type: We intend to show only a small number of errors on the UI and we do not\n    // have timestamps for errors.\n    const activeErrorMessages: ActiveErrorMessage[] = [];\n\n    const isSafari = (): boolean => {\n      /* @conditional-compile-remove(calling-environment-info) */\n      return environmentInfo?.environment.browser === 'safari';\n      return /^((?!chrome|android|crios|fxios).)*safari/i.test(navigator.userAgent);\n    };\n\n    const isMacOS = (): boolean => {\n      /* @conditional-compile-remove(calling-environment-info) */\n      return environmentInfo?.environment.platform === 'mac';\n      return false;\n    };\n\n    // Errors reported via diagnostics are more reliable than from API method failures, so process those first.\n    if (\n      diagnostics?.network.latest.networkReceiveQuality?.value === DiagnosticQuality.Bad ||\n      diagnostics?.network.latest.networkReceiveQuality?.value === DiagnosticQuality.Poor\n    ) {\n      activeErrorMessages.push({ type: 'callNetworkQualityLow' });\n    }\n    if (diagnostics?.media.latest.noSpeakerDevicesEnumerated?.value === true) {\n      activeErrorMessages.push({ type: 'callNoSpeakerFound' });\n    }\n    if (diagnostics?.media.latest.noMicrophoneDevicesEnumerated?.value === true) {\n      activeErrorMessages.push({ type: 'callNoMicrophoneFound' });\n    }\n    if (deviceManager.deviceAccess?.audio === false && isSafari()) {\n      activeErrorMessages.push({ type: 'callMicrophoneAccessDeniedSafari' });\n    }\n    if (deviceManager.deviceAccess?.audio === false && !isSafari()) {\n      activeErrorMessages.push({ type: 'callMicrophoneAccessDenied' });\n    }\n\n    if (diagnostics?.media.latest.microphonePermissionDenied?.value === true && isMacOS()) {\n      activeErrorMessages.push({ type: 'callMacOsMicrophoneAccessDenied' });\n    } else if (diagnostics?.media.latest.microphonePermissionDenied?.value === true) {\n      activeErrorMessages.push({ type: 'callMicrophoneAccessDenied' });\n    }\n\n    const microphoneMuteUnexpectedlyDiagnostic =\n      diagnostics?.media.latest.microphoneMuteUnexpectedly || diagnostics?.media.latest.microphoneNotFunctioning;\n    if (microphoneMuteUnexpectedlyDiagnostic) {\n      if (microphoneMuteUnexpectedlyDiagnostic.value === DiagnosticQuality.Bad) {\n        // Inform the user that microphone stopped working and inform them to start microphone again\n        activeErrorMessages.push({ type: 'callMicrophoneMutedBySystem' });\n      } else if (microphoneMuteUnexpectedlyDiagnostic.value === DiagnosticQuality.Good) {\n        // Inform the user that microphone recovered\n        activeErrorMessages.push({ type: 'callMicrophoneUnmutedBySystem' });\n      }\n    }\n\n    const cameraStoppedUnexpectedlyDiagnostic = diagnostics?.media.latest.cameraStoppedUnexpectedly;\n    if (cameraStoppedUnexpectedlyDiagnostic) {\n      if (cameraStoppedUnexpectedlyDiagnostic.value === DiagnosticQuality.Bad) {\n        // Inform the user that camera stopped working and inform them to start video again\n        activeErrorMessages.push({ type: 'callVideoStoppedBySystem' });\n      } else if (cameraStoppedUnexpectedlyDiagnostic.value === DiagnosticQuality.Good) {\n        // Inform the user that camera recovered\n        activeErrorMessages.push({ type: 'callVideoRecoveredBySystem' });\n      }\n    }\n    if (deviceManager.deviceAccess?.video === false && isSafari()) {\n      activeErrorMessages.push({ type: 'callCameraAccessDeniedSafari' });\n    } else if (deviceManager.deviceAccess?.video === false) {\n      activeErrorMessages.push({ type: 'callCameraAccessDenied' });\n    } else {\n      if (diagnostics?.media.latest.cameraFreeze?.value === true) {\n        activeErrorMessages.push({ type: 'cameraFrozenForRemoteParticipants' });\n      }\n    }\n\n    /**\n     * show the Mac specific strings if the platform is detected as mac\n     */\n    if (diagnostics?.media.latest.cameraPermissionDenied?.value === true && isMacOS()) {\n      activeErrorMessages.push({ type: 'callMacOsCameraAccessDenied' });\n    }\n\n    /**\n     * This UFD only works on mac still so we should only see it fire on mac.\n     */\n    if (diagnostics?.media.latest.screenshareRecordingDisabled?.value === true && isMacOS()) {\n      activeErrorMessages.push({ type: 'callMacOsScreenShareAccessDenied' });\n    } else if (diagnostics?.media.latest.screenshareRecordingDisabled?.value === true) {\n      activeErrorMessages.push({ type: 'startScreenSharingGeneric' });\n    }\n\n    // Prefer to show errors with privacy implications.\n    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.stopVideo', 'stopVideoGeneric');\n    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.mute', 'muteGeneric');\n    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.stopScreenSharing', 'stopScreenShareGeneric');\n\n    if (\n      latestErrors['Call.startVideo']?.message === 'Call.startVideo: Video operation failure SourceUnavailableError'\n    ) {\n      appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.startVideo', 'callCameraAlreadyInUse');\n    } else if (\n      latestErrors['Call.startVideo']?.message === 'Call.startVideo: Video operation failure permissionDeniedError'\n    ) {\n      appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.startVideo', 'callCameraAccessDenied');\n    } else {\n      appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.startVideo', 'startVideoGeneric');\n    }\n\n    appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'Call.unmute', 'unmuteGeneric');\n    /* @conditional-compile-remove(video-background-effects) */\n    appendActiveErrorIfDefined(\n      activeErrorMessages,\n      latestErrors,\n      'VideoEffectsFeature.startEffects',\n      'unableToStartVideoEffect'\n    );\n\n    if (latestErrors['CallAgent.join']?.message === 'CallAgent.join: Invalid meeting link') {\n      appendActiveErrorIfDefined(\n        activeErrorMessages,\n        latestErrors,\n        'CallAgent.join',\n        'failedToJoinCallInvalidMeetingLink'\n      );\n    } else {\n      appendActiveErrorIfDefined(activeErrorMessages, latestErrors, 'CallAgent.join', 'failedToJoinCallGeneric');\n    }\n\n    // We only return the first few errors to avoid filling up the UI with too many `MessageBar`s.\n    activeErrorMessages.splice(maxErrorCount);\n    return { activeErrorMessages: activeErrorMessages };\n  }\n);\n\nconst appendActiveErrorIfDefined = (\n  activeErrorMessages: ActiveErrorMessage[],\n  latestErrors: CallErrors,\n  target: CallErrorTarget,\n  activeErrorType: ErrorType\n): void => {\n  if (latestErrors[target] === undefined) {\n    return;\n  }\n  activeErrorMessages.push({\n    type: activeErrorType,\n    timestamp: latestErrors[target].timestamp\n  });\n};\n\nconst maxErrorCount = 3;\n\"../../react-components/src\"\"../../calling-stateful-client/src\""]}

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

@@ -1,10 +1,10 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
-import { Stack } from '@fluentui/react';
+import { Stack, FocusZone } from '@fluentui/react';
 import React, { useEffect, useRef, useState, useCallback } from 'react';
 import { Ref } from '@fluentui/react-northstar';
 import { _Caption } from './Caption';
-import { captionContainerClassName, captionsBannerClassName } from './styles/Captions.style';
+import { captionContainerClassName, captionsBannerClassName, captionsContainerClassName } from './styles/Captions.style';
 /**
  * @internal
  * A component for displaying a CaptionsBanner with user icon, displayName and captions text.
@@ -39,10 +39,10 @@ export const _CaptionsBanner = (props) => {
             scrollToBottom();
         }
     }, [captions, isAtBottomOfScroll]);
-    return (React.createElement(React.Fragment, null, isCaptionsOn && (React.createElement("div", { "data-is-focusable": true },
+    return (React.createElement(React.Fragment, null, isCaptionsOn && (React.createElement(FocusZone, { as: "ul", className: captionsContainerClassName },
         React.createElement(Ref, { innerRef: captionsScrollDivRef },
             React.createElement(Stack, { verticalAlign: "start", className: captionsBannerClassName }, captions.map((caption, key) => {
-                return (React.createElement("div", { key: key, className: captionContainerClassName, tabIndex: 0 },
+                return (React.createElement("div", { key: key, className: captionContainerClassName, "data-is-focusable": true },
                     React.createElement(_Caption, Object.assign({}, caption, { onRenderAvatar: onRenderAvatar }))));
             })))))));
 };

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,MAAM,iBAAiB,CAAC;AACxC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAExE,OAAO,EAAE,GAAG,EAAE,MAAM,2BAA2B,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACrC,OAAO,EAAE,yBAAyB,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AA4B7F;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAe,EAAE;IAC1E,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IACzD,MAAM,oBAAoB,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IACvD,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAU,IAAI,CAAC,CAAC;IAE5E,MAAM,cAAc,GAAG,GAAS,EAAE;QAChC,IAAI,oBAAoB,CAAC,OAAO,EAAE;YAChC,oBAAoB,CAAC,OAAO,CAAC,SAAS,GAAG,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC;SACpF;IACH,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,WAAW,CAAC,GAAS,EAAE;QACrD,IAAI,CAAC,oBAAoB,CAAC,OAAO,EAAE;YACjC,OAAO;SACR;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,CAAC;QAExF,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,CAAC,CAAC,CAAC;IAE9B,SAAS,CAAC,GAAG,EAAE;QACb,2FAA2F;QAC3F,IAAI,kBAAkB,EAAE;YACtB,cAAc,EAAE,CAAC;SAClB;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAEnC,OAAO,CACL,0CACG,YAAY,IAAI,CACf,kDAAwB,IAAI;QAC1B,oBAAC,GAAG,IAAC,QAAQ,EAAE,oBAAoB;YACjC,oBAAC,KAAK,IAAC,aAAa,EAAC,OAAO,EAAC,SAAS,EAAE,uBAAuB,IAC5D,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,EAAE;gBAC7B,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,yBAAyB,EAAE,QAAQ,EAAE,CAAC;oBAC9D,oBAAC,QAAQ,oBAAK,OAAO,IAAE,cAAc,EAAE,cAAc,IAAI,CACrD,CACP,CAAC;YACJ,CAAC,CAAC,CACI,CACJ,CACF,CACP,CACA,CACJ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\nimport { Stack } from '@fluentui/react';\nimport React, { useEffect, useRef, useState, useCallback } from 'react';\nimport { _FileUploadCardsStrings } from './FileUploadCards';\nimport { Ref } from '@fluentui/react-northstar';\nimport { _Caption } from './Caption';\nimport { captionContainerClassName, captionsBannerClassName } from './styles/Captions.style';\nimport { OnRenderAvatarCallback } from '../types';\n\n/**\n * @internal\n * information required for each line of caption\n */\nexport type _CaptionsInfo = {\n  displayName: string;\n  captionText: string;\n  userId?: string;\n};\n\n/**\n * @internal\n * _CaptionsBanner Component Props.\n */\nexport interface _CaptionsBannerProps {\n  captions: _CaptionsInfo[];\n  isCaptionsOn?: boolean;\n  /**\n   * Optional callback to override render of the avatar.\n   *\n   * @param userId - user Id\n   */\n  onRenderAvatar?: OnRenderAvatarCallback;\n}\n\n/**\n * @internal\n * A component for displaying a CaptionsBanner with user icon, displayName and captions text.\n */\nexport const _CaptionsBanner = (props: _CaptionsBannerProps): JSX.Element => {\n  const { captions, isCaptionsOn, onRenderAvatar } = props;\n  const captionsScrollDivRef = useRef<HTMLElement>(null);\n  const [isAtBottomOfScroll, setIsAtBottomOfScroll] = useState<boolean>(true);\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;\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]);\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, isAtBottomOfScroll]);\n\n  return (\n    <>\n      {isCaptionsOn && (\n        <div data-is-focusable={true}>\n          <Ref innerRef={captionsScrollDivRef}>\n            <Stack verticalAlign=\"start\" className={captionsBannerClassName}>\n              {captions.map((caption, key) => {\n                return (\n                  <div key={key} className={captionContainerClassName} tabIndex={0}>\n                    <_Caption {...caption} onRenderAvatar={onRenderAvatar} />\n                  </div>\n                );\n              })}\n            </Stack>\n          </Ref>\n        </div>\n      )}\n    </>\n  );\n};\n"]}
+{"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,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAExE,OAAO,EAAE,GAAG,EAAE,MAAM,2BAA2B,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACrC,OAAO,EACL,yBAAyB,EACzB,uBAAuB,EACvB,0BAA0B,EAC3B,MAAM,yBAAyB,CAAC;AA4BjC;;;GAGG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAe,EAAE;IAC1E,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IACzD,MAAM,oBAAoB,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IACvD,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,GAAG,QAAQ,CAAU,IAAI,CAAC,CAAC;IAE5E,MAAM,cAAc,GAAG,GAAS,EAAE;QAChC,IAAI,oBAAoB,CAAC,OAAO,EAAE;YAChC,oBAAoB,CAAC,OAAO,CAAC,SAAS,GAAG,oBAAoB,CAAC,OAAO,CAAC,YAAY,CAAC;SACpF;IACH,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,WAAW,CAAC,GAAS,EAAE;QACrD,IAAI,CAAC,oBAAoB,CAAC,OAAO,EAAE;YACjC,OAAO;SACR;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,CAAC;QAExF,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,CAAC,CAAC,CAAC;IAE9B,SAAS,CAAC,GAAG,EAAE;QACb,2FAA2F;QAC3F,IAAI,kBAAkB,EAAE;YACtB,cAAc,EAAE,CAAC;SAClB;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAEnC,OAAO,CACL,0CACG,YAAY,IAAI,CACf,oBAAC,SAAS,IAAC,EAAE,EAAC,IAAI,EAAC,SAAS,EAAE,0BAA0B;QACtD,oBAAC,GAAG,IAAC,QAAQ,EAAE,oBAAoB;YACjC,oBAAC,KAAK,IAAC,aAAa,EAAC,OAAO,EAAC,SAAS,EAAE,uBAAuB,IAC5D,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,EAAE;gBAC7B,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,yBAAyB,uBAAqB,IAAI;oBAC1E,oBAAC,QAAQ,oBAAK,OAAO,IAAE,cAAc,EAAE,cAAc,IAAI,CACrD,CACP,CAAC;YACJ,CAAC,CAAC,CACI,CACJ,CACI,CACb,CACA,CACJ,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\nimport { Stack, FocusZone } from '@fluentui/react';\nimport React, { useEffect, useRef, useState, useCallback } from 'react';\nimport { _FileUploadCardsStrings } from './FileUploadCards';\nimport { Ref } from '@fluentui/react-northstar';\nimport { _Caption } from './Caption';\nimport {\n  captionContainerClassName,\n  captionsBannerClassName,\n  captionsContainerClassName\n} from './styles/Captions.style';\nimport { OnRenderAvatarCallback } from '../types';\n\n/**\n * @internal\n * information required for each line of caption\n */\nexport type _CaptionsInfo = {\n  displayName: string;\n  captionText: string;\n  userId?: string;\n};\n\n/**\n * @internal\n * _CaptionsBanner Component Props.\n */\nexport interface _CaptionsBannerProps {\n  captions: _CaptionsInfo[];\n  isCaptionsOn?: boolean;\n  /**\n   * Optional callback to override render of the avatar.\n   *\n   * @param userId - user Id\n   */\n  onRenderAvatar?: OnRenderAvatarCallback;\n}\n\n/**\n * @internal\n * A component for displaying a CaptionsBanner with user icon, displayName and captions text.\n */\nexport const _CaptionsBanner = (props: _CaptionsBannerProps): JSX.Element => {\n  const { captions, isCaptionsOn, onRenderAvatar } = props;\n  const captionsScrollDivRef = useRef<HTMLElement>(null);\n  const [isAtBottomOfScroll, setIsAtBottomOfScroll] = useState<boolean>(true);\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;\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]);\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, isAtBottomOfScroll]);\n\n  return (\n    <>\n      {isCaptionsOn && (\n        <FocusZone as=\"ul\" className={captionsContainerClassName}>\n          <Ref innerRef={captionsScrollDivRef}>\n            <Stack verticalAlign=\"start\" className={captionsBannerClassName}>\n              {captions.map((caption, key) => {\n                return (\n                  <div key={key} className={captionContainerClassName} data-is-focusable={true}>\n                    <_Caption {...caption} onRenderAvatar={onRenderAvatar} />\n                  </div>\n                );\n              })}\n            </Stack>\n          </Ref>\n        </FocusZone>\n      )}\n    </>\n  );\n};\n"]}

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

@@ -173,6 +173,10 @@ export interface ErrorBarStrings {
      * Error bar string letting you know remote participants see a frozen stream for you.
      */
     cameraFrozenForRemoteParticipants?: string;
+    /**
+     * Unable to start effect
+     */
+    unableToStartVideoEffect?: string;
 }
 /**
  * All errors that can be shown in the {@link ErrorBar}.

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

@@ -1 +1 @@
-{"version":3,"file":"ErrorBar.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ErrorBar.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAoB,UAAU,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAEL,YAAY,EACZ,+BAA+B,EAC/B,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACf,MAAM,SAAS,CAAC;AA0OjB;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAe,EAAE;;IAC5D,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC;IACnD,MAAM,OAAO,GAAG,MAAA,KAAK,CAAC,OAAO,mCAAI,aAAa,CAAC;IAE/C,sDAAsD;IACtD,yDAAyD;IACzD,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IAEpD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAmB,EAAE,CAAC,CAAC;IAE7E,mGAAmG;IACnG,4EAA4E;IAC5E,SAAS,CACP,GAAG,EAAE,CAAC,kBAAkB,CAAC,+BAA+B,CAAC,KAAK,CAAC,mBAAmB,EAAE,eAAe,CAAC,CAAC,EACrG,CAAC,KAAK,CAAC,mBAAmB,EAAE,eAAe,CAAC,CAC7C,CAAC;IAEF,MAAM,MAAM,GAAG,YAAY,CACzB,KAAK,CAAC,mBAAmB,EACzB,eAAe,EACf,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAChE,CAAC;IAEF,OAAO,CACL,oBAAC,KAAK,kBAAY,iBAAiB,IAChC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACrB,oBAAC,UAAU,oBACL,KAAK,IACT,MAAM,EAAE;YACN,SAAS,EAAE;gBACT,SAAS,EAAE,QAAQ;aACpB;YACD,IAAI,EAAE;gBACJ,MAAM,EAAE,CAAC;aACV;YACD,OAAO,EAAE;gBACP,UAAU,EAAE,SAAS;aACtB;YACD,SAAS,EAAE;gBACT,MAAM,EAAE,CAAC;gBACT,UAAU,EAAE,QAAQ;aACrB;SACF,EACD,GAAG,EAAE,KAAK,CAAC,IAAI,EACf,cAAc,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,EAC1C,mBAAmB,EAAE,mBAAmB,CAAC,KAAK,CAAC,IAAI,CAAC,EACpD,SAAS,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC,EACzE,sBAAsB,EAAE,OAAO,CAAC,sBAAsB,EACtD,gBAAgB,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE,KAE9C,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CACT,CACd,CAAC,CACI,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useEffect, useRef, useState } from 'react';\nimport { IMessageBarProps, MessageBar, Stack } from '@fluentui/react';\nimport { useLocale } from '../localization';\nimport {\n  DismissedError,\n  dismissError,\n  dropDismissalsForInactiveErrors,\n  errorsToShow,\n  messageBarIconProps,\n  messageBarType\n} from './utils';\n\n/**\n * Props for {@link ErrorBar}.\n *\n * In addition to the following, {@link ErrorBar} forwards all\n * {@link @fluentui/react#IMessageBarProps} to the underlying {@link @fluentui/react#MessageBar}.\n *\n * @public\n */\nexport interface ErrorBarProps extends IMessageBarProps {\n  /**\n   * Strings shown on the UI on errors.\n   */\n  strings?: ErrorBarStrings;\n\n  /**\n   * Currently active errors.\n   */\n  activeErrorMessages: ActiveErrorMessage[];\n\n  /**\n   * If set, errors with {@link ActiveErrorMessage.timestamp} older than the time this component is mounted\n   * are not shown.\n   *\n   * This is useful when using the {@link ErrorBar} with a stateful client that handles more than one call\n   * or chat thread. Set this prop to ignore errors from previous call or chat.\n   *\n   * @defaultValue false\n   */\n  ignorePremountErrors?: boolean;\n}\n\n/**\n * All strings that may be shown on the UI in the {@link ErrorBar}.\n *\n * @public\n */\nexport interface ErrorBarStrings {\n  /**\n   * Unable to reach Chat service.\n   *\n   * This can mean:\n   *   - Incorrect Azure Communication Services endpoint was provided.\n   *   - User's network connection is down.\n   */\n  unableToReachChatService: string;\n\n  /**\n   * User does not have access to the Chat service.\n   * This usually means that either the Azure Communication Services endpiont or the token provided are incorrect.\n   */\n  accessDenied: string;\n\n  /**\n   * User is no longer on the thread.\n   *\n   * See also: {@link ErrorBarStrings.sendMessageNotInChatThread} for a more specific error.\n   */\n  userNotInChatThread: string;\n\n  /**\n   * Sending message failed because user is no longer on the thread.\n   */\n  sendMessageNotInChatThread: string;\n\n  /**\n   * A generic message when sending message fails.\n   * Prefer more specific error strings when possible.\n   */\n  sendMessageGeneric: string;\n\n  /**\n   * A generic message when starting video fails.\n   */\n  startVideoGeneric: string;\n\n  /**\n   * A generic message when starting video fails.\n   */\n  stopVideoGeneric: string;\n\n  /**\n   * A generic message when muting microphone fails.\n   */\n  muteGeneric: string;\n\n  /**\n   * A generic message when unmuting microphone fails.\n   */\n  unmuteGeneric: string;\n\n  /**\n   * A generic message when starting screenshare fails.\n   */\n  startScreenShareGeneric: string;\n\n  /**\n   * A generic message when stopping screenshare fails.\n   */\n  stopScreenShareGeneric: string;\n\n  /**\n   * Message shown when poor network quality is detected during a call.\n   */\n  callNetworkQualityLow: string;\n\n  /**\n   * Message shown on failure to detect audio output devices.\n   */\n  callNoSpeakerFound: string;\n\n  /**\n   * Message shown on failure to detect audio input devices.\n   */\n  callNoMicrophoneFound: string;\n\n  /**\n   * Message shown when microphone can be enumerated but access is blocked by the system.\n   */\n  callMicrophoneAccessDenied: string;\n\n  /**\n   * Message shown when microphone can be enumerated but access is blocked by the system, for safari browsers\n   */\n  callMicrophoneAccessDeniedSafari: string;\n\n  /**\n   * Message shown when microphone is muted by the system (not by local or remote participants)\n   */\n  callMicrophoneMutedBySystem: string;\n\n  /**\n   * Message shown when microphone is unmuted by the system (not by local or remote participants).\n   * This typically occurs if the system recovers from an unexpected mute.\n   */\n  callMicrophoneUnmutedBySystem: string;\n\n  /**\n   * Mac OS specific message shown when microphone can be enumerated but access is\n   * blocked by the system.\n   */\n  callMacOsMicrophoneAccessDenied: string;\n\n  /**\n   * Message shown when poor network causes local video stream to be frozen.\n   */\n  callLocalVideoFreeze: string;\n\n  /**\n   * Message shown when camera can be enumerated but access is blocked by the system.\n   */\n  callCameraAccessDenied: string;\n\n  /**\n   * Message shown when camera can be enumerated but access is blocked by the system, for safari browsers\n   */\n  callCameraAccessDeniedSafari: string;\n\n  /**\n   * Message shown when local video fails to start because camera is already in use by\n   * another applciation.\n   */\n  callCameraAlreadyInUse: string;\n\n  /**\n   * Message shown when local video is stopped by the system (not by local or remote participants)\n   */\n  callVideoStoppedBySystem: string;\n\n  /**\n   * Message shown when local video was recovered by the system (not by the local participant)\n   */\n  callVideoRecoveredBySystem: string;\n\n  /**\n   * Mac OS specific message shown when system denies access to camera.\n   */\n  callMacOsCameraAccessDenied: string;\n\n  /**\n   * Mac OS specific message shown when system denies sharing local screen on a call.\n   */\n  callMacOsScreenShareAccessDenied: string;\n  /**\n   * Dimiss errorbar button aria label read by screen reader accessibility tools\n   */\n  dismissButtonAriaLabel?: string;\n\n  /**\n   * An error message when joining a call fails.\n   */\n  failedToJoinCallGeneric?: string;\n\n  /**\n   * An error message when joining a call fails specifically due to an invalid meeting link.\n   */\n  failedToJoinCallInvalidMeetingLink?: string;\n  /**\n   * Generic message for when screen sharing fails\n   */\n  startScreenSharingGeneric?: string;\n  /**\n   * Error bar string letting you know remote participants see a frozen stream for you.\n   */\n  cameraFrozenForRemoteParticipants?: string;\n}\n\n/**\n * All errors that can be shown in the {@link ErrorBar}.\n *\n * @public\n */\nexport type ErrorType = keyof ErrorBarStrings;\n\n/**\n * Active error messages to be shown via {@link ErrorBar}.\n *\n * @public\n */\nexport interface ActiveErrorMessage {\n  /**\n   * Type of error that is active.\n   */\n  type: ErrorType;\n  /**\n   * The latest timestamp when this error was observed.\n   *\n   * When available, this is used to track errors that have already been seen and dismissed\n   * by the user.\n   */\n  timestamp?: Date;\n}\n\n/**\n * A component to show error messages on the UI.\n * All strings that can be shown are accepted as the {@link ErrorBarProps.strings} so that they can be localized.\n * Active errors are selected by {@link ErrorBarProps.activeErrorMessages}.\n *\n * This component internally tracks dismissed by the user.\n *   * Errors that have an associated timestamp: The error is shown on the UI again if it occurs after being dismissed.\n *   * Errors that do not have a timestamp: The error is dismissed until it disappears from the props.\n *         If the error recurs, it is shown in the UI.\n *\n * Uses {@link @fluentui/react#MessageBar} UI element.\n *\n * @public\n */\nexport const ErrorBar = (props: ErrorBarProps): JSX.Element => {\n  const localeStrings = useLocale().strings.errorBar;\n  const strings = props.strings ?? localeStrings;\n\n  // Timestamp for when this comopnent is first mounted.\n  // Never updated through the lifecycle of this component.\n  const mountTimestamp = useRef(new Date(Date.now()));\n\n  const [dismissedErrors, setDismissedErrors] = useState<DismissedError[]>([]);\n\n  // dropDismissalsForInactiveErrors only returns a new object if `dismissedErrors` actually changes.\n  // Without this behaviour, this `useEffect` block would cause a render loop.\n  useEffect(\n    () => setDismissedErrors(dropDismissalsForInactiveErrors(props.activeErrorMessages, dismissedErrors)),\n    [props.activeErrorMessages, dismissedErrors]\n  );\n\n  const toShow = errorsToShow(\n    props.activeErrorMessages,\n    dismissedErrors,\n    props.ignorePremountErrors ? mountTimestamp.current : undefined\n  );\n\n  return (\n    <Stack data-ui-id=\"error-bar-stack\">\n      {toShow.map((error) => (\n        <MessageBar\n          {...props}\n          styles={{\n            innerText: {\n              alignSelf: 'center'\n            },\n            icon: {\n              height: 0\n            },\n            content: {\n              lineHeight: 'inherit'\n            },\n            dismissal: {\n              height: 0,\n              paddingTop: '0.8rem'\n            }\n          }}\n          key={error.type}\n          messageBarType={messageBarType(error.type)}\n          messageBarIconProps={messageBarIconProps(error.type)}\n          onDismiss={() => setDismissedErrors(dismissError(dismissedErrors, error))}\n          dismissButtonAriaLabel={strings.dismissButtonAriaLabel}\n          dismissIconProps={{ iconName: 'ErrorBarClear' }}\n        >\n          {strings[error.type]}\n        </MessageBar>\n      ))}\n    </Stack>\n  );\n};\n"]}
+{"version":3,"file":"ErrorBar.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ErrorBar.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAoB,UAAU,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAEL,YAAY,EACZ,+BAA+B,EAC/B,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACf,MAAM,SAAS,CAAC;AA+OjB;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAe,EAAE;;IAC5D,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC;IACnD,MAAM,OAAO,GAAG,MAAA,KAAK,CAAC,OAAO,mCAAI,aAAa,CAAC;IAE/C,sDAAsD;IACtD,yDAAyD;IACzD,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IAEpD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAmB,EAAE,CAAC,CAAC;IAE7E,mGAAmG;IACnG,4EAA4E;IAC5E,SAAS,CACP,GAAG,EAAE,CAAC,kBAAkB,CAAC,+BAA+B,CAAC,KAAK,CAAC,mBAAmB,EAAE,eAAe,CAAC,CAAC,EACrG,CAAC,KAAK,CAAC,mBAAmB,EAAE,eAAe,CAAC,CAC7C,CAAC;IAEF,MAAM,MAAM,GAAG,YAAY,CACzB,KAAK,CAAC,mBAAmB,EACzB,eAAe,EACf,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAChE,CAAC;IAEF,OAAO,CACL,oBAAC,KAAK,kBAAY,iBAAiB,IAChC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACrB,oBAAC,UAAU,oBACL,KAAK,IACT,MAAM,EAAE;YACN,SAAS,EAAE;gBACT,SAAS,EAAE,QAAQ;aACpB;YACD,IAAI,EAAE;gBACJ,MAAM,EAAE,CAAC;aACV;YACD,OAAO,EAAE;gBACP,UAAU,EAAE,SAAS;aACtB;YACD,SAAS,EAAE;gBACT,MAAM,EAAE,CAAC;gBACT,UAAU,EAAE,QAAQ;aACrB;SACF,EACD,GAAG,EAAE,KAAK,CAAC,IAAI,EACf,cAAc,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,EAC1C,mBAAmB,EAAE,mBAAmB,CAAC,KAAK,CAAC,IAAI,CAAC,EACpD,SAAS,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC,EACzE,sBAAsB,EAAE,OAAO,CAAC,sBAAsB,EACtD,gBAAgB,EAAE,EAAE,QAAQ,EAAE,eAAe,EAAE,KAE9C,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CACT,CACd,CAAC,CACI,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React, { useEffect, useRef, useState } from 'react';\nimport { IMessageBarProps, MessageBar, Stack } from '@fluentui/react';\nimport { useLocale } from '../localization';\nimport {\n  DismissedError,\n  dismissError,\n  dropDismissalsForInactiveErrors,\n  errorsToShow,\n  messageBarIconProps,\n  messageBarType\n} from './utils';\n\n/**\n * Props for {@link ErrorBar}.\n *\n * In addition to the following, {@link ErrorBar} forwards all\n * {@link @fluentui/react#IMessageBarProps} to the underlying {@link @fluentui/react#MessageBar}.\n *\n * @public\n */\nexport interface ErrorBarProps extends IMessageBarProps {\n  /**\n   * Strings shown on the UI on errors.\n   */\n  strings?: ErrorBarStrings;\n\n  /**\n   * Currently active errors.\n   */\n  activeErrorMessages: ActiveErrorMessage[];\n\n  /**\n   * If set, errors with {@link ActiveErrorMessage.timestamp} older than the time this component is mounted\n   * are not shown.\n   *\n   * This is useful when using the {@link ErrorBar} with a stateful client that handles more than one call\n   * or chat thread. Set this prop to ignore errors from previous call or chat.\n   *\n   * @defaultValue false\n   */\n  ignorePremountErrors?: boolean;\n}\n\n/**\n * All strings that may be shown on the UI in the {@link ErrorBar}.\n *\n * @public\n */\nexport interface ErrorBarStrings {\n  /**\n   * Unable to reach Chat service.\n   *\n   * This can mean:\n   *   - Incorrect Azure Communication Services endpoint was provided.\n   *   - User's network connection is down.\n   */\n  unableToReachChatService: string;\n\n  /**\n   * User does not have access to the Chat service.\n   * This usually means that either the Azure Communication Services endpiont or the token provided are incorrect.\n   */\n  accessDenied: string;\n\n  /**\n   * User is no longer on the thread.\n   *\n   * See also: {@link ErrorBarStrings.sendMessageNotInChatThread} for a more specific error.\n   */\n  userNotInChatThread: string;\n\n  /**\n   * Sending message failed because user is no longer on the thread.\n   */\n  sendMessageNotInChatThread: string;\n\n  /**\n   * A generic message when sending message fails.\n   * Prefer more specific error strings when possible.\n   */\n  sendMessageGeneric: string;\n\n  /**\n   * A generic message when starting video fails.\n   */\n  startVideoGeneric: string;\n\n  /**\n   * A generic message when starting video fails.\n   */\n  stopVideoGeneric: string;\n\n  /**\n   * A generic message when muting microphone fails.\n   */\n  muteGeneric: string;\n\n  /**\n   * A generic message when unmuting microphone fails.\n   */\n  unmuteGeneric: string;\n\n  /**\n   * A generic message when starting screenshare fails.\n   */\n  startScreenShareGeneric: string;\n\n  /**\n   * A generic message when stopping screenshare fails.\n   */\n  stopScreenShareGeneric: string;\n\n  /**\n   * Message shown when poor network quality is detected during a call.\n   */\n  callNetworkQualityLow: string;\n\n  /**\n   * Message shown on failure to detect audio output devices.\n   */\n  callNoSpeakerFound: string;\n\n  /**\n   * Message shown on failure to detect audio input devices.\n   */\n  callNoMicrophoneFound: string;\n\n  /**\n   * Message shown when microphone can be enumerated but access is blocked by the system.\n   */\n  callMicrophoneAccessDenied: string;\n\n  /**\n   * Message shown when microphone can be enumerated but access is blocked by the system, for safari browsers\n   */\n  callMicrophoneAccessDeniedSafari: string;\n\n  /**\n   * Message shown when microphone is muted by the system (not by local or remote participants)\n   */\n  callMicrophoneMutedBySystem: string;\n\n  /**\n   * Message shown when microphone is unmuted by the system (not by local or remote participants).\n   * This typically occurs if the system recovers from an unexpected mute.\n   */\n  callMicrophoneUnmutedBySystem: string;\n\n  /**\n   * Mac OS specific message shown when microphone can be enumerated but access is\n   * blocked by the system.\n   */\n  callMacOsMicrophoneAccessDenied: string;\n\n  /**\n   * Message shown when poor network causes local video stream to be frozen.\n   */\n  callLocalVideoFreeze: string;\n\n  /**\n   * Message shown when camera can be enumerated but access is blocked by the system.\n   */\n  callCameraAccessDenied: string;\n\n  /**\n   * Message shown when camera can be enumerated but access is blocked by the system, for safari browsers\n   */\n  callCameraAccessDeniedSafari: string;\n\n  /**\n   * Message shown when local video fails to start because camera is already in use by\n   * another applciation.\n   */\n  callCameraAlreadyInUse: string;\n\n  /**\n   * Message shown when local video is stopped by the system (not by local or remote participants)\n   */\n  callVideoStoppedBySystem: string;\n\n  /**\n   * Message shown when local video was recovered by the system (not by the local participant)\n   */\n  callVideoRecoveredBySystem: string;\n\n  /**\n   * Mac OS specific message shown when system denies access to camera.\n   */\n  callMacOsCameraAccessDenied: string;\n\n  /**\n   * Mac OS specific message shown when system denies sharing local screen on a call.\n   */\n  callMacOsScreenShareAccessDenied: string;\n  /**\n   * Dimiss errorbar button aria label read by screen reader accessibility tools\n   */\n  dismissButtonAriaLabel?: string;\n\n  /**\n   * An error message when joining a call fails.\n   */\n  failedToJoinCallGeneric?: string;\n\n  /**\n   * An error message when joining a call fails specifically due to an invalid meeting link.\n   */\n  failedToJoinCallInvalidMeetingLink?: string;\n  /**\n   * Generic message for when screen sharing fails\n   */\n  startScreenSharingGeneric?: string;\n  /**\n   * Error bar string letting you know remote participants see a frozen stream for you.\n   */\n  cameraFrozenForRemoteParticipants?: string;\n  /* @conditional-compile-remove(video-background-effects) */\n  /**\n   * Unable to start effect\n   */\n  unableToStartVideoEffect?: string;\n}\n\n/**\n * All errors that can be shown in the {@link ErrorBar}.\n *\n * @public\n */\nexport type ErrorType = keyof ErrorBarStrings;\n\n/**\n * Active error messages to be shown via {@link ErrorBar}.\n *\n * @public\n */\nexport interface ActiveErrorMessage {\n  /**\n   * Type of error that is active.\n   */\n  type: ErrorType;\n  /**\n   * The latest timestamp when this error was observed.\n   *\n   * When available, this is used to track errors that have already been seen and dismissed\n   * by the user.\n   */\n  timestamp?: Date;\n}\n\n/**\n * A component to show error messages on the UI.\n * All strings that can be shown are accepted as the {@link ErrorBarProps.strings} so that they can be localized.\n * Active errors are selected by {@link ErrorBarProps.activeErrorMessages}.\n *\n * This component internally tracks dismissed by the user.\n *   * Errors that have an associated timestamp: The error is shown on the UI again if it occurs after being dismissed.\n *   * Errors that do not have a timestamp: The error is dismissed until it disappears from the props.\n *         If the error recurs, it is shown in the UI.\n *\n * Uses {@link @fluentui/react#MessageBar} UI element.\n *\n * @public\n */\nexport const ErrorBar = (props: ErrorBarProps): JSX.Element => {\n  const localeStrings = useLocale().strings.errorBar;\n  const strings = props.strings ?? localeStrings;\n\n  // Timestamp for when this comopnent is first mounted.\n  // Never updated through the lifecycle of this component.\n  const mountTimestamp = useRef(new Date(Date.now()));\n\n  const [dismissedErrors, setDismissedErrors] = useState<DismissedError[]>([]);\n\n  // dropDismissalsForInactiveErrors only returns a new object if `dismissedErrors` actually changes.\n  // Without this behaviour, this `useEffect` block would cause a render loop.\n  useEffect(\n    () => setDismissedErrors(dropDismissalsForInactiveErrors(props.activeErrorMessages, dismissedErrors)),\n    [props.activeErrorMessages, dismissedErrors]\n  );\n\n  const toShow = errorsToShow(\n    props.activeErrorMessages,\n    dismissedErrors,\n    props.ignorePremountErrors ? mountTimestamp.current : undefined\n  );\n\n  return (\n    <Stack data-ui-id=\"error-bar-stack\">\n      {toShow.map((error) => (\n        <MessageBar\n          {...props}\n          styles={{\n            innerText: {\n              alignSelf: 'center'\n            },\n            icon: {\n              height: 0\n            },\n            content: {\n              lineHeight: 'inherit'\n            },\n            dismissal: {\n              height: 0,\n              paddingTop: '0.8rem'\n            }\n          }}\n          key={error.type}\n          messageBarType={messageBarType(error.type)}\n          messageBarIconProps={messageBarIconProps(error.type)}\n          onDismiss={() => setDismissedErrors(dismissError(dismissedErrors, error))}\n          dismissButtonAriaLabel={strings.dismissButtonAriaLabel}\n          dismissIconProps={{ iconName: 'ErrorBarClear' }}\n        >\n          {strings[error.type]}\n        </MessageBar>\n      ))}\n    </Stack>\n  );\n};\n"]}

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

@@ -26,12 +26,20 @@ const screenshareButtonStyles = (theme) => ({
     rootChecked: {
         background: theme.palette.themePrimary,
         color: DefaultPalette.white,
-        ':focus::after': { outlineColor: `${DefaultPalette.white} !important` } // added !important to avoid override by FluentUI button styles
+        ':focus::after': { outlineColor: `${DefaultPalette.white} !important` },
+        '@media (forced-colors: active)': {
+            border: '1px solid',
+            borderColor: theme.palette.black
+        }
     },
     rootCheckedHovered: {
         background: theme.palette.themePrimary,
         color: DefaultPalette.white,
-        ':focus::after': { outlineColor: `${DefaultPalette.white} !important` } // added !important to avoid override by FluentUI button styles
+        ':focus::after': { outlineColor: `${DefaultPalette.white} !important` },
+        '@media (forced-colors: active)': {
+            border: '1px solid',
+            borderColor: theme.palette.black
+        }
     },
     labelChecked: { color: DefaultPalette.white }
 });

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

@@ -1 +1 @@
-{"version":3,"file":"ScreenShareButton.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ScreenShareButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAyB,MAAM,oBAAoB,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAiB,WAAW,EAAS,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC9F,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAsCjE;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAe,EAAE;;IAC9E,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,iBAAiB,CAAC;IAC5D,MAAM,OAAO,mCAAQ,aAAa,GAAK,KAAK,CAAC,OAAO,CAAE,CAAC;IAEvD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAAG,uBAAuB,CAAC,KAAK,CAAC,CAAC;IAE9C,MAAM,yBAAyB,GAAG,GAAgB,EAAE,CAAC,CACnD,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAC,8BAA8B,GAAG,CAC7F,CAAC;IACF,MAAM,0BAA0B,GAAG,GAAgB,EAAE,CAAC,CACpD,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAC,+BAA+B,GAAG,CAC9F,CAAC;IAEF,OAAO,CACL,oBAAC,gBAAgB,oBACX,KAAK,IACT,SAAS,EAAE,WAAW,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAC5C,OAAO,EAAE,MAAA,KAAK,CAAC,mBAAmB,mCAAI,KAAK,CAAC,OAAO,EACnD,cAAc,EAAE,MAAA,KAAK,CAAC,cAAc,mCAAI,yBAAyB,EACjE,eAAe,EAAE,MAAA,KAAK,CAAC,eAAe,mCAAI,0BAA0B,EACpE,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,MAAA,KAAK,CAAC,QAAQ,mCAAI,wBAAwB,EACpD,QAAQ,EAAE,KAAK,CAAC,QAAQ,IACxB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,uBAAuB,GAAG,CAAC,KAAY,EAAiB,EAAE,CAAC,CAAC;IAChE,WAAW,EAAE;QACX,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;QACtC,KAAK,EAAE,cAAc,CAAC,KAAK;QAC3B,eAAe,EAAE,EAAE,YAAY,EAAE,GAAG,cAAc,CAAC,KAAK,aAAa,EAAE,CAAC,+DAA+D;KACxI;IACD,kBAAkB,EAAE;QAClB,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;QACtC,KAAK,EAAE,cAAc,CAAC,KAAK;QAC3B,eAAe,EAAE,EAAE,YAAY,EAAE,GAAG,cAAc,CAAC,KAAK,aAAa,EAAE,CAAC,+DAA+D;KACxI;IACD,YAAY,EAAE,EAAE,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE;CAC9C,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React from 'react';\nimport { useLocale } from '../localization';\nimport { ControlBarButton, ControlBarButtonProps } from './ControlBarButton';\nimport { DefaultPalette, IButtonStyles, mergeStyles, Theme, useTheme } from '@fluentui/react';\nimport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\n\n/**\n * Strings of {@link ScreenShareButton} that can be overridden.\n *\n * @public\n */\nexport interface ScreenShareButtonStrings {\n  /** Label when button is on. */\n  onLabel: string;\n  /** Label when button is off. */\n  offLabel: string;\n  /** * Tooltip content when the button is disabled. */\n  tooltipDisabledContent?: string;\n  /** Tooltip content when the button is on. */\n  tooltipOnContent?: string;\n  /** Tooltip content when the button is off. */\n  tooltipOffContent?: string;\n}\n\n/**\n * Props for {@link ScreenShareButton}.\n *\n * @public\n */\nexport interface ScreenShareButtonProps extends ControlBarButtonProps {\n  /**\n   * Utility property for using this component with `communication react eventHandlers`.\n   * Maps directly to the `onClick` property.\n   */\n  onToggleScreenShare?: () => Promise<void>;\n\n  /**\n   * Optional strings to override in component\n   */\n  strings?: Partial<ScreenShareButtonStrings>;\n}\n\n/**\n * A button to start / stop screen sharing.\n *\n * Can be used with {@link ControlBar}.\n *\n * @public\n */\nexport const ScreenShareButton = (props: ScreenShareButtonProps): JSX.Element => {\n  const localeStrings = useLocale().strings.screenShareButton;\n  const strings = { ...localeStrings, ...props.strings };\n\n  const theme = useTheme();\n  const styles = screenshareButtonStyles(theme);\n\n  const onRenderScreenShareOnIcon = (): JSX.Element => (\n    <_HighContrastAwareIcon disabled={props.disabled} iconName=\"ControlButtonScreenShareStop\" />\n  );\n  const onRenderScreenShareOffIcon = (): JSX.Element => (\n    <_HighContrastAwareIcon disabled={props.disabled} iconName=\"ControlButtonScreenShareStart\" />\n  );\n\n  return (\n    <ControlBarButton\n      {...props}\n      className={mergeStyles(styles, props.styles)}\n      onClick={props.onToggleScreenShare ?? props.onClick}\n      onRenderOnIcon={props.onRenderOnIcon ?? onRenderScreenShareOnIcon}\n      onRenderOffIcon={props.onRenderOffIcon ?? onRenderScreenShareOffIcon}\n      strings={strings}\n      labelKey={props.labelKey ?? 'screenShareButtonLabel'}\n      disabled={props.disabled}\n    />\n  );\n};\n\nconst screenshareButtonStyles = (theme: Theme): IButtonStyles => ({\n  rootChecked: {\n    background: theme.palette.themePrimary,\n    color: DefaultPalette.white,\n    ':focus::after': { outlineColor: `${DefaultPalette.white} !important` } // added !important to avoid override by FluentUI button styles\n  },\n  rootCheckedHovered: {\n    background: theme.palette.themePrimary,\n    color: DefaultPalette.white,\n    ':focus::after': { outlineColor: `${DefaultPalette.white} !important` } // added !important to avoid override by FluentUI button styles\n  },\n  labelChecked: { color: DefaultPalette.white }\n});\n"]}
+{"version":3,"file":"ScreenShareButton.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ScreenShareButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAyB,MAAM,oBAAoB,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAiB,WAAW,EAAS,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC9F,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAsCjE;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAe,EAAE;;IAC9E,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,iBAAiB,CAAC;IAC5D,MAAM,OAAO,mCAAQ,aAAa,GAAK,KAAK,CAAC,OAAO,CAAE,CAAC;IAEvD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAAG,uBAAuB,CAAC,KAAK,CAAC,CAAC;IAE9C,MAAM,yBAAyB,GAAG,GAAgB,EAAE,CAAC,CACnD,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAC,8BAA8B,GAAG,CAC7F,CAAC;IACF,MAAM,0BAA0B,GAAG,GAAgB,EAAE,CAAC,CACpD,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAC,+BAA+B,GAAG,CAC9F,CAAC;IAEF,OAAO,CACL,oBAAC,gBAAgB,oBACX,KAAK,IACT,SAAS,EAAE,WAAW,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAC5C,OAAO,EAAE,MAAA,KAAK,CAAC,mBAAmB,mCAAI,KAAK,CAAC,OAAO,EACnD,cAAc,EAAE,MAAA,KAAK,CAAC,cAAc,mCAAI,yBAAyB,EACjE,eAAe,EAAE,MAAA,KAAK,CAAC,eAAe,mCAAI,0BAA0B,EACpE,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,MAAA,KAAK,CAAC,QAAQ,mCAAI,wBAAwB,EACpD,QAAQ,EAAE,KAAK,CAAC,QAAQ,IACxB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,uBAAuB,GAAG,CAAC,KAAY,EAAiB,EAAE,CAAC,CAAC;IAChE,WAAW,EAAE;QACX,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;QACtC,KAAK,EAAE,cAAc,CAAC,KAAK;QAC3B,eAAe,EAAE,EAAE,YAAY,EAAE,GAAG,cAAc,CAAC,KAAK,aAAa,EAAE;QACvE,gCAAgC,EAAE;YAChC,MAAM,EAAE,WAAW;YACnB,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;SACjC;KACF;IACD,kBAAkB,EAAE;QAClB,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;QACtC,KAAK,EAAE,cAAc,CAAC,KAAK;QAC3B,eAAe,EAAE,EAAE,YAAY,EAAE,GAAG,cAAc,CAAC,KAAK,aAAa,EAAE;QACvE,gCAAgC,EAAE;YAChC,MAAM,EAAE,WAAW;YACnB,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;SACjC;KACF;IACD,YAAY,EAAE,EAAE,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE;CAC9C,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React from 'react';\nimport { useLocale } from '../localization';\nimport { ControlBarButton, ControlBarButtonProps } from './ControlBarButton';\nimport { DefaultPalette, IButtonStyles, mergeStyles, Theme, useTheme } from '@fluentui/react';\nimport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\n\n/**\n * Strings of {@link ScreenShareButton} that can be overridden.\n *\n * @public\n */\nexport interface ScreenShareButtonStrings {\n  /** Label when button is on. */\n  onLabel: string;\n  /** Label when button is off. */\n  offLabel: string;\n  /** * Tooltip content when the button is disabled. */\n  tooltipDisabledContent?: string;\n  /** Tooltip content when the button is on. */\n  tooltipOnContent?: string;\n  /** Tooltip content when the button is off. */\n  tooltipOffContent?: string;\n}\n\n/**\n * Props for {@link ScreenShareButton}.\n *\n * @public\n */\nexport interface ScreenShareButtonProps extends ControlBarButtonProps {\n  /**\n   * Utility property for using this component with `communication react eventHandlers`.\n   * Maps directly to the `onClick` property.\n   */\n  onToggleScreenShare?: () => Promise<void>;\n\n  /**\n   * Optional strings to override in component\n   */\n  strings?: Partial<ScreenShareButtonStrings>;\n}\n\n/**\n * A button to start / stop screen sharing.\n *\n * Can be used with {@link ControlBar}.\n *\n * @public\n */\nexport const ScreenShareButton = (props: ScreenShareButtonProps): JSX.Element => {\n  const localeStrings = useLocale().strings.screenShareButton;\n  const strings = { ...localeStrings, ...props.strings };\n\n  const theme = useTheme();\n  const styles = screenshareButtonStyles(theme);\n\n  const onRenderScreenShareOnIcon = (): JSX.Element => (\n    <_HighContrastAwareIcon disabled={props.disabled} iconName=\"ControlButtonScreenShareStop\" />\n  );\n  const onRenderScreenShareOffIcon = (): JSX.Element => (\n    <_HighContrastAwareIcon disabled={props.disabled} iconName=\"ControlButtonScreenShareStart\" />\n  );\n\n  return (\n    <ControlBarButton\n      {...props}\n      className={mergeStyles(styles, props.styles)}\n      onClick={props.onToggleScreenShare ?? props.onClick}\n      onRenderOnIcon={props.onRenderOnIcon ?? onRenderScreenShareOnIcon}\n      onRenderOffIcon={props.onRenderOffIcon ?? onRenderScreenShareOffIcon}\n      strings={strings}\n      labelKey={props.labelKey ?? 'screenShareButtonLabel'}\n      disabled={props.disabled}\n    />\n  );\n};\n\nconst screenshareButtonStyles = (theme: Theme): IButtonStyles => ({\n  rootChecked: {\n    background: theme.palette.themePrimary,\n    color: DefaultPalette.white,\n    ':focus::after': { outlineColor: `${DefaultPalette.white} !important` }, // added !important to avoid override by FluentUI button styles\n    '@media (forced-colors: active)': {\n      border: '1px solid',\n      borderColor: theme.palette.black\n    }\n  },\n  rootCheckedHovered: {\n    background: theme.palette.themePrimary,\n    color: DefaultPalette.white,\n    ':focus::after': { outlineColor: `${DefaultPalette.white} !important` }, // added !important to avoid override by FluentUI button styles\n    '@media (forced-colors: active)': {\n      border: '1px solid',\n      borderColor: theme.palette.black\n    }\n  },\n  labelChecked: { color: DefaultPalette.white }\n});\n"]}

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

@@ -10,6 +10,10 @@ export declare const displayNameClassName: string;
  * @private
  */
 export declare const captionClassName: string;
+/**
+ * @private
+ */
+export declare const captionsContainerClassName: string;
 /**
  * @private
  */

package/dist/dist-esm/react-components/src/components/styles/Captions.style.js

@@ -2,6 +2,7 @@
 // Licensed under the MIT license.
 import { mergeStyles } from '@fluentui/react';
 import { _pxToRem } from "../../../../acs-ui-common/src";
+import { scrollbarStyles } from './Common.style';
 /**
  * @private
  */
@@ -24,6 +25,13 @@ export const captionClassName = mergeStyles({
     fontSize: _pxToRem(16),
     lineHeight: _pxToRem(22)
 });
+/**
+ * @private
+ */
+export const captionsContainerClassName = mergeStyles({
+    margin: 0,
+    padding: 0
+});
 /**
  * @private
  */
@@ -35,11 +43,7 @@ export const captionContainerClassName = mergeStyles({
 /**
  * @private
  */
-export const captionsBannerClassName = mergeStyles({
-    height: _pxToRem(100),
-    overflowY: 'auto',
-    overflowX: 'hidden'
-});
+export const captionsBannerClassName = mergeStyles(Object.assign({ height: _pxToRem(100), overflowY: 'auto', overflowX: 'hidden' }, scrollbarStyles));
 /**
  * @private
  */

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

@@ -1 +1 @@
-{"version":3,"file":"Captions.style.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/Captions.style.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,sCAAgC;AAEnD;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,WAAW,CAAC;IACvC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;CACzB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,WAAW,CAAC;IAC9C,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,gBAAgB,GAAG,WAAW,CAAC;IAC1C,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,yBAAyB,GAAG,WAAW,CAAC;IACnD,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;IACtB,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;IACzB,cAAc,EAAE,MAAM;CACvB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,WAAW,CAAC;IACjD,MAAM,EAAE,QAAQ,CAAC,GAAG,CAAC;IACrB,SAAS,EAAE,MAAM;IACjB,SAAS,EAAE,QAAQ;CACpB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,iCAAiC,GAAG,WAAW,CAAC;IAC3D,QAAQ,EAAE,CAAC;CACZ,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,WAAW,CAAC;IACvD,QAAQ,EAAE,QAAQ;IAClB,YAAY,EAAE,UAAU;CACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { mergeStyles } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/**\n * @private\n */\nexport const iconClassName = mergeStyles({\n  marginRight: _pxToRem(8)\n});\n\n/**\n * @private\n */\nexport const displayNameClassName = mergeStyles({\n  fontWeight: 400,\n  fontSize: _pxToRem(12),\n  lineHeight: _pxToRem(16)\n});\n\n/**\n * @private\n */\nexport const captionClassName = mergeStyles({\n  fontWeight: 400,\n  fontSize: _pxToRem(16),\n  lineHeight: _pxToRem(22)\n});\n\n/**\n * @private\n */\nexport const captionContainerClassName = mergeStyles({\n  marginTop: _pxToRem(6),\n  marginBottom: _pxToRem(6),\n  overflowAnchor: 'none'\n});\n\n/**\n * @private\n */\nexport const captionsBannerClassName = mergeStyles({\n  height: _pxToRem(100),\n  overflowY: 'auto',\n  overflowX: 'hidden'\n});\n\n/**\n * @private\n */\nexport const captionsContentContainerClassName = mergeStyles({\n  minWidth: 0\n});\n\n/**\n * @private\n */\nexport const displayNameContainerClassName = mergeStyles({\n  overflow: 'hidden',\n  textOverflow: 'ellipsis'\n});\n\"../../../../acs-ui-common/src\""]}
+{"version":3,"file":"Captions.style.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/Captions.style.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,sCAAgC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjD;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,WAAW,CAAC;IACvC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC;CACzB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,WAAW,CAAC;IAC9C,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,gBAAgB,GAAG,WAAW,CAAC;IAC1C,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,0BAA0B,GAAG,WAAW,CAAC;IACpD,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC;CACX,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,WAAW,CAAC;IACnD,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;IACtB,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;IACzB,cAAc,EAAE,MAAM;CACvB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,WAAW,iBAChD,MAAM,EAAE,QAAQ,CAAC,GAAG,CAAC,EACrB,SAAS,EAAE,MAAM,EACjB,SAAS,EAAE,QAAQ,IAChB,eAAe,EAClB,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,iCAAiC,GAAG,WAAW,CAAC;IAC3D,QAAQ,EAAE,CAAC;CACZ,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,WAAW,CAAC;IACvD,QAAQ,EAAE,QAAQ;IAClB,YAAY,EAAE,UAAU;CACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { mergeStyles } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { scrollbarStyles } from './Common.style';\n\n/**\n * @private\n */\nexport const iconClassName = mergeStyles({\n  marginRight: _pxToRem(8)\n});\n\n/**\n * @private\n */\nexport const displayNameClassName = mergeStyles({\n  fontWeight: 400,\n  fontSize: _pxToRem(12),\n  lineHeight: _pxToRem(16)\n});\n\n/**\n * @private\n */\nexport const captionClassName = mergeStyles({\n  fontWeight: 400,\n  fontSize: _pxToRem(16),\n  lineHeight: _pxToRem(22)\n});\n\n/**\n * @private\n */\nexport const captionsContainerClassName = mergeStyles({\n  margin: 0,\n  padding: 0\n});\n\n/**\n * @private\n */\nexport const captionContainerClassName = mergeStyles({\n  marginTop: _pxToRem(6),\n  marginBottom: _pxToRem(6),\n  overflowAnchor: 'none'\n});\n\n/**\n * @private\n */\nexport const captionsBannerClassName = mergeStyles({\n  height: _pxToRem(100),\n  overflowY: 'auto',\n  overflowX: 'hidden',\n  ...scrollbarStyles\n});\n\n/**\n * @private\n */\nexport const captionsContentContainerClassName = mergeStyles({\n  minWidth: 0\n});\n\n/**\n * @private\n */\nexport const displayNameContainerClassName = mergeStyles({\n  overflow: 'hidden',\n  textOverflow: 'ellipsis'\n});\n\"../../../../acs-ui-common/src\""]}

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

@@ -2,6 +2,7 @@
 // Licensed under the MIT license.
 import { mergeStyles } from '@fluentui/react';
 import { _pxToRem } from "../../../../acs-ui-common/src";
+import { scrollbarStyles } from './Common.style';
 /**
  * @private
  */
@@ -80,6 +81,6 @@ export const buttonStyles = (theme) => {
  * @private
  */
 export const dropdownStyles = {
-    callout: { height: _pxToRem(300), overflow: 'auto' }
+    callout: Object.assign({ height: _pxToRem(300), overflow: 'auto' }, scrollbarStyles)
 };
 //# sourceMappingURL=CaptionsSettingsModal.styles.js.map

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,QAAQ,CAAC,GAAG,CAAC;QACrB,QAAQ,EAAE,QAAQ;KACnB;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,aAAa,EAAE,QAAQ,CAAC,EAAE,CAAC;IAC3B,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;CACtC,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,EAAE,MAAM,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE;CACrD,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: _pxToRem(268),\n    overflow: 'hidden'\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  paddingBottom: _pxToRem(16),\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  });\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: { height: _pxToRem(300), overflow: 'auto' }\n};\n\"../../../../acs-ui-common/src\""]}
+{"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;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjD;;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,QAAQ,CAAC,GAAG,CAAC;QACrB,QAAQ,EAAE,QAAQ;KACnB;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,aAAa,EAAE,QAAQ,CAAC,EAAE,CAAC;IAC3B,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;CACtC,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,kBACL,MAAM,EAAE,QAAQ,CAAC,GAAG,CAAC,EACrB,QAAQ,EAAE,MAAM,IACb,eAAe,CACnB;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';\nimport { scrollbarStyles } from './Common.style';\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: _pxToRem(268),\n    overflow: 'hidden'\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  paddingBottom: _pxToRem(16),\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  });\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    ...scrollbarStyles\n  }\n};\n\"../../../../acs-ui-common/src\""]}

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

@@ -0,0 +1,14 @@
+/**
+ * @private
+ */
+export declare const scrollbarStyles: {
+    '::-webkit-scrollbar, *::-webkit-scrollbar': {
+        width: string;
+        height: string;
+    };
+    '::-webkit-scrollbar-thumb, *::-webkit-scrollbar-thumb': {
+        borderRadius: string;
+        background: string;
+    };
+};
+//# sourceMappingURL=Common.style.d.ts.map

package/dist/dist-esm/react-components/src/components/styles/Common.style.js

@@ -0,0 +1,16 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+/**
+ * @private
+ */
+export const scrollbarStyles = {
+    '::-webkit-scrollbar, *::-webkit-scrollbar': {
+        width: '0.3rem',
+        height: '0.3rem'
+    },
+    '::-webkit-scrollbar-thumb, *::-webkit-scrollbar-thumb': {
+        borderRadius: '10px',
+        background: 'rgba(150, 150, 150)'
+    }
+};
+//# sourceMappingURL=Common.style.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Common.style.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/Common.style.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,2CAA2C,EAAE;QAC3C,KAAK,EAAE,QAAQ;QACf,MAAM,EAAE,QAAQ;KACjB;IACD,uDAAuD,EAAE;QACvD,YAAY,EAAE,MAAM;QACpB,UAAU,EAAE,qBAAqB;KAClC;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\n/**\n * @private\n */\nexport const scrollbarStyles = {\n  '::-webkit-scrollbar, *::-webkit-scrollbar': {\n    width: '0.3rem',\n    height: '0.3rem'\n  },\n  '::-webkit-scrollbar-thumb, *::-webkit-scrollbar-thumb': {\n    borderRadius: '10px',\n    background: 'rgba(150, 150, 150)'\n  }\n};\n"]}