@azure/communication-react 1.7.1-alpha-202308240011 → 1.7.1-alpha-202308250012

package/dist/dist-esm/react-composites/src/composites/localization/locales/en-US/strings.json

@@ -100,16 +100,18 @@
         "startCaptionsButtonOffLabel": "Turn off captions",
         "startCaptionsButtonTooltipOnContent": "Turn off captions",
         "startCaptionsButtonTooltipOffContent": "Turn on captions",
-        "captionsSettingsModalTitle": "What language is being spoken?",
-        "captionsSettingsDropdownLabel": "Spoken language",
-        "captionsSettingsDropdownInfoText": "Language that everyone on this call is speaking.",
+        "captionsSettingsModalTitle": "Captions Settings",
+        "captionsSettingsSpokenLanguageDropdownLabel": "Spoken language",
+        "captionsSettingsCaptionLanguageDropdownLabel": "Captions language",
+        "captionsSettingsSpokenLanguageDropdownInfoText": "Language that everyone on this call is speaking.",
+        "captionsSettingsCaptionLanguageDropdownInfoText": "Captions will appear in this langugage.",
         "captionsSettingsConfirmButtonLabel": "Confirm",
         "captionsSettingsCancelButtonLabel": "Cancel",
         "captionsSettingsModalAriaLabel": "Captions Setting Modal",
         "captionsSettingsCloseModalButtonAriaLabel": "Close Captions Setting",
         "captionsBannerMoreButtonCallingLabel": "More",
         "captionsBannerMoreButtonTooltip": "More options",
-        "captionsAvailableLanguageStrings": {
+        "spokenLanguageStrings": {
             "ar-ae": "Arabic - U.A.E.",
             "ar-sa": "Arabic - Saudi Arabia",
             "da-dk": "Danish",
@@ -152,6 +154,40 @@
             "sk-sk": "Slovak",
             "zh-tw": "Chinese - Taiwan"
         },
+        "captionLanguageStrings": {
+            "ar": "Arabic",
+            "da": "Danish",
+            "de": "German",
+            "en": "English",
+            "es": "Spanish",
+            "fi": "Finnish",
+            "fr-ca": "French - Canada",
+            "fr": "French - France",
+            "hi": "Hindi",
+            "it": "Italian",
+            "ja": "Japanese",
+            "ko": "Korean",
+            "nb": "Norwegian (Bokmål)",
+            "nl": "Dutch",
+            "pl": "Polish",
+            "pt": "Portuguese - Brazil",
+            "ru": "Russian",
+            "sv": "Swedish",
+            "zh-Hans": "Chinese (Simplified)",
+            "zh-Hant": "Chinese (Traditional)",
+            "cs": "Czech",
+            "pt-pt": "Portuguese - Portugal",
+            "tr": "Turkish",
+            "vi": "Vietnamese",
+            "th": "Thai",
+            "he": "Hebrew",
+            "cy": "Welsh",
+            "uk": "Ukrainian",
+            "el": "Greek",
+            "hu": "Hungarian",
+            "ro": "Romanian",
+            "sk": "Slovak"
+        },
         "captionsBannerSpinnerText": "Starting captions...",
         "transferPageTransferorText": "Transferring...",
         "transferPageTransferTargetText": "Connecting...",
@@ -194,6 +230,7 @@
         "moreDrawerSpeakerMenuTitle": "Speaker",
         "moreDrawerCaptionsMenuTitle": "Live captions",
         "moreDrawerSpokenLanguageMenuTitle": "Spoken language",
+        "moreDrawerCaptionLanguageMenuTitle": "Caption language",
         "peopleButtonLabel": "People",
         "selectedPeopleButtonLabel": "People Button Selected",
         "peopleButtonTooltipOpen": "Show participants",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@azure/communication-react",
-  "version": "1.7.1-alpha-202308240011",
+  "version": "1.7.1-alpha-202308250012",
   "sideEffects": false,
   "description": "React library for building modern communication user experiences utilizing Azure Communication Services",
   "keywords": [
@@ -95,13 +95,13 @@
     "@azure/core-auth": "^1.4.0",
     "@babel/cli": "~7.16.0",
     "@babel/core": "~7.16.0",
-    "@internal/calling-component-bindings": "1.7.1-alpha-202308240011",
-    "@internal/calling-stateful-client": "1.7.1-alpha-202308240011",
-    "@internal/chat-component-bindings": "1.7.1-alpha-202308240011",
-    "@internal/chat-stateful-client": "1.7.1-alpha-202308240011",
-    "@internal/fake-backends": "1.7.1-alpha-202308240011",
-    "@internal/react-components": "1.7.1-alpha-202308240011",
-    "@internal/react-composites": "1.7.1-alpha-202308240011",
+    "@internal/calling-component-bindings": "1.7.1-alpha-202308250012",
+    "@internal/calling-stateful-client": "1.7.1-alpha-202308250012",
+    "@internal/chat-component-bindings": "1.7.1-alpha-202308250012",
+    "@internal/chat-stateful-client": "1.7.1-alpha-202308250012",
+    "@internal/fake-backends": "1.7.1-alpha-202308250012",
+    "@internal/react-components": "1.7.1-alpha-202308250012",
+    "@internal/react-composites": "1.7.1-alpha-202308250012",
     "@fluentui/react-northstar": "0.61.0",
     "@microsoft/api-documenter": "~7.12.11",
     "@microsoft/api-extractor": "~7.18.0",

package/dist/dist-esm/react-composites/src/composites/common/Drawer/SpokenLanguageDrawer.d.ts

@@ -1,19 +0,0 @@
-import { CaptionsAvailableLanguageStrings } from "../../../../../react-components/src";
-/** @private */
-export interface SpokenLanguageDrawerStrings {
-    /**
-     * Label for spokenLanguage drawerMenuItem
-     *
-     * @remarks Only displayed when in Teams call, disabled until captions is on
-     */
-    spokenLanguageMenuTitle: string;
-}
-/** @private */
-export declare const SpokenLanguageDrawer: (props: {
-    setCurrentSpokenLanguage: (language: string) => void;
-    currentSpokenLanguage: string;
-    onLightDismiss: () => void;
-    strings?: SpokenLanguageDrawerStrings | undefined;
-    supportedLanguageStrings?: CaptionsAvailableLanguageStrings | undefined;
-}) => JSX.Element;
-//# sourceMappingURL=SpokenLanguageDrawer.d.ts.map

package/dist/dist-esm/react-composites/src/composites/common/Drawer/SpokenLanguageDrawer.js

@@ -1,55 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT license.
-import React from 'react';
-/* @conditional-compile-remove(close-captions) */
-import { useMemo, useCallback } from 'react';
-/* @conditional-compile-remove(close-captions) */
-import { useTheme } from "../../../../../react-components/src";
-/* @conditional-compile-remove(close-captions) */
-import { _CaptionsSettingsModal } from "../../../../../react-components/src";
-/* @conditional-compile-remove(close-captions) */
-import { _changeSpokenLanguageSelector } from "../../../../../calling-component-bindings/src";
-/* @conditional-compile-remove(close-captions) */
-import { _DrawerMenu as DrawerMenu } from "../../../../../react-components/src";
-/* @conditional-compile-remove(close-captions) */
-import { useAdaptedSelector } from '../../CallComposite/hooks/useAdaptedSelector';
-/* @conditional-compile-remove(close-captions) */
-import { useHandlers } from '../../CallComposite/hooks/useHandlers';
-/* @conditional-compile-remove(close-captions) */
-import { spokenLanguageDrawerStyles } from './SpokenLanguageDrawer.styles';
-/** @private */
-export const SpokenLanguageDrawer = (props) => {
-    var _a;
-    /* @conditional-compile-remove(close-captions) */
-    const theme = useTheme();
-    /* @conditional-compile-remove(close-captions) */
-    const changeSpokenLanguageProps = useAdaptedSelector(_changeSpokenLanguageSelector);
-    /* @conditional-compile-remove(close-captions) */
-    const changeSpokenLanguageHandlers = useHandlers(_CaptionsSettingsModal);
-    /* @conditional-compile-remove(close-captions) */
-    const onSpokenLanguageDrawerItemClick = useCallback((languageCode) => {
-        props.setCurrentSpokenLanguage(languageCode);
-    }, [props]);
-    /* @conditional-compile-remove(close-captions) */
-    const spokenLanguageDrawerItems = useMemo(() => {
-        var _a;
-        return (_a = changeSpokenLanguageProps === null || changeSpokenLanguageProps === void 0 ? void 0 : changeSpokenLanguageProps.supportedSpokenLanguages) === null || _a === void 0 ? void 0 : _a.map((languageCode) => ({
-            itemKey: languageCode,
-            text: props.supportedLanguageStrings ? props.supportedLanguageStrings[languageCode] : languageCode,
-            onItemClick: () => onSpokenLanguageDrawerItemClick(languageCode),
-            secondaryIconProps: props.currentSpokenLanguage === languageCode ? { iconName: 'Accept' } : undefined
-        }));
-    }, [
-        changeSpokenLanguageProps === null || changeSpokenLanguageProps === void 0 ? void 0 : changeSpokenLanguageProps.supportedSpokenLanguages,
-        props.currentSpokenLanguage,
-        props.supportedLanguageStrings,
-        onSpokenLanguageDrawerItemClick
-    ]);
-    /* @conditional-compile-remove(close-captions) */
-    return (React.createElement(DrawerMenu, { heading: (_a = props.strings) === null || _a === void 0 ? void 0 : _a.spokenLanguageMenuTitle, items: spokenLanguageDrawerItems !== null && spokenLanguageDrawerItems !== void 0 ? spokenLanguageDrawerItems : [], onLightDismiss: () => {
-            changeSpokenLanguageHandlers.onSetSpokenLanguage(props.currentSpokenLanguage);
-            props.onLightDismiss();
-        }, styles: spokenLanguageDrawerStyles(theme) }));
-    return React.createElement(React.Fragment, null);
-};
-//# sourceMappingURL=SpokenLanguageDrawer.js.map

package/dist/dist-esm/react-composites/src/composites/common/Drawer/SpokenLanguageDrawer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SpokenLanguageDrawer.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/common/Drawer/SpokenLanguageDrawer.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,iDAAiD;AACjD,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC7C,iDAAiD;AACjD,OAAO,EAAE,QAAQ,EAAE,4CAAmC;AACtD,iDAAiD;AACjD,OAAO,EAAE,sBAAsB,EAAoC,4CAAmC;AACtG,iDAAiD;AACjD,OAAO,EAAE,6BAA6B,EAAE,sDAA6C;AACrF,iDAAiD;AACjD,OAAO,EACL,WAAW,IAAI,UAAU,EAG1B,4CAAmC;AACpC,iDAAiD;AACjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,8CAA8C,CAAC;AAClF,iDAAiD;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,iDAAiD;AACjD,OAAO,EAAE,0BAA0B,EAAE,MAAM,+BAA+B,CAAC;AAY3E,eAAe;AACf,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAMpC,EAAe,EAAE;;IAChB,iDAAiD;IACjD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,iDAAiD;IACjD,MAAM,yBAAyB,GAAG,kBAAkB,CAAC,6BAA6B,CAAC,CAAC;IACpF,iDAAiD;IACjD,MAAM,4BAA4B,GAAG,WAAW,CAAC,sBAAsB,CAAC,CAAC;IAEzE,iDAAiD;IACjD,MAAM,+BAA+B,GAAG,WAAW,CACjD,CAAC,YAAoB,EAAE,EAAE;QACvB,KAAK,CAAC,wBAAwB,CAAC,YAAY,CAAC,CAAC;IAC/C,CAAC,EACD,CAAC,KAAK,CAAC,CACR,CAAC;IAEF,iDAAiD;IACjD,MAAM,yBAAyB,GAA0B,OAAO,CAAC,GAAG,EAAE;;QACpE,OAAO,MAAA,yBAAyB,aAAzB,yBAAyB,uBAAzB,yBAAyB,CAAE,wBAAwB,0CAAE,GAAG,CAAC,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;YACjF,OAAO,EAAE,YAAY;YACrB,IAAI,EAAE,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,KAAK,CAAC,wBAAwB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,YAAY;YAClG,WAAW,EAAE,GAAG,EAAE,CAAC,+BAA+B,CAAC,YAAY,CAAC;YAChE,kBAAkB,EAAE,KAAK,CAAC,qBAAqB,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,SAAS;SACtG,CAAC,CAAC,CAAC;IACN,CAAC,EAAE;QACD,yBAAyB,aAAzB,yBAAyB,uBAAzB,yBAAyB,CAAE,wBAAwB;QACnD,KAAK,CAAC,qBAAqB;QAC3B,KAAK,CAAC,wBAAwB;QAC9B,+BAA+B;KAChC,CAAC,CAAC;IAEH,iDAAiD;IACjD,OAAO,CACL,oBAAC,UAAU,IACT,OAAO,EAAE,MAAA,KAAK,CAAC,OAAO,0CAAE,uBAAuB,EAC/C,KAAK,EAAE,yBAAyB,aAAzB,yBAAyB,cAAzB,yBAAyB,GAAI,EAAE,EACtC,cAAc,EAAE,GAAG,EAAE;YACnB,4BAA4B,CAAC,mBAAmB,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC;YAC9E,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC,EACD,MAAM,EAAE,0BAA0B,CAAC,KAAK,CAAC,GACzC,CACH,CAAC;IACF,OAAO,yCAAK,CAAC;AACf,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport React from 'react';\n/* @conditional-compile-remove(close-captions) */\nimport { useMemo, useCallback } from 'react';\n/* @conditional-compile-remove(close-captions) */\nimport { useTheme } from '@internal/react-components';\n/* @conditional-compile-remove(close-captions) */\nimport { _CaptionsSettingsModal, CaptionsAvailableLanguageStrings } from '@internal/react-components';\n/* @conditional-compile-remove(close-captions) */\nimport { _changeSpokenLanguageSelector } from '@internal/calling-component-bindings';\n/* @conditional-compile-remove(close-captions) */\nimport {\n  _DrawerMenu as DrawerMenu,\n  _DrawerMenuItemProps as DrawerMenuItemProps,\n  _DrawerMenuStyles\n} from '@internal/react-components';\n/* @conditional-compile-remove(close-captions) */\nimport { useAdaptedSelector } from '../../CallComposite/hooks/useAdaptedSelector';\n/* @conditional-compile-remove(close-captions) */\nimport { useHandlers } from '../../CallComposite/hooks/useHandlers';\n/* @conditional-compile-remove(close-captions) */\nimport { spokenLanguageDrawerStyles } from './SpokenLanguageDrawer.styles';\n\n/** @private */\nexport interface SpokenLanguageDrawerStrings {\n  /**\n   * Label for spokenLanguage drawerMenuItem\n   *\n   * @remarks Only displayed when in Teams call, disabled until captions is on\n   */\n  spokenLanguageMenuTitle: string;\n}\n\n/** @private */\nexport const SpokenLanguageDrawer = (props: {\n  /* @conditional-compile-remove(close-captions) */ setCurrentSpokenLanguage: (language: string) => void;\n  /* @conditional-compile-remove(close-captions) */ currentSpokenLanguage: string;\n  /* @conditional-compile-remove(close-captions) */ onLightDismiss: () => void;\n  /* @conditional-compile-remove(close-captions) */ strings?: SpokenLanguageDrawerStrings;\n  /* @conditional-compile-remove(close-captions) */ supportedLanguageStrings?: CaptionsAvailableLanguageStrings;\n}): JSX.Element => {\n  /* @conditional-compile-remove(close-captions) */\n  const theme = useTheme();\n\n  /* @conditional-compile-remove(close-captions) */\n  const changeSpokenLanguageProps = useAdaptedSelector(_changeSpokenLanguageSelector);\n  /* @conditional-compile-remove(close-captions) */\n  const changeSpokenLanguageHandlers = useHandlers(_CaptionsSettingsModal);\n\n  /* @conditional-compile-remove(close-captions) */\n  const onSpokenLanguageDrawerItemClick = useCallback(\n    (languageCode: string) => {\n      props.setCurrentSpokenLanguage(languageCode);\n    },\n    [props]\n  );\n\n  /* @conditional-compile-remove(close-captions) */\n  const spokenLanguageDrawerItems: DrawerMenuItemProps[] = useMemo(() => {\n    return changeSpokenLanguageProps?.supportedSpokenLanguages?.map((languageCode) => ({\n      itemKey: languageCode,\n      text: props.supportedLanguageStrings ? props.supportedLanguageStrings[languageCode] : languageCode,\n      onItemClick: () => onSpokenLanguageDrawerItemClick(languageCode),\n      secondaryIconProps: props.currentSpokenLanguage === languageCode ? { iconName: 'Accept' } : undefined\n    }));\n  }, [\n    changeSpokenLanguageProps?.supportedSpokenLanguages,\n    props.currentSpokenLanguage,\n    props.supportedLanguageStrings,\n    onSpokenLanguageDrawerItemClick\n  ]);\n\n  /* @conditional-compile-remove(close-captions) */\n  return (\n    <DrawerMenu\n      heading={props.strings?.spokenLanguageMenuTitle}\n      items={spokenLanguageDrawerItems ?? []}\n      onLightDismiss={() => {\n        changeSpokenLanguageHandlers.onSetSpokenLanguage(props.currentSpokenLanguage);\n        props.onLightDismiss();\n      }}\n      styles={spokenLanguageDrawerStyles(theme)}\n    />\n  );\n  return <></>;\n};\n\"../../../../../react-components/src\"\"../../../../../calling-component-bindings/src\""]}

package/dist/dist-esm/react-composites/src/composites/common/Drawer/SpokenLanguageDrawer.styles.d.ts

@@ -1,7 +0,0 @@
-import { Theme } from '@fluentui/react';
-import { _DrawerMenuStyles } from "../../../../../react-components/src";
-/**
- * @private
- */
-export declare const spokenLanguageDrawerStyles: (theme: Theme) => _DrawerMenuStyles;
-//# sourceMappingURL=SpokenLanguageDrawer.styles.d.ts.map

package/dist/dist-esm/react-composites/src/composites/common/Drawer/SpokenLanguageDrawer.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SpokenLanguageDrawer.styles.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/common/Drawer/SpokenLanguageDrawer.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAAE,QAAQ,EAAE,yCAAgC;AAGnD;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,KAAY,EAAqB,EAAE,CAAC,CAAC;IAC9E,IAAI,EAAE;QACJ,QAAQ,EAAE,MAAM;KACjB;IACD,mBAAmB,EAAE;QACnB,sBAAsB,EAAE;YACtB,IAAI,EAAE;gBACJ,IAAI,EAAE;oBACJ,UAAU,EAAE,GAAG;oBACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;oBACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;oBACxB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,WAAW;iBACjC;aACF;SACF;KACF;CACF,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT license.\n\nimport { Theme } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { _DrawerMenuStyles } from '@internal/react-components';\n\n/**\n * @private\n */\nexport const spokenLanguageDrawerStyles = (theme: Theme): _DrawerMenuStyles => ({\n  root: {\n    overflow: 'auto'\n  },\n  drawerSurfaceStyles: {\n    drawerContentContainer: {\n      root: {\n        span: {\n          fontWeight: 600,\n          fontSize: _pxToRem(17),\n          lineHeight: _pxToRem(22),\n          color: theme.palette.neutralDark\n        }\n      }\n    }\n  }\n});\n\"../../../../../acs-ui-common/src\"\"../../../../../react-components/src\""]}