@azure/communication-react 1.4.2-alpha-202211090017.0 → 1.4.2-alpha-202211100016.0

package/dist/communication-react.d.ts

@@ -4336,7 +4336,7 @@ export declare const DEFAULT_COMPONENT_ICONS: {
     SendBoxSend: JSX.Element;
     SendBoxSendHovered: JSX.Element;
     VideoTileMicOff: JSX.Element;
-    BackSpace: JSX.Element;
+    DialpadBackspace: JSX.Element;
     DomainPermissionsSparkle: JSX.Element;
     DomainPermissionCamera: JSX.Element;
     DomainPermissionMic: JSX.Element;
@@ -4431,7 +4431,7 @@ export declare const DEFAULT_COMPOSITE_ICONS: {
     HoldCallContextualMenuItem: JSX.Element;
     HoldCallButton: JSX.Element;
     ResumeCall: JSX.Element;
-    BackSpace: JSX.Element;
+    DialpadBackspace: JSX.Element;
     DomainPermissionsSparkle: JSX.Element;
     DomainPermissionCamera: JSX.Element;
     DomainPermissionMic: JSX.Element;

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

@@ -202,7 +202,7 @@ const _toCommunicationIdentifier = (id) => {
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-var telemetryVersion = '1.4.2-alpha-202211090017.0';
+var telemetryVersion = '1.4.2-alpha-202211100016.0';
 
 // Copyright (c) Microsoft Corporation.
 /**
@@ -2147,7 +2147,7 @@ const DEFAULT_COMPONENT_ICONS = {
     SendBoxSendHovered: React__default['default'].createElement(reactIcons.Send20Filled, null),
     VideoTileMicOff: React__default['default'].createElement(reactIcons.MicOff16Filled, null),
     /* @conditional-compile-remove(dialpad) */ /* @conditional-compile-remove(PSTN-calls) */
-    BackSpace: React__default['default'].createElement(reactIcons.Backspace20Regular, null),
+    DialpadBackspace: React__default['default'].createElement(reactIcons.Backspace20Regular, null),
     /* @conditional-compile-remove(call-readiness) */
     DomainPermissionsSparkle: React__default['default'].createElement(DomainPermissionSparkle20Filled, null),
     /* @conditional-compile-remove(call-readiness) */
@@ -8347,7 +8347,7 @@ const DialpadContainer = (props) => {
                 setText(e.target.value);
             }, placeholder: props.strings.placeholderText, "data-test-id": "dialpad-input", onRenderSuffix: () => {
                 var _a;
-                return (React__default['default'].createElement(React__default['default'].Fragment, null, showDeleteButton && plainTextValue.length !== 0 && (React__default['default'].createElement(react.IconButton, { ariaLabel: props.strings.deleteButtonAriaLabel, onClick: deleteNumbers, styles: react.concatStyleSets(iconButtonStyles(theme), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.deleteIcon), iconProps: { iconName: 'BackSpace' } }))));
+                return (React__default['default'].createElement(React__default['default'].Fragment, null, showDeleteButton && plainTextValue.length !== 0 && (React__default['default'].createElement(react.IconButton, { ariaLabel: props.strings.deleteButtonAriaLabel, onClick: deleteNumbers, styles: react.concatStyleSets(iconButtonStyles(theme), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.deleteIcon), iconProps: { iconName: 'DialpadBackspace' } }))));
             } }),
         React__default['default'].createElement(react.FocusZone, null, dialPadButtonsDefault.map((rows, rowIndex) => {
             return (React__default['default'].createElement(react.Stack, { horizontal: true, key: `row_${rowIndex}`, horizontalAlign: "stretch" }, rows.map((button, columnIndex) => (React__default['default'].createElement(DialpadButton, { key: `button_${columnIndex}`, 
@@ -13613,8 +13613,8 @@ const coffeeIconStyle = {
  * @public
  */
 const COMPOSITE_ONLY_ICONS = {
-    ChevronLeft: React__default['default'].createElement(react.FontIcon, { iconName: "ChevronLeft" }),
-    Link: React__default['default'].createElement(react.FontIcon, { iconName: "Link" }),
+    ChevronLeft: undefined,
+    Link: undefined,
     LobbyScreenConnectingToCall: React__default['default'].createElement(CoffeeIcon, null),
     LobbyScreenWaitingToBeAdmitted: React__default['default'].createElement(CoffeeIcon, null),
     LocalDeviceSettingsCamera: React__default['default'].createElement(reactIcons.Video20Filled, null),
@@ -14582,11 +14582,20 @@ const BaseProvider = (props) => {
     if (alreadyWrapped) {
         return React__default['default'].createElement(React__default['default'].Fragment, null, props.children);
     }
+    /**
+     * Before registering fluent icons, we should check DEFAULT_COMPOSITE_ICONS and strip out the key value pairs where value is undefined
+     */
+    const iconsToRegister = {};
+    Object.entries(DEFAULT_COMPOSITE_ICONS).forEach(([key, value]) => {
+        if (value) {
+            iconsToRegister[key] = value;
+        }
+    });
     /**
      * We register the default icon mappings merged with custom icons provided through props
      * to ensure all icons render correctly.
      */
-    react.registerIcons({ icons: Object.assign(Object.assign({}, DEFAULT_COMPOSITE_ICONS), props.icons) });
+    react.registerIcons({ icons: Object.assign(Object.assign({}, iconsToRegister), props.icons) });
     // we use Customizer to override default LayerHost injected to <body />
     // which stop polluting global dom tree and increase compatibility with react-full-screen
     const CompositeElement = (React__default['default'].createElement(FluentThemeProvider, { fluentTheme: fluentTheme, rtl: rtl },
@@ -15551,6 +15560,32 @@ const isDisabled$2 = (option) => {
     }
     return option.disabled;
 };
+/* @conditional-compile-remove(call-readiness) */
+/**
+ *
+ * This function uses permission API to determine if device permission state is granted, prompt or denied
+ * @returns whether device permission state is granted, prompt or denied
+ * If permission API is not supported on this browser, do nothing and log out error
+ * @private
+ */
+const getDevicePermissionState = (setVideoState, setAudioState) => {
+    navigator.permissions
+        .query({ name: 'camera' })
+        .then((result) => {
+        setVideoState(result.state);
+    })
+        .catch((error) => {
+        console.log(error);
+    });
+    navigator.permissions
+        .query({ name: 'microphone' })
+        .then((result) => {
+        setAudioState(result.state);
+    })
+        .catch((error) => {
+        console.log(error);
+    });
+};
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
@@ -18215,6 +18250,13 @@ const ConfigurationPage = (props) => {
     const options = useAdaptedSelector(getSelector$1(DevicesButton));
     const localDeviceSettingsHandlers = useHandlers();
     const { video: cameraPermissionGranted, audio: microphonePermissionGranted } = useSelector$1(devicePermissionSelector);
+    /* @conditional-compile-remove(call-readiness) */
+    // use permission API to get video and audio permission state
+    const [videoState, setVideoState] = React.useState(undefined);
+    /* @conditional-compile-remove(call-readiness) */
+    const [audioState, setAudioState] = React.useState(undefined);
+    /* @conditional-compile-remove(call-readiness) */
+    getDevicePermissionState(setVideoState, setAudioState);
     let errorBarProps = usePropsFor$1(ErrorBar);
     const adapter = useAdapter();
     const deviceState = adapter.getState().devices;
@@ -18251,8 +18293,9 @@ const ConfigurationPage = (props) => {
     mobileWithPreview = mobileWithPreview && rolePermissions.cameraButton;
     /* @conditional-compile-remove(call-readiness) */
     const permissionsState = {
-        camera: cameraPermissionGranted ? 'granted' : 'denied',
-        microphone: microphonePermissionGranted ? 'granted' : 'denied'
+        // fall back to using cameraPermissionGranted and microphonePermissionGranted if permission API is not supported
+        camera: videoState !== null && videoState !== void 0 ? videoState : (cameraPermissionGranted ? 'granted' : 'denied'),
+        microphone: audioState !== null && audioState !== void 0 ? audioState : (microphonePermissionGranted ? 'granted' : 'denied')
     };
     /* @conditional-compile-remove(call-readiness) */
     const networkErrors = errorBarProps.activeErrorMessages.filter((message) => message.type === 'callNetworkQualityLow');