npm - @azure/communication-react - Versions diffs - 1.23.0-alpha-202501160016 → 1.23.0 - Mend

@azure/communication-react 1.23.0-alpha-202501160016 → 1.23.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1311) hide show

package/dist/dist-esm/react-components/src/components/Survey/SurveyTypes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SurveyTypes.js","sourceRoot":"","sources":["~~../../../../../../../~~react-components/src/components/Survey/SurveyTypes.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/*\n \n * Represents a call survey rating.\n \n @internal\n /\nexport declare interface _CallRating<TIssue extends _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue> {\n /\n The rating value should follow rating scale.\n /\n score: number;\n /\n Call rating type with issues.\n /\n issues?: TIssue[];\n /\n Rating scale default 1-5 rating\n /\n scale?: _RatingScale;\n}\n\n/\n Represents the end of call survey.\n * @internal\n /\nexport declare interface _CallSurvey {\n /\n Overall call rating with optional overall issues\n /\n overallRating?: _CallRating<_OverallIssue>;\n /\n Audio rating with optional audio issues\n /\n audioRating?: _CallRating<_AudioIssue>;\n /\n Video rating with optional video issues\n /\n videoRating?: _CallRating<_VideoIssue>;\n /\n Screenshare rating with optional screenshare issues\n /\n screenshareRating?: _CallRating<_ScreenshareIssue>;\n}\n\n/\n Represents the end of call survey response.\n * @internal\n /\nexport declare interface _CallSurveyResponse extends _CallSurvey {\n /\n Uniquely identify the call survey\n /\n readonly id: string;\n /\n Uniquely identify the call being served\n /\n readonly callId: string;\n /\n The participant submitting the survey\n /\n readonly localParticipantId: string;\n}\n\n/\n Represents the end of call survey call issues.\n * @example\n * CallCannotJoin - participant is unable to join the call.\n * CallCannotInvite - participant is unable to add another participant in the call.\n * HadToRejoin - participant rejoined the call due the call quality issue.\n * CallEndedUnexpectedly - when the call ended unexpectedly.\n * OtherIssues - any other overall call issue not listed here.\n \n @internal\n \n /\nexport declare type _OverallIssue ~~=\n \|~~ 'CallCannotJoin'\n \| 'CallCannotInvite'\n \| 'HadToRejoin'\n \| 'CallEndedUnexpectedly'\n \| 'OtherIssues';\n\n/*\n Represents the end of call survey audio issues.\n * @example\n * NoLocalAudio - other participants unable to hear me.\n * NoRemoteAudio - participant unable to hear another participant's audio.\n * Echo - heard echo.\n * AudioNoise - heard audio noise.\n * LowVolume - call audio volume was low.\n * AudioStoppedUnexpectedly - call audio stopped unexpectedly.\n * DistortedSpeech - audio was distorted.\n * AudioInterruption - audio was interrupted.\n * OtherIssues - any other audio issue not listed here.\n \n @internal\n \n /\nexport declare type _AudioIssue ~~=\n \|~~ 'NoLocalAudio'\n \| 'NoRemoteAudio'\n \| 'Echo'\n \| 'AudioNoise'\n \| 'LowVolume'\n \| 'AudioStoppedUnexpectedly'\n \| 'DistortedSpeech'\n \| 'AudioInterruption'\n \| 'OtherIssues';\n\n/*\n Represents the end of call survey screenshare issues.\n * @example\n * NoContentLocal - other participants unable to see my screen.\n * NoContentRemote - participant unable to saw another participant's screen share.\n * CannotPresent - participant was unable to share the screen.\n * LowQuality - screen share video quality was low.\n * Freezes - screen share freezes.\n * StoppedUnexpectedly - screen share stopped unexpectedly.\n * LargeDelay - watch screen share having large delay.\n * OtherIssues - any other screen share issue not listed here.\n \n @internal\n \n /\nexport declare type _ScreenshareIssue ~~=\n \|~~ 'NoContentLocal'\n \| 'NoContentRemote'\n \| 'CannotPresent'\n \| 'LowQuality'\n \| 'Freezes'\n \| 'StoppedUnexpectedly'\n \| 'LargeDelay'\n \| 'OtherIssues';\n\n/*\n Represents the end of call survey video issues.\n * @example\n * NoVideoReceived - participant unable to saw another participant's video.\n * NoVideoSent - other participants unable to see me.\n * LowQuality - video quality was low.\n * Freezes - video freezes.\n * StoppedUnexpectedly - video stopped unexpectedly.\n * DarkVideoReceived - participant receives dark video.\n * AudioVideoOutOfSync - participant watch video and audio out of sync.\n * OtherIssues - any other video issue not listed here.\n \n @internal\n \n /\nexport declare type _VideoIssue ~~=\n \|~~ 'NoVideoReceived'\n \| 'NoVideoSent'\n \| 'LowQuality'\n \| 'Freezes'\n \| 'StoppedUnexpectedly'\n \| 'DarkVideoReceived'\n \| 'AudioVideoOutOfSync'\n \| 'OtherIssues';\n\n/*\n Rating scale to override the default scale\n * @internal\n /\nexport declare interface _RatingScale {\n /\n Lower bound of the rating value 0 to 100 (default 1)\n /\n lowerBound: number;\n /\n Upper bound of the rating value 0 to 100 (default 5)\n /\n upperBound: number;\n /\n The rating value greater than the threshold will be considered as good\n */\n lowScoreThreshold: number;\n}\n"]}
1	+ {"version":3,"file":"SurveyTypes.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/Survey/SurveyTypes.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/*\n \n * Represents a call survey rating.\n \n @internal\n /\nexport declare interface _CallRating<TIssue extends _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue> {\n /\n The rating value should follow rating scale.\n /\n score: number;\n /\n Call rating type with issues.\n /\n issues?: TIssue[];\n /\n Rating scale default 1-5 rating\n /\n scale?: _RatingScale;\n}\n\n/\n Represents the end of call survey.\n * @internal\n /\nexport declare interface _CallSurvey {\n /\n Overall call rating with optional overall issues\n /\n overallRating?: _CallRating<_OverallIssue>;\n /\n Audio rating with optional audio issues\n /\n audioRating?: _CallRating<_AudioIssue>;\n /\n Video rating with optional video issues\n /\n videoRating?: _CallRating<_VideoIssue>;\n /\n Screenshare rating with optional screenshare issues\n /\n screenshareRating?: _CallRating<_ScreenshareIssue>;\n}\n\n/\n Represents the end of call survey response.\n * @internal\n /\nexport declare interface _CallSurveyResponse extends _CallSurvey {\n /\n Uniquely identify the call survey\n /\n readonly id: string;\n /\n Uniquely identify the call being served\n /\n readonly callId: string;\n /\n The participant submitting the survey\n /\n readonly localParticipantId: string;\n}\n\n/\n Represents the end of call survey call issues.\n * @example\n * CallCannotJoin - participant is unable to join the call.\n * CallCannotInvite - participant is unable to add another participant in the call.\n * HadToRejoin - participant rejoined the call due the call quality issue.\n * CallEndedUnexpectedly - when the call ended unexpectedly.\n * OtherIssues - any other overall call issue not listed here.\n \n @internal\n \n /\nexport declare type _OverallIssue = 'CallCannotJoin' \| 'CallCannotInvite' \| 'HadToRejoin' \| 'CallEndedUnexpectedly' \| 'OtherIssues';\n\n/*\n Represents the end of call survey audio issues.\n * @example\n * NoLocalAudio - other participants unable to hear me.\n * NoRemoteAudio - participant unable to hear another participant's audio.\n * Echo - heard echo.\n * AudioNoise - heard audio noise.\n * LowVolume - call audio volume was low.\n * AudioStoppedUnexpectedly - call audio stopped unexpectedly.\n * DistortedSpeech - audio was distorted.\n * AudioInterruption - audio was interrupted.\n * OtherIssues - any other audio issue not listed here.\n \n @internal\n \n /\nexport declare type _AudioIssue = 'NoLocalAudio' \| 'NoRemoteAudio' \| 'Echo' \| 'AudioNoise' \| 'LowVolume' \| 'AudioStoppedUnexpectedly' \| 'DistortedSpeech' \| 'AudioInterruption' \| 'OtherIssues';\n\n/*\n Represents the end of call survey screenshare issues.\n * @example\n * NoContentLocal - other participants unable to see my screen.\n * NoContentRemote - participant unable to saw another participant's screen share.\n * CannotPresent - participant was unable to share the screen.\n * LowQuality - screen share video quality was low.\n * Freezes - screen share freezes.\n * StoppedUnexpectedly - screen share stopped unexpectedly.\n * LargeDelay - watch screen share having large delay.\n * OtherIssues - any other screen share issue not listed here.\n \n @internal\n \n /\nexport declare type _ScreenshareIssue = 'NoContentLocal' \| 'NoContentRemote' \| 'CannotPresent' \| 'LowQuality' \| 'Freezes' \| 'StoppedUnexpectedly' \| 'LargeDelay' \| 'OtherIssues';\n\n/*\n Represents the end of call survey video issues.\n * @example\n * NoVideoReceived - participant unable to saw another participant's video.\n * NoVideoSent - other participants unable to see me.\n * LowQuality - video quality was low.\n * Freezes - video freezes.\n * StoppedUnexpectedly - video stopped unexpectedly.\n * DarkVideoReceived - participant receives dark video.\n * AudioVideoOutOfSync - participant watch video and audio out of sync.\n * OtherIssues - any other video issue not listed here.\n \n @internal\n \n /\nexport declare type _VideoIssue = 'NoVideoReceived' \| 'NoVideoSent' \| 'LowQuality' \| 'Freezes' \| 'StoppedUnexpectedly' \| 'DarkVideoReceived' \| 'AudioVideoOutOfSync' \| 'OtherIssues';\n\n/*\n Rating scale to override the default scale\n * @internal\n /\nexport declare interface _RatingScale {\n /\n Lower bound of the rating value 0 to 100 (default 1)\n /\n lowerBound: number;\n /\n Upper bound of the rating value 0 to 100 (default 5)\n /\n upperBound: number;\n /\n The rating value greater than the threshold will be considered as good\n */\n lowScoreThreshold: number;\n}"]}

package/dist/dist-esm/react-components/src/components/Survey/TagsSurvey/TagsSurvey.js CHANGED Viewed

@@ -25,9 +25,9 @@ export const _TagsSurvey = (props) => {
             videoRating: [],
             screenshareRating: []
         };
-        _getKeys(callIssuesToTag).forEach((issueCategory) => {
-            _getKeys(callIssuesToTag[issueCategory]).map((issue) => {
-                const issueCapitalized = ((issue === null || issue === void 0 ? void 0 : issue.charAt(0).toUpperCase()) + (issue === null || issue === void 0 ? void 0 : issue.slice(1)));
+        _getKeys(callIssuesToTag).forEach(issueCategory => {
+            _getKeys(callIssuesToTag[issueCategory]).map(issue => {
+                const issueCapitalized = (issue === null || issue === void 0 ? void 0 : issue.charAt(0).toUpperCase()) + (issue === null || issue === void 0 ? void 0 : issue.slice(1));
                 const issueMessages = callIssuesToTag[issueCategory];
                 if (tags[issueCategory]) {
                     tags[issueCategory].push({
@@ -36,12 +36,10 @@ export const _TagsSurvey = (props) => {
                     });
                 }
                 else {
-                    tags[issueCategory] = [
-                        {
+                    tags[issueCategory] = [{
                             message: issueMessages[issue],
                             issue: issueCapitalized
-                        }
-                    ];
+                        }];
                 }
             });
         });
@@ -50,20 +48,22 @@ export const _TagsSurvey = (props) => {
     const onChange = React.useCallback((issueCategory, checked, issue) => {
         if (checked) {
             if (issue) {
-                setSelectedTags((prevState) => {
+                setSelectedTags(prevState => {
                     const category = prevState === null || prevState === void 0 ? void 0 : prevState[issueCategory];
                     if (category && category.issues) {
                         category.issues = [category.issues, issue];
                     }
                     else {
-                        prevState[issueCategory] = { issues: [issue] };
+                        prevState[issueCategory] = {
+                            issues: [issue]
+                        };
                     }
                     return prevState;
                 });
             }
             else {
                 setCheckedTextFields([...checkedTextFields, issueCategory]);
-                setSelectedTextResponse((prevState) => {
+                setSelectedTextResponse(prevState => {
                     prevState[issueCategory] = textResponse[issueCategory];
                     return prevState;
                 });
@@ -71,7 +71,7 @@ export const _TagsSurvey = (props) => {
         }
         else {
             if (issue) {
-                setSelectedTags((prevState) => {
+                setSelectedTags(prevState => {
                     var _a, _b;
                     // 'prevState[issueCategory]?.issues as ...' typing is required here to avoid a typescript limitation
                     // "This expression is not callable" caused by filter().
@@ -81,8 +81,8 @@ export const _TagsSurvey = (props) => {
                 });
             }
             else {
-                setCheckedTextFields(checkedTextFields.filter((id) => id !== issueCategory));
-                setSelectedTextResponse((prevState) => {
+                setCheckedTextFields(checkedTextFields.filter(id => id !== issueCategory));
+                setSelectedTextResponse(prevState => {
                     delete prevState[issueCategory];
                     return prevState;
                 });
@@ -91,40 +91,40 @@ export const _TagsSurvey = (props) => {
     }, [textResponse, checkedTextFields]);
     const theme = useTheme();
     const onRenderLabel = useCallback((issueCategory) => {
-        return (React.createElement(TextField, { key: issueCategory, className: freeFormTextFieldClassName, underlined: true, placeholder: strings === null || strings === void 0 ? void 0 : strings.tagsSurveyTextFieldDefaultText, onChange: (e, v) => {
+        return React.createElement(TextField, { key: issueCategory, className: freeFormTextFieldClassName, underlined: true, placeholder: strings === null || strings === void 0 ? void 0 : strings.tagsSurveyTextFieldDefaultText, onChange: (e, v) => {
                 if (v) {
                     setCheckedTextFields([...checkedTextFields, issueCategory]);
-                    setTextResponse((prevState) => {
+                    setTextResponse(prevState => {
                         prevState[issueCategory] = v;
                         return prevState;
                     });
-                    setSelectedTextResponse((prevState) => {
+                    setSelectedTextResponse(prevState => {
                         prevState[issueCategory] = v;
                         return prevState;
                     });
                 }
-            } }));
+            } });
     }, [strings === null || strings === void 0 ? void 0 : strings.tagsSurveyTextFieldDefaultText, checkedTextFields]);
     useEffect(() => {
         if (onConfirm) {
             onConfirm(selectedTags, selectedTextResponse);
         }
     }, [selectedTags, selectedTextResponse, onConfirm]);
-    return (React.createElement(React.Fragment, null,
+    return React.createElement(React.Fragment, null,
         React.createElement(Stack, { verticalAlign: "center" },
             React.createElement(Text, { className: questionTextStyle(theme) }, strings === null || strings === void 0 ? void 0 : strings.tagsSurveyQuestion)),
         React.createElement(Pivot, null, _getKeys(tags).map((key, i) => {
-            return (React.createElement(PivotItem, { key: `key-${i}`, headerText: categoryHeadings[key], headerButtonProps: {
+            return React.createElement(PivotItem, { key: `key-${i}`, headerText: categoryHeadings[key], headerButtonProps: {
                     'data-order': i,
                     'data-title': key
                 }, alwaysRender: true },
                 tags[key].map((t, i) => {
-                    return (React.createElement(Checkbox, { className: checkboxClassName, key: `checkBox_${i}`, label: t.message, onChange: (ev, checked) => onChange(key, checked !== null && checked !== void 0 ? checked : false, t.issue) }));
+                    return React.createElement(Checkbox, { className: checkboxClassName, key: `checkBox_${i}`, label: t.message, onChange: (ev, checked) => onChange(key, checked !== null && checked !== void 0 ? checked : false, t.issue) });
                 }),
-                showFreeFormTextField && (React.createElement(Checkbox, { checked: checkedTextFields.includes(key), styles: freeFormTextCheckboxStyles, onChange: (ev, checked) => onChange(key, checked !== null && checked !== void 0 ? checked : false), onRenderLabel: () => {
+                showFreeFormTextField && React.createElement(Checkbox, { checked: checkedTextFields.includes(key), styles: freeFormTextCheckboxStyles, onChange: (ev, checked) => onChange(key, checked !== null && checked !== void 0 ? checked : false), onRenderLabel: () => {
                         return onRenderLabel(key);
-                    } }))));
+                    } }));
         })),
-        React.createElement(Text, { className: helperTextStyle(theme) }, strings === null || strings === void 0 ? void 0 : strings.tagsSurveyHelperText)));
+        React.createElement(Text, { className: helperTextStyle(theme) }, strings === null || strings === void 0 ? void 0 : strings.tagsSurveyHelperText));
 };
 //# sourceMappingURL=TagsSurvey.js.map

package/dist/dist-esm/react-components/src/components/Survey/TagsSurvey/TagsSurvey.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TagsSurvey.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/Survey/TagsSurvey/TagsSurvey.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// Permit `any` in this file to handle the overloaded issue type. Todo: refactor CallSurvey to have PartialDeep<_CallSurvey> instead of any\n// for tracking incomplete survey responses.\n/* eslint-disable @typescript-eslint/no-explicit-any /\n\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { Text, useTheme, Stack, Checkbox, Pivot, PivotItem, TextField } from '@fluentui/react';\nimport { _formatString, _getKeys, _pxToRem } from '@internal/acs-ui-common';\nimport {\n checkboxClassName,\n questionTextStyle,\n helperTextStyle,\n freeFormTextFieldClassName,\n freeFormTextCheckboxStyles\n} from './TagsSurvey.styles';\nimport {\n _AudioIssue,\n _CallRating,\n _CallSurvey,\n _CallSurveyResponse,\n _OverallIssue,\n _ScreenshareIssue,\n _VideoIssue\n} from '../SurveyTypes';\nimport { SurveyIssuesHeadingStrings, SurveyIssues, CallSurveyImprovementSuggestions } from '../../../types';\n/\n Strings of {@link TagsSurvey} that can be overridden.\n \n @internal\n /\nexport interface _TagsSurveyStrings {\n /\n Survey question\n /\n tagsSurveyQuestion?: string;\n /\n Helper text for tag survey explaining what the survey is for\n /\n tagsSurveyHelperText?: string;\n /\n Default text for free form text field inside tags survey\n /\n tagsSurveyTextFieldDefaultText?: string;\n}\n\n/\n Survey Issue categories\n \n @internal\n /\nexport type _IssueCategory = 'overallRating' \| 'audioRating' \| 'videoRating' \| 'screenshareRating';\n\n/\n Key value pair of survey catogories and corresponding message/issue\n \n @internal\n /\nexport type _SurveyTag = Record<\n _IssueCategory,\n {\n message: string;\n issue: _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue;\n }[]\n>;\n\n/\n Props for {@link TagsSurvey} component.\n \n @internal\n /\nexport interface _TagsSurveyProps {\n /* Mappings from call issues to tags displayed on the survey/\n callIssuesToTag: SurveyIssues;\n /* Mappings from issue category to categories displayed on survey/\n categoryHeadings: SurveyIssuesHeadingStrings;\n /* Function to send TagsSurvey results/\n onConfirm?: (selectedTags: _CallSurvey, improvementSuggestions?: CallSurveyImprovementSuggestions) => void;\n /* show the text field for more info/\n showFreeFormTextField?: boolean;\n /* Tags survey strings /\n strings?: _TagsSurveyStrings;\n}\n\n/\n A component to allow users to send numerical ratings regarding call quality\n \n @internal\n */\nexport const _TagsSurvey = (props: _TagsSurveyProps): JSX.Element => {\n const { callIssuesToTag, categoryHeadings, onConfirm, strings, showFreeFormTextField } = props;\n\n const [selectedTags, setSelectedTags] = useState<_CallSurvey>({});\n\n const [textResponse, setTextResponse] = useState<CallSurveyImprovementSuggestions>({});\n\n const [selectedTextResponse, setSelectedTextResponse] = useState<CallSurveyImprovementSuggestions>({});\n\n const [checkedTextFields, setCheckedTextFields] = useState<_IssueCategory[]>([]);\n\n const tags: _SurveyTag = useMemo(() => {\n const tags: _SurveyTag = {\n overallRating: [],\n audioRating: [],\n videoRating: [],\n screenshareRating: []\n };\n _getKeys(callIssuesToTag).forEach((issueCategory) => {\n _getKeys(callIssuesToTag[issueCategory]).map((issue) => {\n const issueCapitalized = (issue?.charAt(0).toUpperCase() + issue?.slice(1)) as\n \| _AudioIssue\n \| _OverallIssue\n \| _ScreenshareIssue\n \| _VideoIssue;\n\n const issueMessages = callIssuesToTag[issueCategory];\n if (tags[issueCategory]) {\n tags[issueCategory].push({\n message: issueMessages[issue],\n issue: issueCapitalized\n });\n } else {\n tags[issueCategory] = [\n {\n message: issueMessages[issue],\n issue: issueCapitalized\n }\n ];\n }\n });\n });\n return tags;\n }, [callIssuesToTag]);\n\n const onChange = React.useCallback(\n (\n issueCategory: _IssueCategory,\n checked: boolean,\n issue?: _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue\n ): void => {\n if (checked) {\n if (issue) {\n setSelectedTags((prevState) => {\n const category = prevState?.[issueCategory];\n if (category && category.issues) {\n category.issues = [category.issues, issue] as any;\n } else {\n prevState[issueCategory] = { issues: [issue] } as any;\n }\n return prevState;\n });\n } else {\n setCheckedTextFields([...checkedTextFields, issueCategory]);\n setSelectedTextResponse((prevState) => {\n prevState[issueCategory] = textResponse[issueCategory];\n return prevState;\n });\n }\n } else {\n if (issue) {\n setSelectedTags((prevState) => {\n // 'prevState[issueCategory]?.issues as ...' typing is required here to avoid a typescript limitation\n // \"This expression is not callable\" caused by filter().\n // More information can be found here: https://github.com/microsoft/TypeScript/issues/44373\n const categoryIssues = (\n prevState[issueCategory]?.issues as (_AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue)[]\n )?.filter((value: _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue) => value !== issue);\n return {\n ...prevState,\n [issueCategory]: {\n ...(prevState[issueCategory] \|\| {}),\n issues: categoryIssues\n }\n };\n });\n } else {\n setCheckedTextFields(checkedTextFields.filter((id) => id !== issueCategory));\n setSelectedTextResponse((prevState) => {\n delete prevState[issueCategory];\n return prevState;\n });\n }\n }\n },\n [textResponse, checkedTextFields]\n );\n\n const theme = useTheme();\n\n const onRenderLabel = useCallback(\n (issueCategory: _IssueCategory) => {\n return (\n <TextField\n key={issueCategory}\n className={freeFormTextFieldClassName}\n underlined\n placeholder={strings?.tagsSurveyTextFieldDefaultText}\n onChange={(e, v) => {\n if (v) {\n setCheckedTextFields([...checkedTextFields, issueCategory]);\n setTextResponse((prevState) => {\n prevState[issueCategory] = v;\n return prevState;\n });\n\n setSelectedTextResponse((prevState) => {\n prevState[issueCategory] = v;\n return prevState;\n });\n }\n }}\n />\n );\n },\n [strings?.tagsSurveyTextFieldDefaultText, checkedTextFields]\n );\n\n useEffect(() => {\n if (onConfirm) {\n onConfirm(selectedTags, selectedTextResponse);\n }\n }, [selectedTags, selectedTextResponse, onConfirm]);\n\n return (\n <>\n <Stack verticalAlign=\"center\">\n <Text className={questionTextStyle(theme)}>{strings?.tagsSurveyQuestion}</Text>\n </Stack>\n\n <Pivot>\n {_getKeys(tags).map((key, i) => {\n return (\n <PivotItem\n key={`key-${i}`}\n headerText={categoryHeadings[key]} // Add index signature to allow indexing with a string\n headerButtonProps={{\n 'data-order': i,\n 'data-title': key\n }}\n alwaysRender\n >\n {tags[key].map((t, i) => {\n return (\n <Checkbox\n className={checkboxClassName}\n key={`checkBox_${i}`}\n label={t.message}\n onChange={(ev, checked) => onChange(key, checked ?? false, t.issue)}\n />\n );\n })}\n {showFreeFormTextField && (\n <Checkbox\n checked={checkedTextFields.includes(key)}\n styles={freeFormTextCheckboxStyles}\n onChange={(ev, checked) => onChange(key, checked ?? false)}\n onRenderLabel={() => {\n return onRenderLabel(key);\n }}\n />\n )}\n </PivotItem>\n );\n })}\n </Pivot>\n\n <Text className={helperTextStyle(theme)}>{strings?.tagsSurveyHelperText}</Text>\n </>\n );\n};\n"]}
1	+ {"version":3,"file":"TagsSurvey.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/Survey/TagsSurvey/TagsSurvey.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// Permit `any` in this file to handle the overloaded issue type. Todo: refactor CallSurvey to have PartialDeep<_CallSurvey> instead of any\n// for tracking incomplete survey responses.\n/* eslint-disable @typescript-eslint/no-explicit-any /\n\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { Text, useTheme, Stack, Checkbox, Pivot, PivotItem, TextField } from '@fluentui/react';\nimport { _formatString, _getKeys, _pxToRem } from '@internal/acs-ui-common';\nimport { checkboxClassName, questionTextStyle, helperTextStyle, freeFormTextFieldClassName, freeFormTextCheckboxStyles } from './TagsSurvey.styles';\nimport { _AudioIssue, _CallRating, _CallSurvey, _CallSurveyResponse, _OverallIssue, _ScreenshareIssue, _VideoIssue } from '../SurveyTypes';\nimport { SurveyIssuesHeadingStrings, SurveyIssues, CallSurveyImprovementSuggestions } from '../../../types';\n/\n Strings of {@link TagsSurvey} that can be overridden.\n \n @internal\n /\nexport interface _TagsSurveyStrings {\n /\n Survey question\n /\n tagsSurveyQuestion?: string;\n /\n Helper text for tag survey explaining what the survey is for\n /\n tagsSurveyHelperText?: string;\n /\n Default text for free form text field inside tags survey\n /\n tagsSurveyTextFieldDefaultText?: string;\n}\n\n/\n Survey Issue categories\n \n @internal\n /\nexport type _IssueCategory = 'overallRating' \| 'audioRating' \| 'videoRating' \| 'screenshareRating';\n\n/\n Key value pair of survey catogories and corresponding message/issue\n \n @internal\n /\nexport type _SurveyTag = Record<_IssueCategory, {\n message: string;\n issue: _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue;\n}[]>;\n\n/\n Props for {@link TagsSurvey} component.\n \n @internal\n /\nexport interface _TagsSurveyProps {\n /* Mappings from call issues to tags displayed on the survey/\n callIssuesToTag: SurveyIssues;\n /* Mappings from issue category to categories displayed on survey/\n categoryHeadings: SurveyIssuesHeadingStrings;\n /* Function to send TagsSurvey results/\n onConfirm?: (selectedTags: _CallSurvey, improvementSuggestions?: CallSurveyImprovementSuggestions) => void;\n /* show the text field for more info/\n showFreeFormTextField?: boolean;\n /* Tags survey strings /\n strings?: _TagsSurveyStrings;\n}\n\n/\n A component to allow users to send numerical ratings regarding call quality\n \n @internal\n */\nexport const _TagsSurvey = (props: _TagsSurveyProps): JSX.Element => {\n const {\n callIssuesToTag,\n categoryHeadings,\n onConfirm,\n strings,\n showFreeFormTextField\n } = props;\n const [selectedTags, setSelectedTags] = useState<_CallSurvey>({});\n const [textResponse, setTextResponse] = useState<CallSurveyImprovementSuggestions>({});\n const [selectedTextResponse, setSelectedTextResponse] = useState<CallSurveyImprovementSuggestions>({});\n const [checkedTextFields, setCheckedTextFields] = useState<_IssueCategory[]>([]);\n const tags: _SurveyTag = useMemo(() => {\n const tags: _SurveyTag = {\n overallRating: [],\n audioRating: [],\n videoRating: [],\n screenshareRating: []\n };\n _getKeys(callIssuesToTag).forEach(issueCategory => {\n _getKeys(callIssuesToTag[issueCategory]).map(issue => {\n const issueCapitalized = issue?.charAt(0).toUpperCase() + issue?.slice(1) as _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue;\n const issueMessages = callIssuesToTag[issueCategory];\n if (tags[issueCategory]) {\n tags[issueCategory].push({\n message: issueMessages[issue],\n issue: issueCapitalized\n });\n } else {\n tags[issueCategory] = [{\n message: issueMessages[issue],\n issue: issueCapitalized\n }];\n }\n });\n });\n return tags;\n }, [callIssuesToTag]);\n const onChange = React.useCallback((issueCategory: _IssueCategory, checked: boolean, issue?: _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue): void => {\n if (checked) {\n if (issue) {\n setSelectedTags(prevState => {\n const category = prevState?.[issueCategory];\n if (category && category.issues) {\n category.issues = [category.issues, issue] as any;\n } else {\n prevState[issueCategory] = {\n issues: [issue]\n } as any;\n }\n return prevState;\n });\n } else {\n setCheckedTextFields([...checkedTextFields, issueCategory]);\n setSelectedTextResponse(prevState => {\n prevState[issueCategory] = textResponse[issueCategory];\n return prevState;\n });\n }\n } else {\n if (issue) {\n setSelectedTags(prevState => {\n // 'prevState[issueCategory]?.issues as ...' typing is required here to avoid a typescript limitation\n // \"This expression is not callable\" caused by filter().\n // More information can be found here: https://github.com/microsoft/TypeScript/issues/44373\n const categoryIssues = (prevState[issueCategory]?.issues as (_AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue)[])?.filter((value: _AudioIssue \| _OverallIssue \| _ScreenshareIssue \| _VideoIssue) => value !== issue);\n return {\n ...prevState,\n [issueCategory]: {\n ...(prevState[issueCategory] \|\| {}),\n issues: categoryIssues\n }\n };\n });\n } else {\n setCheckedTextFields(checkedTextFields.filter(id => id !== issueCategory));\n setSelectedTextResponse(prevState => {\n delete prevState[issueCategory];\n return prevState;\n });\n }\n }\n }, [textResponse, checkedTextFields]);\n const theme = useTheme();\n const onRenderLabel = useCallback((issueCategory: _IssueCategory) => {\n return <TextField key={issueCategory} className={freeFormTextFieldClassName} underlined placeholder={strings?.tagsSurveyTextFieldDefaultText} onChange={(e, v) => {\n if (v) {\n setCheckedTextFields([...checkedTextFields, issueCategory]);\n setTextResponse(prevState => {\n prevState[issueCategory] = v;\n return prevState;\n });\n setSelectedTextResponse(prevState => {\n prevState[issueCategory] = v;\n return prevState;\n });\n }\n }} />;\n }, [strings?.tagsSurveyTextFieldDefaultText, checkedTextFields]);\n useEffect(() => {\n if (onConfirm) {\n onConfirm(selectedTags, selectedTextResponse);\n }\n }, [selectedTags, selectedTextResponse, onConfirm]);\n return <>\n <Stack verticalAlign=\"center\">\n <Text className={questionTextStyle(theme)}>{strings?.tagsSurveyQuestion}</Text>\n </Stack>\n\n <Pivot>\n {_getKeys(tags).map((key, i) => {\n return <PivotItem key={`key-${i}`} headerText={categoryHeadings[key]} // Add index signature to allow indexing with a string\n headerButtonProps={{\n 'data-order': i,\n 'data-title': key\n }} alwaysRender>\n {tags[key].map((t, i) => {\n return <Checkbox className={checkboxClassName} key={`checkBox_${i}`} label={t.message} onChange={(ev, checked) => onChange(key, checked ?? false, t.issue)} />;\n })}\n {showFreeFormTextField && <Checkbox checked={checkedTextFields.includes(key)} styles={freeFormTextCheckboxStyles} onChange={(ev, checked) => onChange(key, checked ?? false)} onRenderLabel={() => {\n return onRenderLabel(key);\n }} />}\n </PivotItem>;\n })}\n </Pivot>\n\n <Text className={helperTextStyle(theme)}>{strings?.tagsSurveyHelperText}</Text>\n </>;\n};"]}

package/dist/dist-esm/react-components/src/components/Survey/TagsSurvey/TagsSurvey.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TagsSurvey.styles.js","sourceRoot":"","sources":["~~../../../../../../../../~~react-components/src/components/Survey/TagsSurvey/TagsSurvey.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0B,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAE,QAAQ,EAAE,yCAAgC;AAEnD;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAAY,EAAU,EAAE,~~CACxD~~,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,cAAc;IACnC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;IACtB,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;CAC1B,CAAC,CAAC;~~AAEL~~;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAAY,EAAU,EAAE,~~CACtD~~,WAAW,CAAC;~~IACV~~,UAAU,EAAE,GAAG;IACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;IACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;IACxB,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;IACtB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB;CACtC,CAAC,CAAC;~~AAEL~~;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,WAAW,CAAC;IAC3C,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC;IACpB,WAAW,EAAE,CAAC;CACf,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAA6B;IAClE,IAAI,EAAE;QACJ,aAAa,EAAE,QAAQ,CAAC,CAAC,CAAC;QAC1B,KAAK,EAAE,MAAM;KACd;IACD,KAAK,EAAE;QACL,KAAK,EAAE,MAAM;KACd;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,WAAW,CAAC;IACpD,KAAK,EAAE,MAAM;IACb,UAAU,EAAE,QAAQ,CAAC,CAAC,CAAC;IACvB,KAAK,EAAE;QACL,OAAO,EAAE,CAAC;KACX;CACF,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ICheckboxStyles, Theme, mergeStyles } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/*\n @private\n /\nexport const questionTextStyle = (theme: Theme): string ~~=>\n~~ mergeStyles({\n fontWeight: 600,\n fontSize: _pxToRem(16),\n lineHeight: _pxToRem(20),\n color: theme.palette.neutralPrimary,\n marginTop: _pxToRem(8),\n marginBottom: _pxToRem(4)\n });\n\n/\n @private\n /\nexport const helperTextStyle = (theme: Theme): string ~~=>\n~~ mergeStyles({\n fontWeight: 400,\n fontSize: _pxToRem(12),\n lineHeight: _pxToRem(16),\n marginTop: _pxToRem(4),\n color: theme.palette.neutralSecondary\n });\n\n/\n @private\n /\nexport const checkboxClassName = mergeStyles({\n padding: _pxToRem(8),\n paddingLeft: 0\n});\n\n/\n @private\n /\nexport const freeFormTextCheckboxStyles: Partial<ICheckboxStyles> = {\n root: {\n paddingBottom: _pxToRem(8),\n width: '100%'\n },\n label: {\n width: '100%'\n }\n};\n\n/\n @private\n */\nexport const freeFormTextFieldClassName = mergeStyles({\n width: '100%',\n marginLeft: _pxToRem(4),\n input: {\n padding: 0\n }\n})~~;\n~~"]}
1	+ {"version":3,"file":"TagsSurvey.styles.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/Survey/TagsSurvey/TagsSurvey.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0B,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAE,QAAQ,EAAE,yCAAgC;AAEnD;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAAY,EAAU,EAAE,CAAC,WAAW,CAAC;IACrE,UAAU,EAAE,GAAG;IACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;IACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;IACxB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;IACnC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;IACtB,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC;CAC1B,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAAY,EAAU,EAAE,CAAC,WAAW,CAAC;IACnE,UAAU,EAAE,GAAG;IACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;IACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;IACxB,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;IACtB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB;CACtC,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,WAAW,CAAC;IAC3C,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC;IACpB,WAAW,EAAE,CAAC;CACf,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAA6B;IAClE,IAAI,EAAE;QACJ,aAAa,EAAE,QAAQ,CAAC,CAAC,CAAC;QAC1B,KAAK,EAAE,MAAM;KACd;IACD,KAAK,EAAE;QACL,KAAK,EAAE,MAAM;KACd;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,WAAW,CAAC;IACpD,KAAK,EAAE,MAAM;IACb,UAAU,EAAE,QAAQ,CAAC,CAAC,CAAC;IACvB,KAAK,EAAE;QACL,OAAO,EAAE,CAAC;KACX;CACF,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ICheckboxStyles, Theme, mergeStyles } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/*\n @private\n /\nexport const questionTextStyle = (theme: Theme): string => mergeStyles({\n fontWeight: 600,\n fontSize: _pxToRem(16),\n lineHeight: _pxToRem(20),\n color: theme.palette.neutralPrimary,\n marginTop: _pxToRem(8),\n marginBottom: _pxToRem(4)\n});\n\n/\n @private\n /\nexport const helperTextStyle = (theme: Theme): string => mergeStyles({\n fontWeight: 400,\n fontSize: _pxToRem(12),\n lineHeight: _pxToRem(16),\n marginTop: _pxToRem(4),\n color: theme.palette.neutralSecondary\n});\n\n/\n @private\n /\nexport const checkboxClassName = mergeStyles({\n padding: _pxToRem(8),\n paddingLeft: 0\n});\n\n/\n @private\n /\nexport const freeFormTextCheckboxStyles: Partial<ICheckboxStyles> = {\n root: {\n paddingBottom: _pxToRem(8),\n width: '100%'\n },\n label: {\n width: '100%'\n }\n};\n\n/\n @private\n */\nexport const freeFormTextFieldClassName = mergeStyles({\n width: '100%',\n marginLeft: _pxToRem(4),\n input: {\n padding: 0\n }\n});"]}

package/dist/dist-esm/react-components/src/components/SystemMessage.js CHANGED Viewed

@@ -18,10 +18,12 @@ export const SystemMessage = (props) => {
             setLiveMessage(content);
         });
     }, [content]);
-    return (React.createElement(React.Fragment, null,
+    return React.createElement(React.Fragment, null,
         React.createElement(LiveMessage, { message: liveMessage, ariaLive: "polite", clearOnUnmount: true }),
         React.createElement(Stack, { horizontal: true, className: mergeStyles(props === null || props === void 0 ? void 0 : props.containerStyle), tabIndex: 0 },
             Icon,
-            React.createElement(Text, { style: { wordBreak: 'break-word' }, role: "status", title: content, variant: 'small' }, content))));
+            React.createElement(Text, { style: {
+                    wordBreak: 'break-word'
+                }, role: "status", title: content, variant: 'small' }, content)));
 };
 //# sourceMappingURL=SystemMessage.js.map

package/dist/dist-esm/react-components/src/components/SystemMessage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SystemMessage.js","sourceRoot":"","sources":["~~../../../../../../~~react-components/src/components/SystemMessage.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAU,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAC7E,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AAEvE,OAAO,WAAW,MAAM,yBAAyB,CAAC;AA2BlD;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAe,EAAE;IACtE,MAAM,~~EAAE~~,QAAQ,~~EAAE~~,OAAO,~~EAAE~~,GAAG,KAAK,CAAC;~~IACpC~~,MAAM,IAAI,GAAgB,oBAAC,QAAQ,IAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,CAAC,sBAAsB,CAAC,GAAI,CAAC;IAC3G,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;~~IAEnD~~,SAAS,CAAC,GAAG,EAAE;QACb,kKAAkK;QAClK,mHAAmH;QACnH,UAAU,CAAC,GAAG,EAAE;YACd,cAAc,CAAC,OAAO,CAAC,CAAC;QAC1B,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;~~IAEd~~,OAAO~~,CACL~~;~~QACE~~,oBAAC,WAAW,IAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAC,QAAQ,EAAC,cAAc,EAAE,IAAI,GAAI;QAC7E,oBAAC,KAAK,IAAC,UAAU,QAAC,SAAS,EAAE,WAAW,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,cAAwB,CAAC,EAAE,QAAQ,EAAE,CAAC;YACnF,IAAI;YACL,oBAAC,IAAI,IAAC,KAAK,EAAE,~~EAAE,~~SAAS,EAAE,YAAY,EAAE,~~EAAE,~~IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,~~IACrF~~,OAAO,CACH,CACD,CACP,~~CACJ,~~CAAC;~~AACJ~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IStyle, FontIcon, mergeStyles, Stack, Text } from '@fluentui/react';\nimport React, { useEffect, useState } from 'react';\nimport { systemMessageIconStyle } from './styles/SystemMessage.styles';\nimport { ComponentSlotStyle } from '../types';\nimport LiveMessage from './Announcer/LiveMessage';\n\n/*\n Todo: We need to add more types of system messages that we support.\n \n @private\n /\nexport type SystemMessageIconTypes = 'PeopleAdd' \| 'PeopleBlock' \| 'Edit';\n\n/\n @private\n /\nexport type SystemMessageProps = {\n /\n Icon name for the system message.\n /\n iconName: SystemMessageIconTypes;\n /\n Content string for the system message.\n /\n content: string;\n /\n * Custom CSS Style for the system message container.\n /\n containerStyle?: ComponentSlotStyle;\n};\n\n/\n @private\n */\nexport const SystemMessage = (props: SystemMessageProps): JSX.Element => {\n const { iconName, content } = props;\n const Icon: JSX.Element = <FontIcon iconName={iconName} className={mergeStyles(systemMessageIconStyle)} />;\n const [liveMessage, setLiveMessage] = useState('');\n\n useEffect(() => {\n // Timeout is needed to handle situation when the same user joins and leaves a chat a few times in a row, otherwise Narrator won't repeat the system message text.\n // Because delay value is not provided, setMessage function will be executed asynchronously in the next event cycle\n setTimeout(() => {\n setLiveMessage(content);\n });\n }, [content]);\n\n return ~~(\n~~ <>\n <LiveMessage message={liveMessage} ariaLive=\"polite\" clearOnUnmount={true} />\n <Stack horizontal className={mergeStyles(props?.containerStyle as IStyle)} tabIndex={0}>\n {Icon}\n <Text style={{ wordBreak: 'break-word' }} role=\"status\" title={content} variant={'small'}>\n {content}\n </Text>\n </Stack>\n ~~</>\~~n ~~);\n~~}~~;\n~~"]}
1	+ {"version":3,"file":"SystemMessage.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/SystemMessage.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAU,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAC7E,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AAEvE,OAAO,WAAW,MAAM,yBAAyB,CAAC;AA2BlD;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAe,EAAE;IACtE,MAAM,EACJ,QAAQ,EACR,OAAO,EACR,GAAG,KAAK,CAAC;IACV,MAAM,IAAI,GAAgB,oBAAC,QAAQ,IAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,CAAC,sBAAsB,CAAC,GAAI,CAAC;IAC3G,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACnD,SAAS,CAAC,GAAG,EAAE;QACb,kKAAkK;QAClK,mHAAmH;QACnH,UAAU,CAAC,GAAG,EAAE;YACd,cAAc,CAAC,OAAO,CAAC,CAAC;QAC1B,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IACd,OAAO;QACH,oBAAC,WAAW,IAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAC,QAAQ,EAAC,cAAc,EAAE,IAAI,GAAI;QAC7E,oBAAC,KAAK,IAAC,UAAU,QAAC,SAAS,EAAE,WAAW,CAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,cAAwB,CAAC,EAAE,QAAQ,EAAE,CAAC;YACnF,IAAI;YACL,oBAAC,IAAI,IAAC,KAAK,EAAE;oBACb,SAAS,EAAE,YAAY;iBACxB,EAAE,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,IAC5C,OAAO,CACH,CACD,CACP,CAAC;AACR,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IStyle, FontIcon, mergeStyles, Stack, Text } from '@fluentui/react';\nimport React, { useEffect, useState } from 'react';\nimport { systemMessageIconStyle } from './styles/SystemMessage.styles';\nimport { ComponentSlotStyle } from '../types';\nimport LiveMessage from './Announcer/LiveMessage';\n\n/*\n Todo: We need to add more types of system messages that we support.\n \n @private\n /\nexport type SystemMessageIconTypes = 'PeopleAdd' \| 'PeopleBlock' \| 'Edit';\n\n/\n @private\n /\nexport type SystemMessageProps = {\n /\n Icon name for the system message.\n /\n iconName: SystemMessageIconTypes;\n /\n Content string for the system message.\n /\n content: string;\n /\n * Custom CSS Style for the system message container.\n /\n containerStyle?: ComponentSlotStyle;\n};\n\n/\n @private\n */\nexport const SystemMessage = (props: SystemMessageProps): JSX.Element => {\n const {\n iconName,\n content\n } = props;\n const Icon: JSX.Element = <FontIcon iconName={iconName} className={mergeStyles(systemMessageIconStyle)} />;\n const [liveMessage, setLiveMessage] = useState('');\n useEffect(() => {\n // Timeout is needed to handle situation when the same user joins and leaves a chat a few times in a row, otherwise Narrator won't repeat the system message text.\n // Because delay value is not provided, setMessage function will be executed asynchronously in the next event cycle\n setTimeout(() => {\n setLiveMessage(content);\n });\n }, [content]);\n return <>\n <LiveMessage message={liveMessage} ariaLive=\"polite\" clearOnUnmount={true} />\n <Stack horizontal className={mergeStyles(props?.containerStyle as IStyle)} tabIndex={0}>\n {Icon}\n <Text style={{\n wordBreak: 'break-word'\n }} role=\"status\" title={content} variant={'small'}>\n {content}\n </Text>\n </Stack>\n </>;\n};"]}

package/dist/dist-esm/react-components/src/components/TroubleshootingGuideErrorBar.js CHANGED Viewed

@@ -25,23 +25,23 @@ export const _TroubleshootingGuideErrorBar = (props) => {
     // Without this behaviour, this `useEffect` block would cause a render loop.
     useEffect(() => setDismissedErrors(dropDismissalsForInactiveErrors(props.activeErrorMessages, dismissedErrors)), [props.activeErrorMessages, dismissedErrors]);
     const toShow = errorsToShow(props.activeErrorMessages, dismissedErrors);
-    return (React.createElement(Stack, { "data-ui-id": "notifications-stack" }, toShow.map((error, i) => {
-        const devicePermissionErrorBar = (React.createElement("div", null,
+    return React.createElement(Stack, { "data-ui-id": "notifications-stack" }, toShow.map((error, i) => {
+        const devicePermissionErrorBar = React.createElement("div", null,
             strings[error.type],
             ' ',
-            onPermissionsTroubleshootingClick && (React.createElement(Link, { onClick: () => {
+            onPermissionsTroubleshootingClick && React.createElement(Link, { onClick: () => {
                     onPermissionsTroubleshootingClick(permissionsState);
                 } },
-                React.createElement("span", { className: messageBarLinkStyles(theme, true) }, troubleshootingGuideStrings.devicePermissionLinkText)))));
-        const networkErrorBar = (React.createElement("div", null,
+                React.createElement("span", { className: messageBarLinkStyles(theme, true) }, troubleshootingGuideStrings.devicePermissionLinkText)));
+        const networkErrorBar = React.createElement("div", null,
             strings[error.type],
             ' ',
-            onNetworkingTroubleshootingClick && (React.createElement(Link, { onClick: onNetworkingTroubleshootingClick, underline: true },
-                React.createElement("span", { className: messageBarLinkStyles(theme, true) }, troubleshootingGuideStrings.networkTroubleshootingLinkText)))));
-        return (React.createElement(MessageBar, Object.assign({}, props, { styles: messageBarStyle(theme, messageBarType(error.type)), key: `${error.type} ${i}`, messageBarType: messageBarType(error.type), messageBarIconProps: messageBarIconProps(error.type), actions: React.createElement(MessageBarButton, { text: troubleshootingGuideStrings.dismissButtonText, styles: dismissButtonStyle(theme), onClick: () => {
+            onNetworkingTroubleshootingClick && React.createElement(Link, { onClick: onNetworkingTroubleshootingClick, underline: true },
+                React.createElement("span", { className: messageBarLinkStyles(theme, true) }, troubleshootingGuideStrings.networkTroubleshootingLinkText)));
+        return React.createElement(MessageBar, Object.assign({}, props, { styles: messageBarStyle(theme, messageBarType(error.type)), key: `${error.type} ${i}`, messageBarType: messageBarType(error.type), messageBarIconProps: messageBarIconProps(error.type), actions: React.createElement(MessageBarButton, { text: troubleshootingGuideStrings.dismissButtonText, styles: dismissButtonStyle(theme), onClick: () => {
                     setDismissedErrors(dismissError(dismissedErrors, error));
-                }, ariaLabel: troubleshootingGuideStrings.dismissButtonText }), isMultiline: false, "aria-role": "alert", "aria-live": "assertive" }), showErrorBar(error.type, devicePermissionErrorBar, networkErrorBar)));
-    })));
+                }, ariaLabel: troubleshootingGuideStrings.dismissButtonText }), isMultiline: false, "aria-role": "alert", "aria-live": "assertive" }), showErrorBar(error.type, devicePermissionErrorBar, networkErrorBar));
+    }));
 };
 const showErrorBar = (errorType, devicePermissionErrorBar, networkErrorBar) => {
     if (errorType === 'callNetworkQualityLow') {

package/dist/dist-esm/react-components/src/components/TroubleshootingGuideErrorBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TroubleshootingGuideErrorBar.js","sourceRoot":"","sources":["~~../../../../../../~~react-components/src/components/TroubleshootingGuideErrorBar.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,gBAAgB,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACtF,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AACnG,OAAO,~~EAEL~~,YAAY,~~EACZ~~,+BAA+B,~~EAC/B~~,YAAY,~~EACZ~~,mBAAmB,~~EACnB~~,cAAc,~~EACf~~,MAAM,SAAS,CAAC;~~AACjB~~,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AA+DtE;;;GAGG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,KAAyC,EAAe,EAAE;;IACtG,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,oBAAoB;IACpB,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC;IACnD,MAAM,OAAO,GAAG,MAAA,KAAK,CAAC,OAAO,mCAAI,aAAa,CAAC;~~IAE~~/C,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAmB,EAAE,CAAC,CAAC;~~IAE7E~~,MAAM,EACJ,iCAAiC,EACjC,gCAAgC,EAChC,gBAAgB,GAAG;QACjB,MAAM,EAAE,QAAQ;QAChB,UAAU,EAAE,QAAQ;KACrB,EACD,2BAA2B,EAC5B,GAAG,KAAK,CAAC;IAEV,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,CAAC,KAAK,CAAC,mBAAmB,EAAE,eAAe,CAAC,CAAC;~~IAExE~~,OAAO,~~CACL,~~oBAAC,KAAK,kBAAY,qBAAqB,~~IACpC~~,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;~~QACvB~~,MAAM,wBAAwB,GAAG~~,CAC/B~~;~~YACG~~,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;YAAE,GAAG;YACxB,iCAAiC,IAAI,~~CACpC,~~oBAAC,IAAI,~~IACH~~,OAAO,EAAE,GAAG,EAAE;~~oBACZ~~,iCAAiC,CAAC,gBAAgB,CAAC,CAAC;gBACtD,CAAC;~~gBAED~~,8BAAM,SAAS,EAAE,oBAAoB,CAAC,KAAK,EAAE,IAAI,CAAC,IAC/C,2BAA2B,CAAC,wBAAwB,CAChD,CACF,~~CACR~~,~~CACG,CACP,~~CAAC;~~QAEF~~,MAAM,eAAe,GAAG~~,CACtB~~;~~YACG~~,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;YAAE,GAAG;YACxB,gCAAgC,IAAI,~~CACnC,~~oBAAC,IAAI,IAAC,OAAO,EAAE,gCAAgC,EAAE,SAAS;~~gBACxD~~,8BAAM,SAAS,EAAE,oBAAoB,CAAC,KAAK,EAAE,IAAI,CAAC,IAC/C,2BAA2B,CAAC,8BAA8B,CACtD,CACF,~~CACR~~,~~CACG,CACP,~~CAAC;~~QAEF~~,OAAO,~~CACL,~~oBAAC,UAAU,~~oBACL~~,KAAK,~~IACT~~,MAAM,EAAE,eAAe,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,~~EAC1D~~,GAAG,EAAE,GAAG,KAAK,CAAC,IAAI,IAAI,CAAC,EAAE,~~EACzB~~,cAAc,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,~~EAC1C~~,mBAAmB,EAAE,mBAAmB,CAAC,KAAK,CAAC,IAAI,CAAC,~~EACpD~~,OAAO,~~EACL~~,oBAAC,gBAAgB,~~IACf~~,IAAI,EAAE,2BAA2B,CAAC,iBAAiB,~~EACnD~~,MAAM,EAAE,kBAAkB,CAAC,KAAK,CAAC,~~EACjC~~,OAAO,EAAE,GAAG,EAAE;~~oBACZ~~,kBAAkB,CAAC,YAAY,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC,CAAC;gBAC3D,CAAC,~~EACD~~,SAAS,EAAE,2BAA2B,CAAC,iBAAiB,~~GACxD~~,~~EAEJ~~,WAAW,EAAE,KAAK,~~eACR~~,OAAO,~~eACP~~,WAAW,~~KAEpB~~,YAAY,CAAC,KAAK,CAAC,IAAI,EAAE,wBAAwB,EAAE,eAAe,CAAC,CACzD,~~CACd,~~CAAC;~~IACJ~~,CAAC,CAAC,~~CACI~~,~~CACT,~~CAAC;~~AACJ~~,CAAC,CAAC;~~AAEF~~,MAAM,YAAY,GAAG,~~CACnB~~,SAAiB,~~EACjB~~,wBAAqC,~~EACrC~~,eAA4B,~~EACf~~,EAAE;~~IACf~~,IAAI,SAAS,KAAK,uBAAuB,EAAE,CAAC;QAC1C,OAAO,eAAe,CAAC;IACzB,CAAC;SAAM,CAAC;QACN,OAAO,wBAAwB,CAAC;IAClC,CAAC;AACH,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useEffect, useState } from 'react';\nimport { Link, MessageBar, MessageBarButton, Stack, useTheme } from '@fluentui/react';\nimport { useLocale } from '../localization';\nimport { ErrorBarProps } from './ErrorBar';\nimport { dismissButtonStyle, messageBarStyle } from './styles/TroubleshootingGuideErrorBar.styles';\nimport {\n DismissedError~~,\n~~ dismissError~~,\n~~ dropDismissalsForInactiveErrors~~,\n~~ errorsToShow~~,\n~~ messageBarIconProps~~,\n~~ messageBarType\n} from './utils';\nimport { messageBarLinkStyles } from './styles/MessageBarLink.styles';\n\n/*\n Strings for {@link _TroubleshootingGuideErrorBar}.\n \n @internal\n /\nexport interface _TroubleshootingGuideErrorBarStrings {\n devicePermissionLinkText?: string;\n networkTroubleshootingLinkText?: string;\n dismissButtonText?: string;\n}\n\n/\n Props for {@link _TroubleshootingGuideErrorBar}.\n \n @internal\n /\nexport interface _TroubleshootingGuideErrorBarProps extends ErrorBarProps {\n /\n permissions state for camera/microphone\n /\n permissionsState?: {\n camera: PermissionState;\n microphone: PermissionState;\n };\n /\n Callback you may provide to supply users with further steps to troubleshoot why they have been\n * unable to grant your site the required permissions for the call.\n \n @example\n * ```ts\n * onPermissionsTroubleshootingClick: () =>\n * window.open('https://contoso.com/permissions-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'further troubleshooting' link.\n /\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /\n Optional callback to supply users with further troubleshooting steps for network issues\n * experienced when connecting to a call.\n \n @example\n * ```ts\n * onNetworkingTroubleshootingClick?: () =>\n * window.open('https://contoso.com/network-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'network troubleshooting' link.\n /\n onNetworkingTroubleshootingClick?: () => void;\n /\n strings related to trouble shooting guidance link and dismiss button\n /\n troubleshootingGuideStrings: _TroubleshootingGuideErrorBarStrings;\n}\n\n/\n @internal\n * A component to show device Permission/network connection related errors, contains link that leads to further trouble shooting guide\n */\nexport const _TroubleshootingGuideErrorBar = (props: _TroubleshootingGuideErrorBarProps): JSX.Element => {\n const theme = useTheme();\n // error bar strings\n const localeStrings = useLocale().strings.errorBar;\n const strings = props.strings ?? localeStrings;\n\n const [dismissedErrors, setDismissedErrors] = useState<DismissedError[]>([]);\n\n const {\n onPermissionsTroubleshootingClick,\n onNetworkingTroubleshootingClick,\n permissionsState = {\n camera: 'denied',\n microphone: 'denied'\n },\n troubleshootingGuideStrings\n } = props;\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(props.activeErrorMessages, dismissedErrors);\n\n return ~~(\n~~ <Stack data-ui-id=\"notifications-stack\">\n {toShow.map((error, i) => {\n const devicePermissionErrorBar = ~~(\n~~ <div>\n {strings[error.type]}{' '}\n {onPermissionsTroubleshootingClick && ~~(\n~~ <Link\n onClick={() => {\n onPermissionsTroubleshootingClick(permissionsState);\n }}\n >\n <span className={messageBarLinkStyles(theme, true)}>\n {troubleshootingGuideStrings.devicePermissionLinkText}\n </span>\n </Link~~>\n )~~}\n </div>\n ~~);\n\n~~ const networkErrorBar = ~~(\n~~ <div>\n {strings[error.type]}{' '}\n {onNetworkingTroubleshootingClick && ~~(\n~~ <Link onClick={onNetworkingTroubleshootingClick} underline>\n <span className={messageBarLinkStyles(theme, true)}>\n {troubleshootingGuideStrings.networkTroubleshootingLinkText}\n </span>\n </Link~~>\n )~~}\n </div>\n ~~);\n\n~~ return ~~(\n~~ <MessageBar\n {...props}\n styles={messageBarStyle(theme, messageBarType(error.type))}\n key={`${error.type} ${i}`}\n messageBarType={messageBarType(error.type)}\n messageBarIconProps={messageBarIconProps(error.type)}\n actions={\n <MessageBarButton\n text={troubleshootingGuideStrings.dismissButtonText}\n styles={dismissButtonStyle(theme)}\n onClick={() => {\n setDismissedErrors(dismissError(dismissedErrors, error));\n }}\n ariaLabel={troubleshootingGuideStrings.dismissButtonText}~~\n />\n~~ }\n isMultiline={false}\n aria-role=\"alert\"\n aria-live=\"assertive\"\n >\n {showErrorBar(error.type, devicePermissionErrorBar, networkErrorBar)}\n </MessageBar>\n ~~);\n~~ })}\n </Stack>\n ~~);\n~~};\n\nconst showErrorBar = (\n errorType: string~~,\n~~ devicePermissionErrorBar: JSX.Element~~,\n~~ networkErrorBar: JSX.Element\n): JSX.Element => {\n if (errorType === 'callNetworkQualityLow') {\n return networkErrorBar;\n } else {\n return devicePermissionErrorBar;\n }\n}~~;\n~~"]}
1	+ {"version":3,"file":"TroubleshootingGuideErrorBar.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/TroubleshootingGuideErrorBar.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useEffect, useState } from 'react';\nimport { Link, MessageBar, MessageBarButton, Stack, useTheme } from '@fluentui/react';\nimport { useLocale } from '../localization';\nimport { ErrorBarProps } from './ErrorBar';\nimport { dismissButtonStyle, messageBarStyle } from './styles/TroubleshootingGuideErrorBar.styles';\nimport { DismissedError, dismissError, dropDismissalsForInactiveErrors, errorsToShow, messageBarIconProps, messageBarType } from './utils';\nimport { messageBarLinkStyles } from './styles/MessageBarLink.styles';\n\n/*\n Strings for {@link _TroubleshootingGuideErrorBar}.\n \n @internal\n /\nexport interface _TroubleshootingGuideErrorBarStrings {\n devicePermissionLinkText?: string;\n networkTroubleshootingLinkText?: string;\n dismissButtonText?: string;\n}\n\n/\n Props for {@link _TroubleshootingGuideErrorBar}.\n \n @internal\n /\nexport interface _TroubleshootingGuideErrorBarProps extends ErrorBarProps {\n /\n permissions state for camera/microphone\n /\n permissionsState?: {\n camera: PermissionState;\n microphone: PermissionState;\n };\n /\n Callback you may provide to supply users with further steps to troubleshoot why they have been\n * unable to grant your site the required permissions for the call.\n \n @example\n * ```ts\n * onPermissionsTroubleshootingClick: () =>\n * window.open('https://contoso.com/permissions-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'further troubleshooting' link.\n /\n onPermissionsTroubleshootingClick?: (permissionsState: {\n camera: PermissionState;\n microphone: PermissionState;\n }) => void;\n /\n Optional callback to supply users with further troubleshooting steps for network issues\n * experienced when connecting to a call.\n \n @example\n * ```ts\n * onNetworkingTroubleshootingClick?: () =>\n * window.open('https://contoso.com/network-troubleshooting', '_blank');\n * ```\n \n @remarks\n * if this is not supplied, the composite will not show a 'network troubleshooting' link.\n /\n onNetworkingTroubleshootingClick?: () => void;\n /\n strings related to trouble shooting guidance link and dismiss button\n /\n troubleshootingGuideStrings: _TroubleshootingGuideErrorBarStrings;\n}\n\n/\n @internal\n * A component to show device Permission/network connection related errors, contains link that leads to further trouble shooting guide\n */\nexport const _TroubleshootingGuideErrorBar = (props: _TroubleshootingGuideErrorBarProps): JSX.Element => {\n const theme = useTheme();\n // error bar strings\n const localeStrings = useLocale().strings.errorBar;\n const strings = props.strings ?? localeStrings;\n const [dismissedErrors, setDismissedErrors] = useState<DismissedError[]>([]);\n const {\n onPermissionsTroubleshootingClick,\n onNetworkingTroubleshootingClick,\n permissionsState = {\n camera: 'denied',\n microphone: 'denied'\n },\n troubleshootingGuideStrings\n } = props;\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(() => setDismissedErrors(dropDismissalsForInactiveErrors(props.activeErrorMessages, dismissedErrors)), [props.activeErrorMessages, dismissedErrors]);\n const toShow = errorsToShow(props.activeErrorMessages, dismissedErrors);\n return <Stack data-ui-id=\"notifications-stack\">\n {toShow.map((error, i) => {\n const devicePermissionErrorBar = <div>\n {strings[error.type]}{' '}\n {onPermissionsTroubleshootingClick && <Link onClick={() => {\n onPermissionsTroubleshootingClick(permissionsState);\n }}>\n <span className={messageBarLinkStyles(theme, true)}>\n {troubleshootingGuideStrings.devicePermissionLinkText}\n </span>\n </Link>}\n </div>;\n const networkErrorBar = <div>\n {strings[error.type]}{' '}\n {onNetworkingTroubleshootingClick && <Link onClick={onNetworkingTroubleshootingClick} underline>\n <span className={messageBarLinkStyles(theme, true)}>\n {troubleshootingGuideStrings.networkTroubleshootingLinkText}\n </span>\n </Link>}\n </div>;\n return <MessageBar {...props} styles={messageBarStyle(theme, messageBarType(error.type))} key={`${error.type} ${i}`} messageBarType={messageBarType(error.type)} messageBarIconProps={messageBarIconProps(error.type)} actions={<MessageBarButton text={troubleshootingGuideStrings.dismissButtonText} styles={dismissButtonStyle(theme)} onClick={() => {\n setDismissedErrors(dismissError(dismissedErrors, error));\n }} ariaLabel={troubleshootingGuideStrings.dismissButtonText} />} isMultiline={false} aria-role=\"alert\" aria-live=\"assertive\">\n {showErrorBar(error.type, devicePermissionErrorBar, networkErrorBar)}\n </MessageBar>;\n })}\n </Stack>;\n};\nconst showErrorBar = (errorType: string, devicePermissionErrorBar: JSX.Element, networkErrorBar: JSX.Element): JSX.Element => {\n if (errorType === 'callNetworkQualityLow') {\n return networkErrorBar;\n } else {\n return devicePermissionErrorBar;\n }\n};"]}

package/dist/dist-esm/react-components/src/components/TypingIndicator.js CHANGED Viewed

@@ -21,7 +21,7 @@ const getUsersElement = (typingUsers, delimiter, onRenderUser, userDisplayNameSt
         if (truncatedDisplayName && truncatedDisplayName.length > 50) {
             truncatedDisplayName = truncatedDisplayName.substring(0, 50) + '...';
         }
-        userElements.push(onRenderUser ? (onRenderUser(user)) : (React.createElement(Text, { className: mergeStyles(userDisplayNameStyles), key: `user-${index}` }, truncatedDisplayName)));
+        userElements.push(onRenderUser ? onRenderUser(user) : React.createElement(Text, { className: mergeStyles(userDisplayNameStyles), key: `user-${index}` }, truncatedDisplayName));
         userElements.push(React.createElement(Text, { key: `comma-${index}` }, `${delimiter}`));
     });
     // pop last comma
@@ -36,7 +36,7 @@ const getUsersElement = (typingUsers, delimiter, onRenderUser, userDisplayNameSt
  */
 const getNamesString = (typingUsers, delimiter) => {
     const userNames = [];
-    typingUsers.forEach((user) => {
+    typingUsers.forEach(user => {
         if (user.displayName) {
             userNames.push(user.displayName);
         }
@@ -100,9 +100,7 @@ const getIndicatorString = (strings, namesString, numTypingUsers, numTypingUsers
         return strings.multipleUsersAbbreviateOne.replace('{users}', namesString);
     }
     if (numTypingUsers > 1 && numTypingUsersAbbreviated > 1) {
-        return strings.multipleUsersAbbreviateMany
-            .replace('{users}', namesString)
-            .replace('{numOthers}', `${numTypingUsersAbbreviated}`);
+        return strings.multipleUsersAbbreviateMany.replace('{users}', namesString).replace('{numOthers}', `${numTypingUsersAbbreviated}`);
     }
     return undefined;
 };
@@ -119,8 +117,7 @@ const IndicatorComponent = (typingUsers, strings, onRenderUser, styles) => {
         if (typingUsersMentioned.length > 0) {
             additionalCharCount += strings.delimiter.length;
         }
-        if (totalCharacterCount + additionalCharCount <= MAXIMUM_LENGTH_OF_TYPING_USERS ||
-            typingUsersMentioned.length === 0) {
+        if (totalCharacterCount + additionalCharCount <= MAXIMUM_LENGTH_OF_TYPING_USERS || typingUsersMentioned.length === 0) {
             typingUsersMentioned.push(typingUser);
             totalCharacterCount += additionalCharCount;
         }
@@ -132,7 +129,7 @@ const IndicatorComponent = (typingUsers, strings, onRenderUser, styles) => {
     const numUserNotMentioned = typingUsers.length - typingUsersMentioned.length;
     const spanElements = getSpanElements(strings, usersElement, typingUsers.length, numUserNotMentioned);
     const labelString = getIndicatorString(strings, getNamesString(typingUsersMentioned, strings.delimiter), typingUsers.length, numUserNotMentioned);
-    return (React.createElement("div", { "data-ui-id": ids.typingIndicator, className: mergeStyles(typingIndicatorStringStyle, styles === null || styles === void 0 ? void 0 : styles.typingString), key: "typingStringKey", role: "status", "aria-label": labelString }, spanElements));
+    return React.createElement("div", { "data-ui-id": ids.typingIndicator, className: mergeStyles(typingIndicatorStringStyle, styles === null || styles === void 0 ? void 0 : styles.typingString), key: "typingStringKey", role: "status", "aria-label": labelString }, spanElements);
 };
 /**
  * Component to notify local user when one or more participants in the chat thread are typing.
@@ -142,7 +139,7 @@ const IndicatorComponent = (typingUsers, strings, onRenderUser, styles) => {
 export const TypingIndicator = (props) => {
     const { typingUsers, onRenderUser, styles } = props;
     const { strings } = useLocale();
-    const typingUsersToRender = typingUsers.filter((typingUser) => typingUser.displayName !== undefined);
+    const typingUsersToRender = typingUsers.filter(typingUser => typingUser.displayName !== undefined);
     const indicatorComponent = IndicatorComponent(typingUsersToRender, Object.assign(Object.assign({}, strings.typingIndicator), props.strings), onRenderUser, styles);
     return React.createElement(Stack, { className: mergeStyles(typingIndicatorContainerStyle, styles === null || styles === void 0 ? void 0 : styles.root) }, indicatorComponent);
 };

package/dist/dist-esm/react-components/src/components/TypingIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TypingIndicator.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/TypingIndicator.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { typingIndicatorContainerStyle, typingIndicatorStringStyle } from './styles/TypingIndicator.styles';\n\nimport React from 'react';\nimport { BaseCustomStyles, CommunicationParticipant } from '../types';\nimport { IStyle, mergeStyles, Stack, Text } from '@fluentui/react';\nimport { useLocale } from '../localization/LocalizationProvider';\nimport { useIdentifiers } from '../identifiers';\nimport { _IObjectMap } from '@internal/acs-ui-common';\n\n/*\n Fluent styles for {@link TypingIndicator}.\n \n @public\n /\nexport interface TypingIndicatorStylesProps extends BaseCustomStyles {\n /* Styles for each typing user's displayName. /\n typingUserDisplayName?: IStyle;\n /* Styles for the typing string. /\n typingString?: IStyle;\n}\n\n/\n Strings of {@link TypingIndicator} that can be overridden.\n \n @public\n /\nexport interface TypingIndicatorStrings {\n /\n String template to use when one user is typing. Placeholders: [user].\n * @example\n * ```\n * <TypingIndicator\n * strings={{ multipleUsersAbbreviateOne: '{users} is typing...' }}\n * typingUsers={[{ userId: 'user1', displayName: 'Claire' }]}\n * />\n * ```\n * would be 'Claire is typing...'\n /\n singleUser: string;\n /\n * String template to use when multiple users are typing. Placeholders: [users].\n * @example\n * ```\n * <TypingIndicator\n * strings={{ multipleUsers: '{users} are typing...' }}\n * typingUsers={[\n * { userId: 'user1', displayName: 'Claire' },\n * { userId: 'user2', displayName: 'Christopher' }\n * ]}\n * />\n * ```\n * would be 'Claire, Chris are typing...'\n /\n multipleUsers: string;\n /\n * String template to use when multiple users are typing with one other user abbreviated. Placeholders: [users].\n * @example\n * ```typescript\n * <TypingIndicator\n * strings={{ multipleUsersAbbreviateOne: '{users} and 1 other are typing...' }}\n * typingUsers={[\n * { userId: 'user1', displayName: 'Claire Romanov' },\n * { userId: 'user2', displayName: 'Christopher Rutherford' }\n * ]}\n * />\n * ```\n * would be 'Claire Romanov and 1 other are typing...'\n /\n multipleUsersAbbreviateOne: string;\n /\n * String template to use when multiple users are typing with one other user abbreviated. Placeholders: [users, numOthers].\n * @example\n * ```\n * <TypingIndicator\n * strings={{ multipleUsersAbbreviateMany: '{users} and {numOthers} others are typing...' }}\n * typingUsers={[\n * { userId: 'user1', displayName: 'Claire Romanov' },\n * { userId: 'user2', displayName: 'Christopher Rutherford' },\n * { userId: 'user3', displayName: 'Jill Vernblom' }\n * ]}\n * />\n * ```\n * would be 'Claire Romanov and 2 others are typing...'\n /\n multipleUsersAbbreviateMany: string;\n /\n * String to use as delimiter to separate multiple users.\n * @example\n * ```\n * <TypingIndicator\n * strings={{ delimiter: ' + ' }}\n * typingUsers={[\n * { userId: 'user1', displayName: 'Claire' },\n * { userId: 'user2', displayName: 'Chris' },\n * { userId: 'user3', displayName: 'Jill' }\n * ]}\n * />\n * ```\n * would be 'Claire + Chris + Jill are typing...'\n /\n delimiter: string;\n}\n\n/\n * Props for {@link TypingIndicator}.\n \n @public\n /\nexport interface TypingIndicatorProps {\n /* List of the typing users. /\n typingUsers: CommunicationParticipant[];\n /* Callback to render typing users /\n onRenderUser?: (users: CommunicationParticipant) => JSX.Element;\n /\n Allows users to pass in an object contains custom CSS styles.\n * @Example\n * ```\n * <TypingIndicator styles={{ root: { background: 'blue' } }} />\n * ```\n /\n styles?: TypingIndicatorStylesProps;\n\n /\n Optional strings to override in component\n /\n strings?: Partial<TypingIndicatorStrings>;\n}\n\nconst MAXIMUM_LENGTH_OF_TYPING_USERS = 35;\n\n/\n Helper function to create element wrapping all typing users\n * @param typingUsers typing users\n * @param delimiter string to separate typing users\n * @param onRenderUser optional callback to render each typing user\n * @param userDisplayNameStyles optional additional IStyle to apply to each element containing users name\n * @returns element wrapping all typing users\n /\nconst getUsersElement = (\n typingUsers: CommunicationParticipant[],\n delimiter: string,\n onRenderUser?: (users: CommunicationParticipant) => JSX.Element,\n userDisplayNameStyles?: IStyle\n): JSX.Element => {\n const userElements: JSX.Element[] = [];\n typingUsers.forEach((user, index) => {\n let truncatedDisplayName = user.displayName;\n if (truncatedDisplayName && truncatedDisplayName.length > 50) {\n truncatedDisplayName = truncatedDisplayName.substring(0, 50) + '...';\n }\n userElements.push(\n onRenderUser ? (\n onRenderUser(user)\n ) : (\n <Text className={mergeStyles(userDisplayNameStyles)} key={`user-${index}`}>\n {truncatedDisplayName}\n </Text>\n )\n );\n userElements.push(<Text key={`comma-${index}`}>{`${delimiter}`}</Text>);\n });\n // pop last comma\n userElements.pop();\n return <>{userElements}</>;\n};\n\n/\n Helper function to get a string of all typing users\n * @param typingUsers typing users\n * @param delimiter string to separate typing users\n * @returns string of all typing users\n /\nconst getNamesString = (typingUsers: CommunicationParticipant[], delimiter: string): string => {\n const userNames: string[] = [];\n\n typingUsers.forEach((user) => {\n if (user.displayName) {\n userNames.push(user.displayName);\n }\n });\n return userNames.join(delimiter);\n};\n\n/\n Helper function to create span elements making up the typing indicator string\n * @param strings TypingIndicatorStrings containing strings to create span elements\n * @param usersElement JSX.Element containing all typing users\n * @param numTypingUsers number of total typing users\n * @param numUserNotMentioned number of typing users abbreviated\n * @returns array of span elements making up the typing indicator string\n /\nconst getSpanElements = (\n strings: TypingIndicatorStrings,\n usersElement: JSX.Element,\n numTypingUsers: number,\n numTypingUsersAbbreviated: number\n): JSX.Element[] => {\n let variables: Record<string, JSX.Element> = {};\n let typingString = '';\n if (numTypingUsers === 1) {\n typingString = strings.singleUser;\n variables = {\n user: usersElement\n };\n } else if (numTypingUsers > 1 && numTypingUsersAbbreviated === 0) {\n typingString = strings.multipleUsers;\n variables = {\n users: usersElement\n };\n } else if (numTypingUsers > 1 && numTypingUsersAbbreviated === 1) {\n typingString = strings.multipleUsersAbbreviateOne;\n variables = {\n users: usersElement\n };\n } else if (numTypingUsers > 1 && numTypingUsersAbbreviated > 1) {\n typingString = strings.multipleUsersAbbreviateMany;\n variables = {\n users: usersElement,\n numOthers: <>{numTypingUsersAbbreviated}</>\n };\n }\n\n return formatInlineElements(typingString, variables);\n};\n\n/\n Helper function to get the string making up the typing indicator string\n * @param strings TypingIndicatorStrings containing strings to create span elements\n * @param namesString string of all typing users\n * @param numTypingUsers number of total typing users\n * @param numUserNotMentioned number of typing users abbreviated\n * @returns typing indicator string\n /\nconst getIndicatorString = (\n strings: TypingIndicatorStrings,\n namesString: string,\n numTypingUsers: number,\n numTypingUsersAbbreviated: number\n): string \| undefined => {\n if (numTypingUsers === 1) {\n return strings.singleUser.replace('{user}', namesString);\n }\n\n if (numTypingUsers > 1 && numTypingUsersAbbreviated === 0) {\n return strings.multipleUsers.replace('{users}', namesString);\n }\n\n if (numTypingUsers > 1 && numTypingUsersAbbreviated === 1) {\n return strings.multipleUsersAbbreviateOne.replace('{users}', namesString);\n }\n\n if (numTypingUsers > 1 && numTypingUsersAbbreviated > 1) {\n return strings.multipleUsersAbbreviateMany\n .replace('{users}', namesString)\n .replace('{numOthers}', `${numTypingUsersAbbreviated}`);\n }\n\n return undefined;\n};\n\nconst IndicatorComponent = (\n typingUsers: CommunicationParticipant[],\n strings: TypingIndicatorStrings,\n onRenderUser?: (users: CommunicationParticipant) => JSX.Element,\n styles?: TypingIndicatorStylesProps\n): JSX.Element => {\n const typingUsersMentioned: CommunicationParticipant[] = [];\n let totalCharacterCount = 0;\n const ids = useIdentifiers();\n\n for (const typingUser of typingUsers) {\n if (!typingUser.displayName) {\n continue;\n }\n\n let additionalCharCount = typingUser.displayName.length;\n // The typing users will be separated by the delimiter. We account for that additional length when we generate the final string.\n if (typingUsersMentioned.length > 0) {\n additionalCharCount += strings.delimiter.length;\n }\n\n if (\n totalCharacterCount + additionalCharCount <= MAXIMUM_LENGTH_OF_TYPING_USERS \|\|\n typingUsersMentioned.length === 0\n ) {\n typingUsersMentioned.push(typingUser);\n totalCharacterCount += additionalCharCount;\n } else {\n break;\n }\n }\n\n const usersElement: JSX.Element = getUsersElement(\n typingUsersMentioned,\n strings.delimiter,\n onRenderUser,\n styles?.typingUserDisplayName\n );\n\n const numUserNotMentioned = typingUsers.length - typingUsersMentioned.length;\n const spanElements: JSX.Element[] = getSpanElements(strings, usersElement, typingUsers.length, numUserNotMentioned);\n\n const labelString = getIndicatorString(\n strings,\n getNamesString(typingUsersMentioned, strings.delimiter),\n typingUsers.length,\n numUserNotMentioned\n );\n\n return (\n <div\n data-ui-id={ids.typingIndicator}\n className={mergeStyles(typingIndicatorStringStyle, styles?.typingString)}\n key=\"typingStringKey\"\n role=\"status\"\n aria-label={labelString}\n >\n {spanElements}\n </div>\n );\n};\n\n/\n Component to notify local user when one or more participants in the chat thread are typing.\n \n @public\n /\nexport const TypingIndicator = (props: TypingIndicatorProps): JSX.Element => {\n const { typingUsers, onRenderUser, styles } = props;\n const { strings } = useLocale();\n\n const typingUsersToRender = typingUsers.filter((typingUser) => typingUser.displayName !== undefined);\n\n const indicatorComponent = IndicatorComponent(\n typingUsersToRender,\n { ...strings.typingIndicator, ...props.strings },\n onRenderUser,\n styles\n );\n\n return <Stack className={mergeStyles(typingIndicatorContainerStyle, styles?.root)}>{indicatorComponent}</Stack>;\n};\n\n/\n Create an array of span elements by replacing the pattern \"\\{\\}\" in str with the elements\n * passed in as vars and creating inline elements from the rest\n \n @param str - The string to be formatted\n * @param vars - Variables to use to format the string\n * @returns formatted JSX elements\n */\nconst formatInlineElements = (str: string, vars: _IObjectMap<JSX.Element>): JSX.Element[] => {\n if (!str) {\n return [];\n }\n if (!vars) {\n return [];\n }\n\n const elements: JSX.Element[] = [];\n\n // regex to search for the pattern \"{}\"\n const placeholdersRegex = /{(\\w+)}/g;\n const regex = RegExp(placeholdersRegex);\n let array: RegExpExecArray \| null = regex.exec(str);\n let prev = 0;\n while (array !== null) {\n if (prev !== array.index) {\n elements.push(<Text key={elements.length}>{str.substring(prev, array.index)}</Text>);\n }\n elements.push(<Text key={elements.length}>{vars[array[0].substring(1, array[0].length - 1)]}</Text>);\n prev = regex.lastIndex;\n array = regex.exec(str);\n }\n elements.push(<Text key={elements.length}>{str.substring(prev)}</Text>);\n return elements;\n};\n"]}
1	+ {"version":3,"file":"TypingIndicator.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/TypingIndicator.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,6BAA6B,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAC5G,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAU,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAyHhD,MAAM,8BAA8B,GAAG,EAAE,CAAC;AAE1C;;;;;;;GAOG;AACH,MAAM,eAAe,GAAG,CAAC,WAAuC,EAAE,SAAiB,EAAE,YAA+D,EAAE,qBAA8B,EAAe,EAAE;IACnM,MAAM,YAAY,GAAkB,EAAE,CAAC;IACvC,WAAW,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;QAClC,IAAI,oBAAoB,GAAG,IAAI,CAAC,WAAW,CAAC;QAC5C,IAAI,oBAAoB,IAAI,oBAAoB,CAAC,MAAM,GAAG,EAAE,EAAE,CAAC;YAC7D,oBAAoB,GAAG,oBAAoB,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,KAAK,CAAC;QACvE,CAAC;QACD,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,oBAAC,IAAI,IAAC,SAAS,EAAE,WAAW,CAAC,qBAAqB,CAAC,EAAE,GAAG,EAAE,QAAQ,KAAK,EAAE,IACxH,oBAAoB,CAChB,CAAC,CAAC;QACb,YAAY,CAAC,IAAI,CAAC,oBAAC,IAAI,IAAC,GAAG,EAAE,SAAS,KAAK,EAAE,IAAG,GAAG,SAAS,EAAE,CAAQ,CAAC,CAAC;IAC1E,CAAC,CAAC,CAAC;IACH,iBAAiB;IACjB,YAAY,CAAC,GAAG,EAAE,CAAC;IACnB,OAAO,0CAAG,YAAY,CAAI,CAAC;AAC7B,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,cAAc,GAAG,CAAC,WAAuC,EAAE,SAAiB,EAAU,EAAE;IAC5F,MAAM,SAAS,GAAa,EAAE,CAAC;IAC/B,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QACzB,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACnC,CAAC;IACH,CAAC,CAAC,CAAC;IACH,OAAO,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;AACnC,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,eAAe,GAAG,CAAC,OAA+B,EAAE,YAAyB,EAAE,cAAsB,EAAE,yBAAiC,EAAiB,EAAE;IAC/J,IAAI,SAAS,GAAgC,EAAE,CAAC;IAChD,IAAI,YAAY,GAAG,EAAE,CAAC;IACtB,IAAI,cAAc,KAAK,CAAC,EAAE,CAAC;QACzB,YAAY,GAAG,OAAO,CAAC,UAAU,CAAC;QAClC,SAAS,GAAG;YACV,IAAI,EAAE,YAAY;SACnB,CAAC;IACJ,CAAC;SAAM,IAAI,cAAc,GAAG,CAAC,IAAI,yBAAyB,KAAK,CAAC,EAAE,CAAC;QACjE,YAAY,GAAG,OAAO,CAAC,aAAa,CAAC;QACrC,SAAS,GAAG;YACV,KAAK,EAAE,YAAY;SACpB,CAAC;IACJ,CAAC;SAAM,IAAI,cAAc,GAAG,CAAC,IAAI,yBAAyB,KAAK,CAAC,EAAE,CAAC;QACjE,YAAY,GAAG,OAAO,CAAC,0BAA0B,CAAC;QAClD,SAAS,GAAG;YACV,KAAK,EAAE,YAAY;SACpB,CAAC;IACJ,CAAC;SAAM,IAAI,cAAc,GAAG,CAAC,IAAI,yBAAyB,GAAG,CAAC,EAAE,CAAC;QAC/D,YAAY,GAAG,OAAO,CAAC,2BAA2B,CAAC;QACnD,SAAS,GAAG;YACV,KAAK,EAAE,YAAY;YACnB,SAAS,EAAE,0CAAG,yBAAyB,CAAI;SAC5C,CAAC;IACJ,CAAC;IACD,OAAO,oBAAoB,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;AACvD,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,kBAAkB,GAAG,CAAC,OAA+B,EAAE,WAAmB,EAAE,cAAsB,EAAE,yBAAiC,EAAsB,EAAE;IACjK,IAAI,cAAc,KAAK,CAAC,EAAE,CAAC;QACzB,OAAO,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC;IAC3D,CAAC;IACD,IAAI,cAAc,GAAG,CAAC,IAAI,yBAAyB,KAAK,CAAC,EAAE,CAAC;QAC1D,OAAO,OAAO,CAAC,aAAa,CAAC,OAAO,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;IAC/D,CAAC;IACD,IAAI,cAAc,GAAG,CAAC,IAAI,yBAAyB,KAAK,CAAC,EAAE,CAAC;QAC1D,OAAO,OAAO,CAAC,0BAA0B,CAAC,OAAO,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;IAC5E,CAAC;IACD,IAAI,cAAc,GAAG,CAAC,IAAI,yBAAyB,GAAG,CAAC,EAAE,CAAC;QACxD,OAAO,OAAO,CAAC,2BAA2B,CAAC,OAAO,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC,OAAO,CAAC,aAAa,EAAE,GAAG,yBAAyB,EAAE,CAAC,CAAC;IACpI,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AACF,MAAM,kBAAkB,GAAG,CAAC,WAAuC,EAAE,OAA+B,EAAE,YAA+D,EAAE,MAAmC,EAAe,EAAE;IACzN,MAAM,oBAAoB,GAA+B,EAAE,CAAC;IAC5D,IAAI,mBAAmB,GAAG,CAAC,CAAC;IAC5B,MAAM,GAAG,GAAG,cAAc,EAAE,CAAC;IAC7B,KAAK,MAAM,UAAU,IAAI,WAAW,EAAE,CAAC;QACrC,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC;YAC5B,SAAS;QACX,CAAC;QACD,IAAI,mBAAmB,GAAG,UAAU,CAAC,WAAW,CAAC,MAAM,CAAC;QACxD,gIAAgI;QAChI,IAAI,oBAAoB,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACpC,mBAAmB,IAAI,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC;QAClD,CAAC;QACD,IAAI,mBAAmB,GAAG,mBAAmB,IAAI,8BAA8B,IAAI,oBAAoB,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YACrH,oBAAoB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YACtC,mBAAmB,IAAI,mBAAmB,CAAC;QAC7C,CAAC;aAAM,CAAC;YACN,MAAM;QACR,CAAC;IACH,CAAC;IACD,MAAM,YAAY,GAAgB,eAAe,CAAC,oBAAoB,EAAE,OAAO,CAAC,SAAS,EAAE,YAAY,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,qBAAqB,CAAC,CAAC;IACxI,MAAM,mBAAmB,GAAG,WAAW,CAAC,MAAM,GAAG,oBAAoB,CAAC,MAAM,CAAC;IAC7E,MAAM,YAAY,GAAkB,eAAe,CAAC,OAAO,EAAE,YAAY,EAAE,WAAW,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC;IACpH,MAAM,WAAW,GAAG,kBAAkB,CAAC,OAAO,EAAE,cAAc,CAAC,oBAAoB,EAAE,OAAO,CAAC,SAAS,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC;IAClJ,OAAO,2CAAiB,GAAG,CAAC,eAAe,EAAE,SAAS,EAAE,WAAW,CAAC,0BAA0B,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,YAAY,CAAC,EAAE,GAAG,EAAC,iBAAiB,EAAC,IAAI,EAAC,QAAQ,gBAAa,WAAW,IAC7K,YAAY,CACT,CAAC;AACX,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAe,EAAE;IAC1E,MAAM,EACJ,WAAW,EACX,YAAY,EACZ,MAAM,EACP,GAAG,KAAK,CAAC;IACV,MAAM,EACJ,OAAO,EACR,GAAG,SAAS,EAAE,CAAC;IAChB,MAAM,mBAAmB,GAAG,WAAW,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,UAAU,CAAC,WAAW,KAAK,SAAS,CAAC,CAAC;IACnG,MAAM,kBAAkB,GAAG,kBAAkB,CAAC,mBAAmB,kCAC5D,OAAO,CAAC,eAAe,GACvB,KAAK,CAAC,OAAO,GACf,YAAY,EAAE,MAAM,CAAC,CAAC;IACzB,OAAO,oBAAC,KAAK,IAAC,SAAS,EAAE,WAAW,CAAC,6BAA6B,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,CAAC,IAAG,kBAAkB,CAAS,CAAC;AAClH,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,oBAAoB,GAAG,CAAC,GAAW,EAAE,IAA8B,EAAiB,EAAE;IAC1F,IAAI,CAAC,GAAG,EAAE,CAAC;QACT,OAAO,EAAE,CAAC;IACZ,CAAC;IACD,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,OAAO,EAAE,CAAC;IACZ,CAAC;IACD,MAAM,QAAQ,GAAkB,EAAE,CAAC;IAEnC,uCAAuC;IACvC,MAAM,iBAAiB,GAAG,UAAU,CAAC;IACrC,MAAM,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC;IACxC,IAAI,KAAK,GAA2B,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACpD,IAAI,IAAI,GAAG,CAAC,CAAC;IACb,OAAO,KAAK,KAAK,IAAI,EAAE,CAAC;QACtB,IAAI,IAAI,KAAK,KAAK,CAAC,KAAK,EAAE,CAAC;YACzB,QAAQ,CAAC,IAAI,CAAC,oBAAC,IAAI,IAAC,GAAG,EAAE,QAAQ,CAAC,MAAM,IAAG,GAAG,CAAC,SAAS,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,CAAQ,CAAC,CAAC;QACvF,CAAC;QACD,QAAQ,CAAC,IAAI,CAAC,oBAAC,IAAI,IAAC,GAAG,EAAE,QAAQ,CAAC,MAAM,IAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAQ,CAAC,CAAC;QACrG,IAAI,GAAG,KAAK,CAAC,SAAS,CAAC;QACvB,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC1B,CAAC;IACD,QAAQ,CAAC,IAAI,CAAC,oBAAC,IAAI,IAAC,GAAG,EAAE,QAAQ,CAAC,MAAM,IAAG,GAAG,CAAC,SAAS,CAAC,IAAI,CAAC,CAAQ,CAAC,CAAC;IACxE,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { typingIndicatorContainerStyle, typingIndicatorStringStyle } from './styles/TypingIndicator.styles';\nimport React from 'react';\nimport { BaseCustomStyles, CommunicationParticipant } from '../types';\nimport { IStyle, mergeStyles, Stack, Text } from '@fluentui/react';\nimport { useLocale } from '../localization/LocalizationProvider';\nimport { useIdentifiers } from '../identifiers';\nimport { _IObjectMap } from '@internal/acs-ui-common';\n\n/*\n Fluent styles for {@link TypingIndicator}.\n \n @public\n /\nexport interface TypingIndicatorStylesProps extends BaseCustomStyles {\n /* Styles for each typing user's displayName. /\n typingUserDisplayName?: IStyle;\n /* Styles for the typing string. /\n typingString?: IStyle;\n}\n\n/\n Strings of {@link TypingIndicator} that can be overridden.\n \n @public\n /\nexport interface TypingIndicatorStrings {\n /\n String template to use when one user is typing. Placeholders: [user].\n * @example\n * ```\n * <TypingIndicator\n * strings={{ multipleUsersAbbreviateOne: '{users} is typing...' }}\n * typingUsers={[{ userId: 'user1', displayName: 'Claire' }]}\n * />\n * ```\n * would be 'Claire is typing...'\n /\n singleUser: string;\n /\n * String template to use when multiple users are typing. Placeholders: [users].\n * @example\n * ```\n * <TypingIndicator\n * strings={{ multipleUsers: '{users} are typing...' }}\n * typingUsers={[\n * { userId: 'user1', displayName: 'Claire' },\n * { userId: 'user2', displayName: 'Christopher' }\n * ]}\n * />\n * ```\n * would be 'Claire, Chris are typing...'\n /\n multipleUsers: string;\n /\n * String template to use when multiple users are typing with one other user abbreviated. Placeholders: [users].\n * @example\n * ```typescript\n * <TypingIndicator\n * strings={{ multipleUsersAbbreviateOne: '{users} and 1 other are typing...' }}\n * typingUsers={[\n * { userId: 'user1', displayName: 'Claire Romanov' },\n * { userId: 'user2', displayName: 'Christopher Rutherford' }\n * ]}\n * />\n * ```\n * would be 'Claire Romanov and 1 other are typing...'\n /\n multipleUsersAbbreviateOne: string;\n /\n * String template to use when multiple users are typing with one other user abbreviated. Placeholders: [users, numOthers].\n * @example\n * ```\n * <TypingIndicator\n * strings={{ multipleUsersAbbreviateMany: '{users} and {numOthers} others are typing...' }}\n * typingUsers={[\n * { userId: 'user1', displayName: 'Claire Romanov' },\n * { userId: 'user2', displayName: 'Christopher Rutherford' },\n * { userId: 'user3', displayName: 'Jill Vernblom' }\n * ]}\n * />\n * ```\n * would be 'Claire Romanov and 2 others are typing...'\n /\n multipleUsersAbbreviateMany: string;\n /\n * String to use as delimiter to separate multiple users.\n * @example\n * ```\n * <TypingIndicator\n * strings={{ delimiter: ' + ' }}\n * typingUsers={[\n * { userId: 'user1', displayName: 'Claire' },\n * { userId: 'user2', displayName: 'Chris' },\n * { userId: 'user3', displayName: 'Jill' }\n * ]}\n * />\n * ```\n * would be 'Claire + Chris + Jill are typing...'\n /\n delimiter: string;\n}\n\n/\n * Props for {@link TypingIndicator}.\n \n @public\n /\nexport interface TypingIndicatorProps {\n /* List of the typing users. /\n typingUsers: CommunicationParticipant[];\n /* Callback to render typing users /\n onRenderUser?: (users: CommunicationParticipant) => JSX.Element;\n /\n Allows users to pass in an object contains custom CSS styles.\n * @Example\n * ```\n * <TypingIndicator styles={{ root: { background: 'blue' } }} />\n * ```\n /\n styles?: TypingIndicatorStylesProps;\n\n /\n Optional strings to override in component\n /\n strings?: Partial<TypingIndicatorStrings>;\n}\nconst MAXIMUM_LENGTH_OF_TYPING_USERS = 35;\n\n/\n Helper function to create element wrapping all typing users\n * @param typingUsers typing users\n * @param delimiter string to separate typing users\n * @param onRenderUser optional callback to render each typing user\n * @param userDisplayNameStyles optional additional IStyle to apply to each element containing users name\n * @returns element wrapping all typing users\n /\nconst getUsersElement = (typingUsers: CommunicationParticipant[], delimiter: string, onRenderUser?: (users: CommunicationParticipant) => JSX.Element, userDisplayNameStyles?: IStyle): JSX.Element => {\n const userElements: JSX.Element[] = [];\n typingUsers.forEach((user, index) => {\n let truncatedDisplayName = user.displayName;\n if (truncatedDisplayName && truncatedDisplayName.length > 50) {\n truncatedDisplayName = truncatedDisplayName.substring(0, 50) + '...';\n }\n userElements.push(onRenderUser ? onRenderUser(user) : <Text className={mergeStyles(userDisplayNameStyles)} key={`user-${index}`}>\n {truncatedDisplayName}\n </Text>);\n userElements.push(<Text key={`comma-${index}`}>{`${delimiter}`}</Text>);\n });\n // pop last comma\n userElements.pop();\n return <>{userElements}</>;\n};\n\n/\n Helper function to get a string of all typing users\n * @param typingUsers typing users\n * @param delimiter string to separate typing users\n * @returns string of all typing users\n /\nconst getNamesString = (typingUsers: CommunicationParticipant[], delimiter: string): string => {\n const userNames: string[] = [];\n typingUsers.forEach(user => {\n if (user.displayName) {\n userNames.push(user.displayName);\n }\n });\n return userNames.join(delimiter);\n};\n\n/\n Helper function to create span elements making up the typing indicator string\n * @param strings TypingIndicatorStrings containing strings to create span elements\n * @param usersElement JSX.Element containing all typing users\n * @param numTypingUsers number of total typing users\n * @param numUserNotMentioned number of typing users abbreviated\n * @returns array of span elements making up the typing indicator string\n /\nconst getSpanElements = (strings: TypingIndicatorStrings, usersElement: JSX.Element, numTypingUsers: number, numTypingUsersAbbreviated: number): JSX.Element[] => {\n let variables: Record<string, JSX.Element> = {};\n let typingString = '';\n if (numTypingUsers === 1) {\n typingString = strings.singleUser;\n variables = {\n user: usersElement\n };\n } else if (numTypingUsers > 1 && numTypingUsersAbbreviated === 0) {\n typingString = strings.multipleUsers;\n variables = {\n users: usersElement\n };\n } else if (numTypingUsers > 1 && numTypingUsersAbbreviated === 1) {\n typingString = strings.multipleUsersAbbreviateOne;\n variables = {\n users: usersElement\n };\n } else if (numTypingUsers > 1 && numTypingUsersAbbreviated > 1) {\n typingString = strings.multipleUsersAbbreviateMany;\n variables = {\n users: usersElement,\n numOthers: <>{numTypingUsersAbbreviated}</>\n };\n }\n return formatInlineElements(typingString, variables);\n};\n\n/\n Helper function to get the string making up the typing indicator string\n * @param strings TypingIndicatorStrings containing strings to create span elements\n * @param namesString string of all typing users\n * @param numTypingUsers number of total typing users\n * @param numUserNotMentioned number of typing users abbreviated\n * @returns typing indicator string\n /\nconst getIndicatorString = (strings: TypingIndicatorStrings, namesString: string, numTypingUsers: number, numTypingUsersAbbreviated: number): string \| undefined => {\n if (numTypingUsers === 1) {\n return strings.singleUser.replace('{user}', namesString);\n }\n if (numTypingUsers > 1 && numTypingUsersAbbreviated === 0) {\n return strings.multipleUsers.replace('{users}', namesString);\n }\n if (numTypingUsers > 1 && numTypingUsersAbbreviated === 1) {\n return strings.multipleUsersAbbreviateOne.replace('{users}', namesString);\n }\n if (numTypingUsers > 1 && numTypingUsersAbbreviated > 1) {\n return strings.multipleUsersAbbreviateMany.replace('{users}', namesString).replace('{numOthers}', `${numTypingUsersAbbreviated}`);\n }\n return undefined;\n};\nconst IndicatorComponent = (typingUsers: CommunicationParticipant[], strings: TypingIndicatorStrings, onRenderUser?: (users: CommunicationParticipant) => JSX.Element, styles?: TypingIndicatorStylesProps): JSX.Element => {\n const typingUsersMentioned: CommunicationParticipant[] = [];\n let totalCharacterCount = 0;\n const ids = useIdentifiers();\n for (const typingUser of typingUsers) {\n if (!typingUser.displayName) {\n continue;\n }\n let additionalCharCount = typingUser.displayName.length;\n // The typing users will be separated by the delimiter. We account for that additional length when we generate the final string.\n if (typingUsersMentioned.length > 0) {\n additionalCharCount += strings.delimiter.length;\n }\n if (totalCharacterCount + additionalCharCount <= MAXIMUM_LENGTH_OF_TYPING_USERS \|\| typingUsersMentioned.length === 0) {\n typingUsersMentioned.push(typingUser);\n totalCharacterCount += additionalCharCount;\n } else {\n break;\n }\n }\n const usersElement: JSX.Element = getUsersElement(typingUsersMentioned, strings.delimiter, onRenderUser, styles?.typingUserDisplayName);\n const numUserNotMentioned = typingUsers.length - typingUsersMentioned.length;\n const spanElements: JSX.Element[] = getSpanElements(strings, usersElement, typingUsers.length, numUserNotMentioned);\n const labelString = getIndicatorString(strings, getNamesString(typingUsersMentioned, strings.delimiter), typingUsers.length, numUserNotMentioned);\n return <div data-ui-id={ids.typingIndicator} className={mergeStyles(typingIndicatorStringStyle, styles?.typingString)} key=\"typingStringKey\" role=\"status\" aria-label={labelString}>\n {spanElements}\n </div>;\n};\n\n/\n Component to notify local user when one or more participants in the chat thread are typing.\n \n @public\n /\nexport const TypingIndicator = (props: TypingIndicatorProps): JSX.Element => {\n const {\n typingUsers,\n onRenderUser,\n styles\n } = props;\n const {\n strings\n } = useLocale();\n const typingUsersToRender = typingUsers.filter(typingUser => typingUser.displayName !== undefined);\n const indicatorComponent = IndicatorComponent(typingUsersToRender, {\n ...strings.typingIndicator,\n ...props.strings\n }, onRenderUser, styles);\n return <Stack className={mergeStyles(typingIndicatorContainerStyle, styles?.root)}>{indicatorComponent}</Stack>;\n};\n\n/\n Create an array of span elements by replacing the pattern \"\\{\\}\" in str with the elements\n * passed in as vars and creating inline elements from the rest\n \n @param str - The string to be formatted\n * @param vars - Variables to use to format the string\n * @returns formatted JSX elements\n */\nconst formatInlineElements = (str: string, vars: _IObjectMap<JSX.Element>): JSX.Element[] => {\n if (!str) {\n return [];\n }\n if (!vars) {\n return [];\n }\n const elements: JSX.Element[] = [];\n\n // regex to search for the pattern \"{}\"\n const placeholdersRegex = /{(\\w+)}/g;\n const regex = RegExp(placeholdersRegex);\n let array: RegExpExecArray \| null = regex.exec(str);\n let prev = 0;\n while (array !== null) {\n if (prev !== array.index) {\n elements.push(<Text key={elements.length}>{str.substring(prev, array.index)}</Text>);\n }\n elements.push(<Text key={elements.length}>{vars[array[0].substring(1, array[0].length - 1)]}</Text>);\n prev = regex.lastIndex;\n array = regex.exec(str);\n }\n elements.push(<Text key={elements.length}>{str.substring(prev)}</Text>);\n return elements;\n};"]}

package/dist/dist-esm/react-components/src/components/UnsupportedBrowser.js CHANGED Viewed

@@ -11,11 +11,9 @@ import { UnsupportedEnvironment } from './UnsupportedEnvironment';
 export const UnsupportedBrowser = (props) => {
     const { onTroubleshootingClick, strings } = props;
     const locale = useLocale();
-    return (React.createElement(UnsupportedEnvironment, { onTroubleshootingClick: onTroubleshootingClick, strings: Object.assign(Object.assign({}, unsupportedBrowserStringsTrampoline(locale)), strings) }));
+    return React.createElement(UnsupportedEnvironment, { onTroubleshootingClick: onTroubleshootingClick, strings: Object.assign(Object.assign({}, unsupportedBrowserStringsTrampoline(locale)), strings) });
 };
 const unsupportedBrowserStringsTrampoline = (locale) => {
-    /* @conditional-compile-remove(unsupported-browser) */
-    return locale.strings.UnsupportedBrowser;
     return {
         primaryText: '',
         secondaryText: '',

package/dist/dist-esm/react-components/src/components/UnsupportedBrowser.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UnsupportedBrowser.js","sourceRoot":"","sources":["~~../../../../../../~~react-components/src/components/UnsupportedBrowser.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAmB,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AA4BlE;;;;GAIG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAe,EAAE;IAChF,MAAM,~~EAAE~~,sBAAsB,~~EAAE~~,OAAO,~~EAAE~~,GAAG,KAAK,CAAC;~~IAClD~~,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,OAAO,~~CACL,~~oBAAC,sBAAsB,~~IACrB~~,sBAAsB,EAAE,sBAAsB,~~EAC9C~~,OAAO,~~kCAAO~~,mCAAmC,CAAC,MAAM,CAAC,~~GAAK~~,OAAO,~~IACrE~~,~~CACH,~~CAAC;~~AACJ~~,CAAC,CAAC;~~AAEF~~,MAAM,mCAAmC,GAAG,CAAC,MAAuB,EAA6B,EAAE;IACjG,~~sDAAsD;IACtD,~~OAAO~~,MAAM,CAAC,OAAO,CAAC,kBAAkB,CAAC~~;~~IACzC,OAAO;~~QACL,WAAW,EAAE,EAAE;QACf,aAAa,EAAE,EAAE;QACjB,gBAAgB,EAAE,EAAE;KACrB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport React from 'react';\nimport { ComponentLocale, useLocale } from '../localization';\nimport { UnsupportedEnvironment } from './UnsupportedEnvironment';\n\n/*\n Strings for UnsupportedBrowser component\n \n @beta\n /\nexport interface UnsupportedBrowserStrings {\n /* String for the primary text /\n primaryText: string;\n /* String for the secondary text /\n secondaryText: string;\n /* String to display in the text for the help link /\n moreHelpLinkText: string;\n}\n\n/\n props for {@link UnsupportedBrowser} UI\n \n @beta\n /\nexport interface UnsupportedBrowserProps {\n /* Handler to perform an action when the help link is actioned /\n onTroubleshootingClick?: () => void;\n /* String overrides for the component /\n strings?: UnsupportedBrowserStrings;\n}\n\n/\n UI to display to the user that the browser they are using is not supported by Azure Communications Calling service.\n \n @beta\n /\nexport const UnsupportedBrowser = (props: UnsupportedBrowserProps): JSX.Element => {\n const { onTroubleshootingClick, strings } = props;\n const locale = useLocale();\n return ~~(\n~~ <UnsupportedEnvironment\n onTroubleshootingClick={onTroubleshootingClick}\n strings={{ ...unsupportedBrowserStringsTrampoline(locale), ...strings }}\n ~~/>\n~~ ~~);\~~n};\n\nconst unsupportedBrowserStringsTrampoline = (locale: ComponentLocale): UnsupportedBrowserStrings => {\n ~~/ @conditional-compile-remove(unsupported-browser) */\n~~ return ~~locale.strings.UnsupportedBrowser;\n return~~ {\n primaryText: '',\n secondaryText: '',\n moreHelpLinkText: ''\n };\n}~~;\n~~"]}
1	+ {"version":3,"file":"UnsupportedBrowser.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/UnsupportedBrowser.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAmB,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AA4BlE;;;;GAIG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAe,EAAE;IAChF,MAAM,EACJ,sBAAsB,EACtB,OAAO,EACR,GAAG,KAAK,CAAC;IACV,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,OAAO,oBAAC,sBAAsB,IAAC,sBAAsB,EAAE,sBAAsB,EAAE,OAAO,kCACjF,mCAAmC,CAAC,MAAM,CAAC,GAC3C,OAAO,IACP,CAAC;AACR,CAAC,CAAC;AACF,MAAM,mCAAmC,GAAG,CAAC,MAAuB,EAA6B,EAAE;IACjG,OAAO;QACL,WAAW,EAAE,EAAE;QACf,aAAa,EAAE,EAAE;QACjB,gBAAgB,EAAE,EAAE;KACrB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport React from 'react';\nimport { ComponentLocale, useLocale } from '../localization';\nimport { UnsupportedEnvironment } from './UnsupportedEnvironment';\n\n/*\n Strings for UnsupportedBrowser component\n \n @beta\n /\nexport interface UnsupportedBrowserStrings {\n /* String for the primary text /\n primaryText: string;\n /* String for the secondary text /\n secondaryText: string;\n /* String to display in the text for the help link /\n moreHelpLinkText: string;\n}\n\n/\n props for {@link UnsupportedBrowser} UI\n \n @beta\n /\nexport interface UnsupportedBrowserProps {\n /* Handler to perform an action when the help link is actioned /\n onTroubleshootingClick?: () => void;\n /* String overrides for the component /\n strings?: UnsupportedBrowserStrings;\n}\n\n/\n UI to display to the user that the browser they are using is not supported by Azure Communications Calling service.\n \n @beta\n */\nexport const UnsupportedBrowser = (props: UnsupportedBrowserProps): JSX.Element => {\n const {\n onTroubleshootingClick,\n strings\n } = props;\n const locale = useLocale();\n return <UnsupportedEnvironment onTroubleshootingClick={onTroubleshootingClick} strings={{\n ...unsupportedBrowserStringsTrampoline(locale),\n ...strings\n }} />;\n};\nconst unsupportedBrowserStringsTrampoline = (locale: ComponentLocale): UnsupportedBrowserStrings => {\n return {\n primaryText: '',\n secondaryText: '',\n moreHelpLinkText: ''\n };\n};"]}

package/dist/dist-esm/react-components/src/components/UnsupportedBrowserVersion.js CHANGED Viewed

@@ -12,11 +12,9 @@ import { UnsupportedEnvironment } from './UnsupportedEnvironment';
 export const UnsupportedBrowserVersion = (props) => {
     const { onTroubleshootingClick, strings, onContinueAnywayClick } = props;
     const locale = useLocale();
-    return (React.createElement(UnsupportedEnvironment, { onTroubleshootingClick: onTroubleshootingClick, strings: Object.assign(Object.assign({}, unsupportedBrowserVersionStringsTrampoline(locale)), strings), onContinueAnywayClick: onContinueAnywayClick }));
+    return React.createElement(UnsupportedEnvironment, { onTroubleshootingClick: onTroubleshootingClick, strings: Object.assign(Object.assign({}, unsupportedBrowserVersionStringsTrampoline(locale)), strings), onContinueAnywayClick: onContinueAnywayClick });
 };
 const unsupportedBrowserVersionStringsTrampoline = (locale) => {
-    /* @conditional-compile-remove(unsupported-browser) */
-    return locale.strings.UnsupportedBrowserVersion;
     return {
         primaryText: '',
         secondaryText: '',

package/dist/dist-esm/react-components/src/components/UnsupportedBrowserVersion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UnsupportedBrowserVersion.js","sourceRoot":"","sources":["~~../../../../../../~~react-components/src/components/UnsupportedBrowserVersion.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAmB,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAgClE;;;;;GAKG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,KAAqC,EAAe,EAAE;IAC9F,MAAM,~~EAAE~~,sBAAsB,~~EAAE~~,OAAO,~~EAAE~~,qBAAqB,~~EAAE~~,GAAG,KAAK,CAAC;~~IACzE~~,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,OAAO,~~CACL,~~oBAAC,sBAAsB,~~IACrB~~,sBAAsB,EAAE,sBAAsB,~~EAC9C~~,OAAO,~~kCAAO~~,0CAA0C,CAAC,MAAM,CAAC,~~GAAK~~,OAAO,~~GAC5E~~,qBAAqB,EAAE,qBAAqB,~~GAC5C~~,~~CACH,~~CAAC;~~AACJ~~,CAAC,CAAC;~~AAEF~~,MAAM,0CAA0C,GAAG,CAAC,MAAuB,EAAoC,EAAE;IAC/G,~~sDAAsD;IACtD,~~OAAO~~,MAAM,CAAC,OAAO,CAAC,yBAAyB,CAAC~~;~~IAChD,OAAO;~~QACL,WAAW,EAAE,EAAE;QACf,aAAa,EAAE,EAAE;QACjB,gBAAgB,EAAE,EAAE;QACpB,wBAAwB,EAAE,EAAE;KAC7B,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport React from 'react';\nimport { ComponentLocale, useLocale } from '../localization';\nimport { UnsupportedEnvironment } from './UnsupportedEnvironment';\n\n/*\n Strings for UnsupportedBrowser component\n \n @beta\n /\nexport interface UnsupportedBrowserVersionStrings {\n /* String for the primary text /\n primaryText: string;\n /* String for the secondary text /\n secondaryText: string;\n /* String to display in the text for the help link /\n moreHelpLinkText: string;\n /* String for continue without updating button /\n continueAnywayButtonText?: string;\n}\n\n/\n props for {@link UnsupportedBrowserVersion} UI\n \n @beta\n /\nexport interface UnsupportedBrowserVersionProps {\n /* Handler to perform an action when the help link is actioned /\n onTroubleshootingClick?: () => void;\n /* String overrides for the component /\n strings?: UnsupportedBrowserVersionStrings;\n /* Handler to allow user to continue into the call /\n onContinueAnywayClick?: () => void;\n}\n\n/\n UI to display to the user that the browser version they are using is out of date\n * and not supported by Azure Communications Calling service.\n \n @beta\n /\nexport const UnsupportedBrowserVersion = (props: UnsupportedBrowserVersionProps): JSX.Element => {\n const { onTroubleshootingClick, strings, onContinueAnywayClick } = props;\n const locale = useLocale();\n return ~~(\n~~ <UnsupportedEnvironment\n onTroubleshootingClick={onTroubleshootingClick}\n strings={{ ...unsupportedBrowserVersionStringsTrampoline(locale), ...strings }}\n onContinueAnywayClick={onContinueAnywayClick}\n ~~/>\n );\n~~};\n\nconst unsupportedBrowserVersionStringsTrampoline = (locale: ComponentLocale): UnsupportedBrowserVersionStrings => {\n ~~/ @conditional-compile-remove(unsupported-browser) */\n~~ return ~~locale.strings.UnsupportedBrowserVersion;\n return~~ {\n primaryText: '',\n secondaryText: '',\n moreHelpLinkText: '',\n continueAnywayButtonText: ''\n };\n}~~;\n~~"]}
1	+ {"version":3,"file":"UnsupportedBrowserVersion.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/UnsupportedBrowserVersion.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAmB,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAgClE;;;;;GAKG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,KAAqC,EAAe,EAAE;IAC9F,MAAM,EACJ,sBAAsB,EACtB,OAAO,EACP,qBAAqB,EACtB,GAAG,KAAK,CAAC;IACV,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,OAAO,oBAAC,sBAAsB,IAAC,sBAAsB,EAAE,sBAAsB,EAAE,OAAO,kCACjF,0CAA0C,CAAC,MAAM,CAAC,GAClD,OAAO,GACT,qBAAqB,EAAE,qBAAqB,GAAI,CAAC;AACtD,CAAC,CAAC;AACF,MAAM,0CAA0C,GAAG,CAAC,MAAuB,EAAoC,EAAE;IAC/G,OAAO;QACL,WAAW,EAAE,EAAE;QACf,aAAa,EAAE,EAAE;QACjB,gBAAgB,EAAE,EAAE;QACpB,wBAAwB,EAAE,EAAE;KAC7B,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport React from 'react';\nimport { ComponentLocale, useLocale } from '../localization';\nimport { UnsupportedEnvironment } from './UnsupportedEnvironment';\n\n/*\n Strings for UnsupportedBrowser component\n \n @beta\n /\nexport interface UnsupportedBrowserVersionStrings {\n /* String for the primary text /\n primaryText: string;\n /* String for the secondary text /\n secondaryText: string;\n /* String to display in the text for the help link /\n moreHelpLinkText: string;\n /* String for continue without updating button /\n continueAnywayButtonText?: string;\n}\n\n/\n props for {@link UnsupportedBrowserVersion} UI\n \n @beta\n /\nexport interface UnsupportedBrowserVersionProps {\n /* Handler to perform an action when the help link is actioned /\n onTroubleshootingClick?: () => void;\n /* String overrides for the component /\n strings?: UnsupportedBrowserVersionStrings;\n /* Handler to allow user to continue into the call /\n onContinueAnywayClick?: () => void;\n}\n\n/\n UI to display to the user that the browser version they are using is out of date\n * and not supported by Azure Communications Calling service.\n \n @beta\n */\nexport const UnsupportedBrowserVersion = (props: UnsupportedBrowserVersionProps): JSX.Element => {\n const {\n onTroubleshootingClick,\n strings,\n onContinueAnywayClick\n } = props;\n const locale = useLocale();\n return <UnsupportedEnvironment onTroubleshootingClick={onTroubleshootingClick} strings={{\n ...unsupportedBrowserVersionStringsTrampoline(locale),\n ...strings\n }} onContinueAnywayClick={onContinueAnywayClick} />;\n};\nconst unsupportedBrowserVersionStringsTrampoline = (locale: ComponentLocale): UnsupportedBrowserVersionStrings => {\n return {\n primaryText: '',\n secondaryText: '',\n moreHelpLinkText: '',\n continueAnywayButtonText: ''\n };\n};"]}