npm - @azure/communication-react - Versions diffs - 1.21.0-alpha-202411020018 → 1.21.0-alpha-202411060016 - Mend

@azure/communication-react 1.21.0-alpha-202411020018 → 1.21.0-alpha-202411060016

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 (73) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"VideoTile.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/VideoTile.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, IStyle, mergeStyles, Theme, ITheme, ISpinnerStyles } from '@fluentui/react';\nimport { keyframes, memoizeFunction } from '@fluentui/react';\nimport { REACTION_SCREEN_SHARE_ANIMATION_TIME_MS } from '../VideoGallery/utils/reactionUtils';\nimport { isDarkThemed } from '../../theming/themeUtils';\n\n/*\n @private\n /\nexport const rootStyles: IStyle = {\n position: 'relative',\n height: '100%',\n width: '100%'\n};\n\n/\n @private\n /\nexport const videoContainerStyles: IStyle = {\n position: 'absolute',\n top: '0',\n left: '0',\n width: '100%',\n height: '100%',\n minWidth: '100%',\n minHeight: '100%',\n objectPosition: 'center',\n objectFit: 'cover',\n zIndex: 0\n};\n\n/\n @private\n /\nexport const overlayContainerStyles: IStyle = {\n width: '100%',\n height: '100%',\n zIndex: 5\n};\n\n/\n @private\n /\nexport const tileInfoContainerStyle = mergeStyles({\n position: 'absolute',\n bottom: '0',\n left: '0',\n padding: '0.5rem',\n width: '100%'\n});\n\n/\n @private\n /\nexport const disabledVideoHint = mergeStyles({\n backgroundColor: 'inherit',\n boxShadow: 'none',\n textAlign: 'left',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n alignItems: 'center',\n padding: '0.15rem',\n maxWidth: '100%'\n});\n\n/\n @private\n /\nexport const displayNameStyle: IStyle = {\n padding: '0.1rem',\n fontSize: '0.75rem',\n fontWeight: 600,\n // Text component will take body color by default (white in Dark Mode), so forcing it to be parent container color\n color: 'inherit',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%'\n};\n\n/\n @private\n /\nexport const pinIconStyle: IStyle = {\n padding: '0.125rem'\n};\n\n/\n @private\n /\nexport const iconContainerStyle: IStyle = {\n margin: 'auto',\n alignItems: 'center',\n '& svg': {\n display: 'block',\n // Similar to text color, icon color will be inherited from parent container\n color: 'inherit'\n }\n};\n\n/\n @private\n /\nexport const participantStateStringStyles = (theme: Theme): IStyle => {\n return {\n minWidth: 'max-content',\n color: theme.palette.black,\n fontSize: '0.75rem',\n lineHeight: 'normal',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n padding: '0.1rem'\n };\n};\n\n/\n @private\n /\nexport const moreButtonStyles = (theme: Theme): IButtonStyles => {\n return {\n root: {\n // To ensure that the button is clickable when there is a floating video tile\n zIndex: 1,\n top: '-0.125rem',\n height: '100%',\n padding: '0rem'\n },\n rootHovered: {\n background: 'none'\n },\n rootPressed: {\n background: 'none'\n },\n icon: {\n color: theme.palette.neutralPrimary\n },\n iconExpanded: {\n background: 'none',\n color: theme.palette.themePrimary\n }\n };\n};\n\n/\n @private\n /\nexport const raiseHandContainerStyles = (theme: ITheme, limitedSpace: boolean): string =>\n mergeStyles(\n {\n alignItems: 'center',\n padding: '0.2rem 0.3rem',\n backgroundColor: theme.palette.white,\n opacity: 0.9,\n borderRadius: '1rem',\n margin: '0.5rem',\n width: 'fit-content',\n position: 'absolute',\n top: 0,\n height: 'fit-content'\n },\n limitedSpace && raiseHandLimitedSpaceStyles\n );\n\n/\n @private\n /\nexport const raiseHandLimitedSpaceStyles: IStyle = {\n // position centrally\n marginLeft: 'auto',\n marginRight: 'auto',\n left: 0,\n right: 0,\n // position at the bottom\n bottom: 0\n};\n\n/\n @private\n /\nexport const playFrames = memoizeFunction((frameHightPx: number, frameCount: number) =>\n keyframes({\n from: {\n backgroundPosition: `0px 0px`\n },\n to: {\n backgroundPosition: `0px ${frameCount -frameHightPx}px`\n }\n })\n);\n\n/*\n @private\n /\nexport const reactionRenderingStyle = (args: {\n spriteImageUrl: string;\n emojiSize: number;\n rawFrameSize: number;\n frameCount: number;\n}): string => {\n const imageUrl = `url(${args.spriteImageUrl})`;\n const steps = args.frameCount ?? 0;\n const frameSizePx = args.rawFrameSize;\n return mergeStyles({\n height: `${frameSizePx}px`,\n width: `${frameSizePx}px`,\n overflow: 'hidden',\n animationName: playFrames(frameSizePx, steps),\n backgroundImage: imageUrl,\n animationDuration: `${REACTION_SCREEN_SHARE_ANIMATION_TIME_MS / 1000}s`,\n animationTimingFunction: `steps(${steps})`,\n animationPlayState: 'running',\n animationIterationCount: 'infinite',\n\n // Scale the emoji to fit the parent container\n transform: `scale(${args.emojiSize / frameSizePx})`,\n transformOrigin: 'top left'\n });\n};\n\n/\n @private\n /\nexport const loadSpinnerStyles = (theme: ITheme, isOverLay: boolean): ISpinnerStyles => {\n return {\n circle: {\n width: '2rem',\n height: '2rem'\n },\n label: {\n fontSize: '1rem',\n color: isOverLay ? (isDarkThemed(theme) ? theme.palette.black : theme.palette.white) : theme.palette.themeDarkAlt\n }\n };\n};\n\n/\n @private\n /\nexport const overlayStyles = (): IStyle => {\n return {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: 'rgba(0, 0, 0, 0.3)'\n };\n};\n\n/\n @private\n */\nexport const overlayStylesTransparent = (): IStyle => {\n return {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center'\n };\n};\n"]}
1	+ {"version":3,"file":"VideoTile.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/VideoTile.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, IStyle, mergeStyles, Theme, ITheme, ISpinnerStyles } from '@fluentui/react';\nimport { keyframes, memoizeFunction } from '@fluentui/react';\nimport { REACTION_SCREEN_SHARE_ANIMATION_TIME_MS } from '../VideoGallery/utils/reactionUtils';\nimport { isDarkThemed } from '../../theming/themeUtils';\n\n/*\n @private\n /\nexport const rootStyles: IStyle = {\n position: 'relative',\n height: '100%',\n width: '100%'\n};\n\n/* @private /\nexport const videoTileHighContrastStyles = (theme: ITheme): IStyle => ({\n '@media (forced-colors: active)': {\n border: `0.125rem solid ${theme.palette.black}`\n }\n});\n\n/\n @private\n /\nexport const videoContainerStyles: IStyle = {\n position: 'absolute',\n top: '0',\n left: '0',\n width: '100%',\n height: '100%',\n minWidth: '100%',\n minHeight: '100%',\n objectPosition: 'center',\n objectFit: 'cover',\n zIndex: 0\n};\n\n/\n @private\n /\nexport const overlayContainerStyles: IStyle = {\n width: '100%',\n height: '100%',\n zIndex: 5\n};\n\n/\n @private\n /\nexport const tileInfoContainerStyle = mergeStyles({\n position: 'absolute',\n bottom: '0',\n left: '0',\n padding: '0.5rem',\n width: '100%'\n});\n\n/\n @private\n /\nexport const disabledVideoHint = mergeStyles({\n backgroundColor: 'inherit',\n boxShadow: 'none',\n textAlign: 'left',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n alignItems: 'center',\n padding: '0.15rem',\n maxWidth: '100%'\n});\n\n/\n @private\n /\nexport const displayNameStyle: IStyle = {\n padding: '0.1rem',\n fontSize: '0.75rem',\n fontWeight: 600,\n // Text component will take body color by default (white in Dark Mode), so forcing it to be parent container color\n color: 'inherit',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%'\n};\n\n/\n @private\n /\nexport const pinIconStyle: IStyle = {\n padding: '0.125rem'\n};\n\n/\n @private\n /\nexport const iconContainerStyle: IStyle = {\n margin: 'auto',\n alignItems: 'center',\n '& svg': {\n display: 'block',\n // Similar to text color, icon color will be inherited from parent container\n color: 'inherit'\n }\n};\n\n/\n @private\n /\nexport const participantStateStringStyles = (theme: Theme): IStyle => {\n return {\n minWidth: 'max-content',\n color: theme.palette.black,\n fontSize: '0.75rem',\n lineHeight: 'normal',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n padding: '0.1rem'\n };\n};\n\n/\n @private\n /\nexport const moreButtonStyles = (theme: Theme): IButtonStyles => {\n return {\n root: {\n // To ensure that the button is clickable when there is a floating video tile\n zIndex: 1,\n top: '-0.125rem',\n height: '100%',\n padding: '0rem'\n },\n rootHovered: {\n background: 'none'\n },\n rootPressed: {\n background: 'none'\n },\n icon: {\n color: theme.palette.neutralPrimary\n },\n iconExpanded: {\n background: 'none',\n color: theme.palette.themePrimary\n }\n };\n};\n\n/\n @private\n /\nexport const raiseHandContainerStyles = (theme: ITheme, limitedSpace: boolean): string =>\n mergeStyles(\n {\n alignItems: 'center',\n padding: '0.2rem 0.3rem',\n backgroundColor: theme.palette.white,\n opacity: 0.9,\n borderRadius: '1rem',\n margin: '0.5rem',\n width: 'fit-content',\n position: 'absolute',\n top: 0,\n height: 'fit-content'\n },\n limitedSpace && raiseHandLimitedSpaceStyles\n );\n\n/\n @private\n /\nexport const raiseHandLimitedSpaceStyles: IStyle = {\n // position centrally\n marginLeft: 'auto',\n marginRight: 'auto',\n left: 0,\n right: 0,\n // position at the bottom\n bottom: 0\n};\n\n/\n @private\n /\nexport const playFrames = memoizeFunction((frameHightPx: number, frameCount: number) =>\n keyframes({\n from: {\n backgroundPosition: `0px 0px`\n },\n to: {\n backgroundPosition: `0px ${frameCount -frameHightPx}px`\n }\n })\n);\n\n/*\n @private\n /\nexport const reactionRenderingStyle = (args: {\n spriteImageUrl: string;\n emojiSize: number;\n rawFrameSize: number;\n frameCount: number;\n}): string => {\n const imageUrl = `url(${args.spriteImageUrl})`;\n const steps = args.frameCount ?? 0;\n const frameSizePx = args.rawFrameSize;\n return mergeStyles({\n height: `${frameSizePx}px`,\n width: `${frameSizePx}px`,\n overflow: 'hidden',\n animationName: playFrames(frameSizePx, steps),\n backgroundImage: imageUrl,\n animationDuration: `${REACTION_SCREEN_SHARE_ANIMATION_TIME_MS / 1000}s`,\n animationTimingFunction: `steps(${steps})`,\n animationPlayState: 'running',\n animationIterationCount: 'infinite',\n\n // Scale the emoji to fit the parent container\n transform: `scale(${args.emojiSize / frameSizePx})`,\n transformOrigin: 'top left'\n });\n};\n\n/\n @private\n /\nexport const loadSpinnerStyles = (theme: ITheme, isOverLay: boolean): ISpinnerStyles => {\n return {\n circle: {\n width: '2rem',\n height: '2rem'\n },\n label: {\n fontSize: '1rem',\n color: isOverLay ? (isDarkThemed(theme) ? theme.palette.black : theme.palette.white) : theme.palette.themeDarkAlt\n }\n };\n};\n\n/\n @private\n /\nexport const overlayStyles = (): IStyle => {\n return {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: 'rgba(0, 0, 0, 0.3)'\n };\n};\n\n/\n @private\n */\nexport const overlayStylesTransparent = (): IStyle => {\n return {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center'\n };\n};\n"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/SidePane/SidePane.js CHANGED Viewed

@@ -3,10 +3,11 @@
 import React, { useCallback, useMemo } from 'react';
 import { Stack } from '@fluentui/react';
 import { containerContextStyles, paneBodyContainer, scrollableContainer, scrollableContainerContents } from '../../../common/styles/ParticipantContainer.styles';
-import { availableSpaceStyles, sidePaneStyles, sidePaneTokens } from '../../../common/styles/Pane.styles';
+import { availableSpaceStyles, paneHighContrastStyles, sidePaneStyles, sidePaneTokens } from '../../../common/styles/Pane.styles';
 import { useSidePaneContext } from './SidePaneProvider';
 import { PeopleAndChatHeader } from '../../../common/TabHeader';
 import { hiddenStyles } from '../../../common/styles/Pane.styles';
+import { useTheme } from "../../../../../../react-components/src";
 /** @private */
 export const SidePane = (props) => {
     var _a;
@@ -50,10 +51,11 @@ export const SidePane = (props) => {
     const OverrideContentRenderer = (overrideSidePane === null || overrideSidePane === void 0 ? void 0 : overrideSidePane.isActive) || (overrideSidePane === null || overrideSidePane === void 0 ? void 0 : overrideSidePane.persistRenderingWhenClosed)
         ? overrideSidePane.renderer.contentRenderer
         : undefined;
+    const theme = useTheme();
     if (!ContentRenderer && !OverrideContentRenderer) {
         return React.createElement(EmptyElement, null);
     }
-    return (React.createElement(Stack, { "aria-label": props.ariaLabel, "data-is-focusable": !!props.ariaLabel, role: props.ariaLabel ? 'navigation' : undefined, tabIndex: props.ariaLabel ? 0 : undefined, verticalFill: true, grow: true, styles: paneStyles, "data-ui-id": "SidePane", tokens: props.mobileView || (!props.showAddPeopleButton && (sidePaneRenderer === null || sidePaneRenderer === void 0 ? void 0 : sidePaneRenderer.id) === 'people') ? {} : sidePaneTokens },
+    return (React.createElement(Stack, { "aria-label": props.ariaLabel, "data-is-focusable": !!props.ariaLabel, role: props.ariaLabel ? 'navigation' : undefined, tabIndex: props.ariaLabel ? 0 : undefined, verticalFill: true, grow: true, styles: paneStyles, "data-ui-id": "SidePane", tokens: props.mobileView || (!props.showAddPeopleButton && (sidePaneRenderer === null || sidePaneRenderer === void 0 ? void 0 : sidePaneRenderer.id) === 'people') ? {} : sidePaneTokens, className: paneHighContrastStyles(theme) },
         HeaderToRender,
         React.createElement(Stack.Item, { verticalFill: true, grow: true, styles: paneBodyContainer },
             React.createElement(Stack, { verticalFill: true, styles: scrollableContainer },

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/SidePane/SidePane.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePane.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/SidePane/SidePane.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback, useMemo } from 'react';\nimport { Stack } from '@fluentui/react';\nimport {\n containerContextStyles,\n paneBodyContainer,\n scrollableContainer,\n scrollableContainerContents\n} from '../../../common/styles/ParticipantContainer.styles';\nimport { availableSpaceStyles, sidePaneStyles, sidePaneTokens } from '../../../common/styles/Pane.styles';\nimport { SidePaneRenderer, useSidePaneContext } from './SidePaneProvider';\nimport { PeopleAndChatHeader } from '../../../common/TabHeader';\nimport { hiddenStyles } from '../../../common/styles/Pane.styles';\n\n/** @private /\nexport interface SidePaneProps {\n updateSidePaneRenderer: (renderer: SidePaneRenderer \| undefined) => void;\n mobileView?: boolean;\n maxWidth?: string;\n minWidth?: string;\n ariaLabel?: string;\n\n // legacy arguments to be removed in breaking change\n disablePeopleButton?: boolean;\n disableChatButton?: boolean;\n onChatButtonClicked?: () => void;\n onPeopleButtonClicked?: () => void;\n showAddPeopleButton?: boolean;\n}\n\n/* @private /\nexport const SidePane = (props: SidePaneProps): JSX.Element => {\n const { sidePaneRenderer, overrideSidePane } = useSidePaneContext();\n const renderingHiddenOverrideContent =\n overrideSidePane?.renderer.contentRenderer &&\n overrideSidePane.persistRenderingWhenClosed &&\n !overrideSidePane.isActive;\n const renderingOnlyHiddenContent = renderingHiddenOverrideContent && !sidePaneRenderer;\n\n const widthConstrainedStyles = useMemo(\n () => sidePaneStyles(props.maxWidth, props.minWidth),\n [props.maxWidth, props.minWidth]\n );\n const paneStyles = renderingOnlyHiddenContent\n ? hiddenStyles\n : props.mobileView\n ? availableSpaceStyles\n : widthConstrainedStyles;\n\n const Header =\n (overrideSidePane?.isActive ? overrideSidePane.renderer.headerRenderer : sidePaneRenderer?.headerRenderer) ??\n EmptyElement;\n\n /\n Legacy code to support old behavior of showing chat and people tab headers on mobile side pane.\n * To be removed in breaking change.\n */\n const overrideSidePaneId = overrideSidePane?.isActive ? overrideSidePane.renderer.id : undefined;\n const { updateSidePaneRenderer } = props;\n const closePane = useCallback(() => {\n updateSidePaneRenderer(undefined);\n }, [updateSidePaneRenderer]);\n\n const LegacyHeader = useMemo((): JSX.Element => {\n return (\n <PeopleAndChatHeader\n onClose={overrideSidePaneId === 'chat' ? props.onChatButtonClicked ?? noop : closePane}\n activeTab={sidePaneRenderer?.id === 'people' ? 'people' : 'chat'}\n // legacy arguments to be removed in breaking change:\n disablePeopleButton={props.disablePeopleButton}\n disableChatButton={props.disableChatButton}\n onPeopleButtonClicked={sidePaneRenderer?.id === 'people' ? noop : props.onPeopleButtonClicked}\n onChatButtonClicked={overrideSidePaneId === 'chat' ? noop : props.onChatButtonClicked}\n />\n );\n }, [\n overrideSidePaneId,\n props.onChatButtonClicked,\n props.onPeopleButtonClicked,\n props.disablePeopleButton,\n props.disableChatButton,\n sidePaneRenderer?.id,\n closePane\n ]);\n\n const HeaderToRender =\n props.mobileView && (overrideSidePaneId === 'chat' \|\| sidePaneRenderer?.id === 'people') ? LegacyHeader : Header();\n\n const ContentRenderer = overrideSidePane?.isActive ? undefined : sidePaneRenderer?.contentRenderer;\n const OverrideContentRenderer =\n overrideSidePane?.isActive \|\| overrideSidePane?.persistRenderingWhenClosed\n ? overrideSidePane.renderer.contentRenderer\n : undefined;\n\n if (!ContentRenderer && !OverrideContentRenderer) {\n return <EmptyElement />;\n }\n\n return (\n <Stack\n aria-label={props.ariaLabel}\n data-is-focusable={!!props.ariaLabel}\n role={props.ariaLabel ? 'navigation' : undefined}\n tabIndex={props.ariaLabel ? 0 : undefined}\n verticalFill\n grow\n styles={paneStyles}\n data-ui-id=\"SidePane\"\n tokens={\n props.mobileView \|\| (!props.showAddPeopleButton && sidePaneRenderer?.id === 'people') ? {} : sidePaneTokens\n }\n >\n {HeaderToRender}\n <Stack.Item verticalFill grow styles={paneBodyContainer}>\n <Stack verticalFill styles={scrollableContainer}>\n {ContentRenderer && (\n <Stack.Item verticalFill styles={scrollableContainerContents}>\n <Stack styles={containerContextStyles}>{ContentRenderer?.()}</Stack>\n </Stack.Item>\n )}\n {OverrideContentRenderer && (\n <Stack.Item\n verticalFill\n styles={\n !overrideSidePane?.isActive && overrideSidePane?.persistRenderingWhenClosed\n ? hiddenStyles\n : scrollableContainerContents\n }\n >\n <Stack styles={containerContextStyles}>{OverrideContentRenderer?.()}</Stack>\n </Stack.Item>\n )}\n </Stack>\n </Stack.Item>\n </Stack>\n );\n};\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = (): void => {};\nconst EmptyElement = (): JSX.Element => <></>;\n"]}
1	+ {"version":3,"file":"SidePane.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/SidePane/SidePane.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback, useMemo } from 'react';\nimport { Stack } from '@fluentui/react';\nimport {\n containerContextStyles,\n paneBodyContainer,\n scrollableContainer,\n scrollableContainerContents\n} from '../../../common/styles/ParticipantContainer.styles';\nimport {\n availableSpaceStyles,\n paneHighContrastStyles,\n sidePaneStyles,\n sidePaneTokens\n} from '../../../common/styles/Pane.styles';\nimport { SidePaneRenderer, useSidePaneContext } from './SidePaneProvider';\nimport { PeopleAndChatHeader } from '../../../common/TabHeader';\nimport { hiddenStyles } from '../../../common/styles/Pane.styles';\nimport { useTheme } from '@internal/react-components';\n\n/** @private /\nexport interface SidePaneProps {\n updateSidePaneRenderer: (renderer: SidePaneRenderer \| undefined) => void;\n mobileView?: boolean;\n maxWidth?: string;\n minWidth?: string;\n ariaLabel?: string;\n\n // legacy arguments to be removed in breaking change\n disablePeopleButton?: boolean;\n disableChatButton?: boolean;\n onChatButtonClicked?: () => void;\n onPeopleButtonClicked?: () => void;\n showAddPeopleButton?: boolean;\n}\n\n/* @private /\nexport const SidePane = (props: SidePaneProps): JSX.Element => {\n const { sidePaneRenderer, overrideSidePane } = useSidePaneContext();\n const renderingHiddenOverrideContent =\n overrideSidePane?.renderer.contentRenderer &&\n overrideSidePane.persistRenderingWhenClosed &&\n !overrideSidePane.isActive;\n const renderingOnlyHiddenContent = renderingHiddenOverrideContent && !sidePaneRenderer;\n\n const widthConstrainedStyles = useMemo(\n () => sidePaneStyles(props.maxWidth, props.minWidth),\n [props.maxWidth, props.minWidth]\n );\n const paneStyles = renderingOnlyHiddenContent\n ? hiddenStyles\n : props.mobileView\n ? availableSpaceStyles\n : widthConstrainedStyles;\n\n const Header =\n (overrideSidePane?.isActive ? overrideSidePane.renderer.headerRenderer : sidePaneRenderer?.headerRenderer) ??\n EmptyElement;\n\n /\n Legacy code to support old behavior of showing chat and people tab headers on mobile side pane.\n * To be removed in breaking change.\n */\n const overrideSidePaneId = overrideSidePane?.isActive ? overrideSidePane.renderer.id : undefined;\n const { updateSidePaneRenderer } = props;\n const closePane = useCallback(() => {\n updateSidePaneRenderer(undefined);\n }, [updateSidePaneRenderer]);\n\n const LegacyHeader = useMemo((): JSX.Element => {\n return (\n <PeopleAndChatHeader\n onClose={overrideSidePaneId === 'chat' ? props.onChatButtonClicked ?? noop : closePane}\n activeTab={sidePaneRenderer?.id === 'people' ? 'people' : 'chat'}\n // legacy arguments to be removed in breaking change:\n disablePeopleButton={props.disablePeopleButton}\n disableChatButton={props.disableChatButton}\n onPeopleButtonClicked={sidePaneRenderer?.id === 'people' ? noop : props.onPeopleButtonClicked}\n onChatButtonClicked={overrideSidePaneId === 'chat' ? noop : props.onChatButtonClicked}\n />\n );\n }, [\n overrideSidePaneId,\n props.onChatButtonClicked,\n props.onPeopleButtonClicked,\n props.disablePeopleButton,\n props.disableChatButton,\n sidePaneRenderer?.id,\n closePane\n ]);\n\n const HeaderToRender =\n props.mobileView && (overrideSidePaneId === 'chat' \|\| sidePaneRenderer?.id === 'people') ? LegacyHeader : Header();\n\n const ContentRenderer = overrideSidePane?.isActive ? undefined : sidePaneRenderer?.contentRenderer;\n const OverrideContentRenderer =\n overrideSidePane?.isActive \|\| overrideSidePane?.persistRenderingWhenClosed\n ? overrideSidePane.renderer.contentRenderer\n : undefined;\n\n const theme = useTheme();\n\n if (!ContentRenderer && !OverrideContentRenderer) {\n return <EmptyElement />;\n }\n\n return (\n <Stack\n aria-label={props.ariaLabel}\n data-is-focusable={!!props.ariaLabel}\n role={props.ariaLabel ? 'navigation' : undefined}\n tabIndex={props.ariaLabel ? 0 : undefined}\n verticalFill\n grow\n styles={paneStyles}\n data-ui-id=\"SidePane\"\n tokens={\n props.mobileView \|\| (!props.showAddPeopleButton && sidePaneRenderer?.id === 'people') ? {} : sidePaneTokens\n }\n className={paneHighContrastStyles(theme)}\n >\n {HeaderToRender}\n <Stack.Item verticalFill grow styles={paneBodyContainer}>\n <Stack verticalFill styles={scrollableContainer}>\n {ContentRenderer && (\n <Stack.Item verticalFill styles={scrollableContainerContents}>\n <Stack styles={containerContextStyles}>{ContentRenderer?.()}</Stack>\n </Stack.Item>\n )}\n {OverrideContentRenderer && (\n <Stack.Item\n verticalFill\n styles={\n !overrideSidePane?.isActive && overrideSidePane?.persistRenderingWhenClosed\n ? hiddenStyles\n : scrollableContainerContents\n }\n >\n <Stack styles={containerContextStyles}>{OverrideContentRenderer?.()}</Stack>\n </Stack.Item>\n )}\n </Stack>\n </Stack.Item>\n </Stack>\n );\n};\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = (): void => {};\nconst EmptyElement = (): JSX.Element => <></>;\n"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/CallConfiguration.styles.js CHANGED Viewed

@@ -107,6 +107,10 @@ const configurationPageTextDecoration = (theme) => {
     return {
         textShadow: `0px 0px 8px ${theme.palette.whiteTranslucent40}`,
         fill: theme.semanticColors.bodyText,
+        svg: {
+            // Fix SVGs not displaying the correct color in Desert high contrast mode
+            fill: 'currentColor'
+        },
         stroke: theme.palette.whiteTranslucent40,
         paintOrder: 'stroke fill',
         strokeWidth: _pxToRem(1.5),
@@ -114,8 +118,6 @@ const configurationPageTextDecoration = (theme) => {
             letterSpacing: '-0.02rem' // cope with extra width due to stroke width
         },
         '@media (forced-colors: active)': {
-            forcedColorAdjust: 'auto',
-            fill: theme.palette.neutralQuaternaryAlt,
             textShadow: 'none',
             stroke: 'none'
         }

package/dist/dist-esm/react-composites/src/composites/CallComposite/styles/CallConfiguration.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CallConfiguration.styles.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/styles/CallConfiguration.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport {\n IStackItemStyles,\n IStackStyles,\n IStackTokens,\n IStyle,\n mergeStyles,\n IButtonStyles,\n Theme,\n IPanelStyles,\n IFocusTrapZoneProps,\n IImageStyles,\n AnimationStyles,\n ITheme\n} from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/** @private /\nexport const CONFIGURATION_PAGE_SECTION_MIN_WIDTH_REM = 11;\n/* @private /\nexport const CONFIGURATION_PAGE_SECTION_MAX_WIDTH_REM = 20.625;\n/* @private /\nexport const CONFIGURATION_PAGE_SECTION_HEIGHT_REM = 13.625;\n\nconst LOGO_HEIGHT_REM = 3;\n\n/\n @private\n /\nexport const configurationStackTokensDesktop: IStackTokens = {\n childrenGap: '1.5rem'\n};\n\n/\n @private\n /\nexport const configurationStackTokensMobile: IStackTokens = {\n childrenGap: '0.5rem'\n};\n\n/\n @private\n /\nexport const deviceConfigurationStackTokens: IStackTokens = {\n childrenGap: '1.5rem'\n};\n\n/* @private /\nexport const configurationContainerStyle = (desktop: boolean, backgroundImageUrl?: string): IStackStyles => ({\n root: {\n height: '100%',\n width: '100%',\n padding: desktop ? '2rem 1rem 2rem 1rem' : '1rem 1rem 2rem 1rem',\n minWidth: desktop\n ? '25rem' // sum of min-width from children + ChildrenGap (nb of children - 1) + padding * 2 = (11 + 11) + (2 * 1) + 0.5 * 2\n : '16rem', // from LocalPreview: ControlBar width + 0.5 * 2 for spacing + padding * 2 = 14 + 0.5 * 2 + 0.5 * 2\n minHeight: desktop\n ? '22rem' // max height of SelectionContainer + padding * 2 = 21 + 0.5 * 2\n : '13rem',\n '::before': !backgroundImageUrl\n ? undefined\n : {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 0,\n width: '100%',\n height: '100%',\n backgroundImage: `url(${backgroundImageUrl})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n ...AnimationStyles.fadeIn500\n }\n }\n});\n\n/*\n @private\n /\nexport const configurationSectionStyle: IStackStyles = {\n root: {\n width: '100%',\n minWidth: `${CONFIGURATION_PAGE_SECTION_MIN_WIDTH_REM}rem`,\n maxWidth: `${CONFIGURATION_PAGE_SECTION_MAX_WIDTH_REM}rem`\n }\n};\n\n/\n @private\n /\nexport const selectionContainerStyle = (theme: ITheme, noSpeakerDropdownShown?: boolean): string =>\n mergeStyles({\n width: '100%',\n minHeight: noSpeakerDropdownShown ? 'auto' : `${CONFIGURATION_PAGE_SECTION_HEIGHT_REM}rem`,\n padding: '1rem',\n borderRadius: theme.effects.roundedCorner6,\n border: `0.0625rem solid ${theme.palette.neutralLight}`,\n overflow: 'hidden', // do not let child background overflow the curved corners\n boxShadow: theme.effects.elevation4,\n // Style the background of the container to have partial transparency.\n // Using `before:` pseudo-element to avoid having to wrap the content in an extra div.\n // Ideally rgba would be used but we cannot garauntee the format of theme.palette.white\n // to parse it correctly.\n position: 'relative',\n ':before': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n zIndex: 0,\n background: theme.palette.white,\n opacity: 0.9\n }\n });\n\n/\n @private\n /\nexport const titleContainerStyleDesktop = (theme: ITheme): string =>\n mergeStyles(\n {\n fontSize: '1.2rem',\n lineHeight: '1rem',\n fontWeight: 600\n },\n configurationPageTextDecoration(theme)\n );\n\n/\n @private\n /\nexport const titleContainerStyleMobile = (theme: ITheme): string =>\n mergeStyles(\n {\n fontSize: '1.0625rem',\n lineHeight: '1.375rem',\n fontWeight: 600,\n textAlign: 'center'\n },\n configurationPageTextDecoration(theme)\n );\n\n/\n Ensure configuration page text is legible on top of a background image.\n * @private\n /\nconst configurationPageTextDecoration = (theme: ITheme): IStyle => {\n return {\n textShadow: `0px 0px 8px ${theme.palette.whiteTranslucent40}`,\n fill: theme.semanticColors.bodyText,\n stroke: theme.palette.whiteTranslucent40,\n paintOrder: 'stroke fill',\n strokeWidth: _pxToRem(1.5),\n text: {\n letterSpacing: '-0.02rem' // cope with extra width due to stroke width\n },\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'auto',\n fill: theme.palette.neutralQuaternaryAlt,\n textShadow: 'none',\n stroke: 'none'\n }\n };\n};\n\n/\n @private\n /\nexport const callDetailsContainerStyles: IStackStyles = {\n root: {\n textAlign: 'center',\n maxWidth: _pxToRem(700),\n alignSelf: 'center'\n }\n};\n\nconst callDetailsStyle = (theme: ITheme): IStyle => ({\n fontSize: '0.9375',\n lineHeight: '1.25rem',\n textShadow: `0px 0px 8px ${theme.palette.whiteTranslucent40}`,\n marginTop: '-0.33rem' // compensate for extra padding around the CallTitle that avoids the SVG shadowing being cut off\n});\n\n/\n @private\n /\nexport const callDetailsStyleDesktop = (theme: ITheme): string => mergeStyles(callDetailsStyle(theme));\n\n/\n @private\n /\nexport const callDetailsStyleMobile = (theme: ITheme): string =>\n mergeStyles(callDetailsStyle(theme), {\n marginBottom: '0.5rem',\n textAlign: 'center'\n });\n\n/\n @private\n /\nexport const startCallButtonContainerStyleDesktop: IStackStyles = {\n root: {\n paddingTop: '1.125rem'\n }\n};\n\n/\n @private\n /\nexport const startCallButtonContainerStyleMobile: IStackStyles = {\n root: {\n textAlign: 'center'\n }\n};\n\n/\n @private\n /\nexport const startCallButtonStyleMobile = mergeStyles({\n width: '100%',\n maxWidth: 'unset',\n borderRadius: '0.25rem',\n height: '3.25rem'\n});\n\n/\n @private\n /\nexport const startCallButtonStyleDesktop = mergeStyles({\n borderRadius: '0.25rem',\n width: 'auto',\n height: '2.25rem'\n});\n\n/* @private /\nexport const cameraAndVideoEffectsContainerStyleDesktop: IStackItemStyles = {\n root: {\n alignItems: 'center'\n }\n};\n\n/\n @private\n /\nexport const effectsButtonStyles = (theme: Theme, disabled?: boolean): IButtonStyles => {\n return {\n root: {\n background: 'transparent',\n border: 'none',\n color: theme.palette.themePrimary,\n // Top and bottom padding needs to be 5px to match the label padding\n padding: '5px 0.25rem',\n ':hover, :focus': disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n svg: {\n height: '1rem',\n width: '1rem'\n }\n },\n labelHovered: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n rootChecked: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n rootHovered: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n rootPressed: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n rootFocused: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n }\n };\n};\n\n/* @private /\nexport const fillWidth = mergeStyles({\n width: '100%',\n position: 'relative'\n});\n\n/* @private /\nexport const configurationCenteredContent = (fillsHeight: boolean, hasLogo?: boolean): string =>\n mergeStyles({\n width: '100%',\n position: 'relative',\n\n // If the content does not fill the height, center it vertically.\n // We do not include the logo in the centering per design. This allows it to fade\n // in and not shift the content. To exclude the logo, we subtract the logo height\n // and margin from the actual height. This allows the flex box's natural centering\n // to appropriately center the content.\n height: `calc(100% - ${!fillsHeight && hasLogo ? `${LOGO_HEIGHT_REM}rem` : '0rem'})`\n });\n\n/* @private /\nexport const panelStyles: Partial<IPanelStyles> = {\n content: {\n display: 'flex',\n flexBasis: '100%',\n paddingLeft: '0rem', // remove default padding\n paddingRight: '0rem' // remove default padding\n },\n commands: {\n paddingTop: '0rem' // remove default padding\n },\n scrollableContent: {\n display: 'flex',\n flexDirection: 'column',\n height: '100%'\n }\n};\n\n/* @private /\nexport const panelFocusProps: IFocusTrapZoneProps = {\n forceFocusInsideTrap: false\n};\n\n/\n @private\n */\nexport const logoStyles = (shape: undefined \| 'unset' \| 'circle'): IImageStyles => ({\n root: {\n overflow: 'initial', // prevent the image being clipped\n display: 'flex',\n justifyContent: 'center'\n },\n image: {\n height: `${LOGO_HEIGHT_REM}rem`,\n borderRadius: shape === 'circle' ? '100%' : undefined,\n aspectRatio: shape === 'circle' ? '1 / 1' : undefined,\n objectFit: shape === 'circle' ? 'cover' : undefined\n }\n});\n"]}
1	+ {"version":3,"file":"CallConfiguration.styles.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/styles/CallConfiguration.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport {\n IStackItemStyles,\n IStackStyles,\n IStackTokens,\n IStyle,\n mergeStyles,\n IButtonStyles,\n Theme,\n IPanelStyles,\n IFocusTrapZoneProps,\n IImageStyles,\n AnimationStyles,\n ITheme\n} from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/** @private /\nexport const CONFIGURATION_PAGE_SECTION_MIN_WIDTH_REM = 11;\n/* @private /\nexport const CONFIGURATION_PAGE_SECTION_MAX_WIDTH_REM = 20.625;\n/* @private /\nexport const CONFIGURATION_PAGE_SECTION_HEIGHT_REM = 13.625;\n\nconst LOGO_HEIGHT_REM = 3;\n\n/\n @private\n /\nexport const configurationStackTokensDesktop: IStackTokens = {\n childrenGap: '1.5rem'\n};\n\n/\n @private\n /\nexport const configurationStackTokensMobile: IStackTokens = {\n childrenGap: '0.5rem'\n};\n\n/\n @private\n /\nexport const deviceConfigurationStackTokens: IStackTokens = {\n childrenGap: '1.5rem'\n};\n\n/* @private /\nexport const configurationContainerStyle = (desktop: boolean, backgroundImageUrl?: string): IStackStyles => ({\n root: {\n height: '100%',\n width: '100%',\n padding: desktop ? '2rem 1rem 2rem 1rem' : '1rem 1rem 2rem 1rem',\n minWidth: desktop\n ? '25rem' // sum of min-width from children + ChildrenGap (nb of children - 1) + padding * 2 = (11 + 11) + (2 * 1) + 0.5 * 2\n : '16rem', // from LocalPreview: ControlBar width + 0.5 * 2 for spacing + padding * 2 = 14 + 0.5 * 2 + 0.5 * 2\n minHeight: desktop\n ? '22rem' // max height of SelectionContainer + padding * 2 = 21 + 0.5 * 2\n : '13rem',\n '::before': !backgroundImageUrl\n ? undefined\n : {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 0,\n width: '100%',\n height: '100%',\n backgroundImage: `url(${backgroundImageUrl})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n ...AnimationStyles.fadeIn500\n }\n }\n});\n\n/*\n @private\n /\nexport const configurationSectionStyle: IStackStyles = {\n root: {\n width: '100%',\n minWidth: `${CONFIGURATION_PAGE_SECTION_MIN_WIDTH_REM}rem`,\n maxWidth: `${CONFIGURATION_PAGE_SECTION_MAX_WIDTH_REM}rem`\n }\n};\n\n/\n @private\n /\nexport const selectionContainerStyle = (theme: ITheme, noSpeakerDropdownShown?: boolean): string =>\n mergeStyles({\n width: '100%',\n minHeight: noSpeakerDropdownShown ? 'auto' : `${CONFIGURATION_PAGE_SECTION_HEIGHT_REM}rem`,\n padding: '1rem',\n borderRadius: theme.effects.roundedCorner6,\n border: `0.0625rem solid ${theme.palette.neutralLight}`,\n overflow: 'hidden', // do not let child background overflow the curved corners\n boxShadow: theme.effects.elevation4,\n // Style the background of the container to have partial transparency.\n // Using `before:` pseudo-element to avoid having to wrap the content in an extra div.\n // Ideally rgba would be used but we cannot garauntee the format of theme.palette.white\n // to parse it correctly.\n position: 'relative',\n ':before': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n zIndex: 0,\n background: theme.palette.white,\n opacity: 0.9\n }\n });\n\n/\n @private\n /\nexport const titleContainerStyleDesktop = (theme: ITheme): string =>\n mergeStyles(\n {\n fontSize: '1.2rem',\n lineHeight: '1rem',\n fontWeight: 600\n },\n configurationPageTextDecoration(theme)\n );\n\n/\n @private\n /\nexport const titleContainerStyleMobile = (theme: ITheme): string =>\n mergeStyles(\n {\n fontSize: '1.0625rem',\n lineHeight: '1.375rem',\n fontWeight: 600,\n textAlign: 'center'\n },\n configurationPageTextDecoration(theme)\n );\n\n/\n Ensure configuration page text is legible on top of a background image.\n * @private\n /\nconst configurationPageTextDecoration = (theme: ITheme): IStyle => {\n return {\n textShadow: `0px 0px 8px ${theme.palette.whiteTranslucent40}`,\n fill: theme.semanticColors.bodyText,\n svg: {\n // Fix SVGs not displaying the correct color in Desert high contrast mode\n fill: 'currentColor'\n },\n stroke: theme.palette.whiteTranslucent40,\n paintOrder: 'stroke fill',\n strokeWidth: _pxToRem(1.5),\n text: {\n letterSpacing: '-0.02rem' // cope with extra width due to stroke width\n },\n '@media (forced-colors: active)': {\n textShadow: 'none',\n stroke: 'none'\n }\n };\n};\n\n/\n @private\n /\nexport const callDetailsContainerStyles: IStackStyles = {\n root: {\n textAlign: 'center',\n maxWidth: _pxToRem(700),\n alignSelf: 'center'\n }\n};\n\nconst callDetailsStyle = (theme: ITheme): IStyle => ({\n fontSize: '0.9375',\n lineHeight: '1.25rem',\n textShadow: `0px 0px 8px ${theme.palette.whiteTranslucent40}`,\n marginTop: '-0.33rem' // compensate for extra padding around the CallTitle that avoids the SVG shadowing being cut off\n});\n\n/\n @private\n /\nexport const callDetailsStyleDesktop = (theme: ITheme): string => mergeStyles(callDetailsStyle(theme));\n\n/\n @private\n /\nexport const callDetailsStyleMobile = (theme: ITheme): string =>\n mergeStyles(callDetailsStyle(theme), {\n marginBottom: '0.5rem',\n textAlign: 'center'\n });\n\n/\n @private\n /\nexport const startCallButtonContainerStyleDesktop: IStackStyles = {\n root: {\n paddingTop: '1.125rem'\n }\n};\n\n/\n @private\n /\nexport const startCallButtonContainerStyleMobile: IStackStyles = {\n root: {\n textAlign: 'center'\n }\n};\n\n/\n @private\n /\nexport const startCallButtonStyleMobile = mergeStyles({\n width: '100%',\n maxWidth: 'unset',\n borderRadius: '0.25rem',\n height: '3.25rem'\n});\n\n/\n @private\n /\nexport const startCallButtonStyleDesktop = mergeStyles({\n borderRadius: '0.25rem',\n width: 'auto',\n height: '2.25rem'\n});\n\n/* @private /\nexport const cameraAndVideoEffectsContainerStyleDesktop: IStackItemStyles = {\n root: {\n alignItems: 'center'\n }\n};\n\n/\n @private\n /\nexport const effectsButtonStyles = (theme: Theme, disabled?: boolean): IButtonStyles => {\n return {\n root: {\n background: 'transparent',\n border: 'none',\n color: theme.palette.themePrimary,\n // Top and bottom padding needs to be 5px to match the label padding\n padding: '5px 0.25rem',\n ':hover, :focus': disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n svg: {\n height: '1rem',\n width: '1rem'\n }\n },\n labelHovered: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n rootChecked: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n rootHovered: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n rootPressed: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n },\n rootFocused: disabled\n ? {}\n : {\n color: theme.palette.themePrimary\n }\n };\n};\n\n/* @private /\nexport const fillWidth = mergeStyles({\n width: '100%',\n position: 'relative'\n});\n\n/* @private /\nexport const configurationCenteredContent = (fillsHeight: boolean, hasLogo?: boolean): string =>\n mergeStyles({\n width: '100%',\n position: 'relative',\n\n // If the content does not fill the height, center it vertically.\n // We do not include the logo in the centering per design. This allows it to fade\n // in and not shift the content. To exclude the logo, we subtract the logo height\n // and margin from the actual height. This allows the flex box's natural centering\n // to appropriately center the content.\n height: `calc(100% - ${!fillsHeight && hasLogo ? `${LOGO_HEIGHT_REM}rem` : '0rem'})`\n });\n\n/* @private /\nexport const panelStyles: Partial<IPanelStyles> = {\n content: {\n display: 'flex',\n flexBasis: '100%',\n paddingLeft: '0rem', // remove default padding\n paddingRight: '0rem' // remove default padding\n },\n commands: {\n paddingTop: '0rem' // remove default padding\n },\n scrollableContent: {\n display: 'flex',\n flexDirection: 'column',\n height: '100%'\n }\n};\n\n/* @private /\nexport const panelFocusProps: IFocusTrapZoneProps = {\n forceFocusInsideTrap: false\n};\n\n/\n @private\n */\nexport const logoStyles = (shape: undefined \| 'unset' \| 'circle'): IImageStyles => ({\n root: {\n overflow: 'initial', // prevent the image being clipped\n display: 'flex',\n justifyContent: 'center'\n },\n image: {\n height: `${LOGO_HEIGHT_REM}rem`,\n borderRadius: shape === 'circle' ? '100%' : undefined,\n aspectRatio: shape === 'circle' ? '1 / 1' : undefined,\n objectFit: shape === 'circle' ? 'cover' : undefined\n }\n});\n"]}

package/dist/dist-esm/react-composites/src/composites/common/SidePaneHeader.js CHANGED Viewed

@@ -16,12 +16,16 @@ export const SidePaneHeader = (props) => {
             minWidth: '1.5rem',
             padding: '0.5rem 0.25rem',
             marginRight: '0.25rem',
-            backgroundColor: theme.semanticColors.bodyBackground
+            backgroundColor: theme.semanticColors.bodyBackground,
+            '@media (forced-colors: active)': {
+                border: `0.1rem solid ${theme.palette.neutralSecondary}`,
+                borderRadius: theme.effects.roundedCorner4
+            }
         },
         icon: { color: theme.palette.neutralSecondary },
         iconHovered: { color: theme.palette.neutralSecondary },
         iconPressed: { color: theme.palette.neutralSecondary }
-    }), [theme.palette.neutralSecondary, theme.semanticColors.bodyBackground]);
+    }), [theme.palette.neutralSecondary, theme.semanticColors.bodyBackground, theme.effects.roundedCorner4]);
     if (props.mobileView) {
         return React.createElement(SidePaneMobileHeader, Object.assign({}, props));
     }

package/dist/dist-esm/react-composites/src/composites/common/SidePaneHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SidePaneHeader.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/common/SidePaneHeader.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,gBAAgB,EAAE,aAAa,EAAE,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC1F,OAAO,EAAE,QAAQ,EAAE,yCAAmC;AACtD,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,6BAA6B,EAAE,oBAAoB,EAAE,MAAM,8CAA8C,CAAC;AACnH,OAAO,EACL,0BAA0B,EAC1B,sBAAsB,EACtB,yBAAyB,EACzB,0BAA0B,EAC3B,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAC;AAEpD;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAM9B,EAAe,EAAE;IAChB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,yBAAyB,GAAG,OAAO,CACvC,GAAG,EAAE,CAAC,CAAC;QACL,IAAI,EAAE;YACJ,QAAQ,EAAE,QAAQ;YAClB,OAAO,EAAE,gBAAgB;YACzB,WAAW,EAAE,SAAS;YACtB,eAAe,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc;~~SACrD~~;QACD,IAAI,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB,EAAE;QAC/C,WAAW,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB,EAAE;QACtD,WAAW,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB,EAAE;KACvD,CAAC,EACF,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,~~CACtE~~,CAAC;IAEF,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;QACrB,OAAO,oBAAC,oBAAoB,oBAAK,KAAK,EAAI,CAAC;IAC7C,CAAC;IAED,OAAO,CACL,oBAAC,KAAK,IAAC,UAAU,QAAC,eAAe,EAAC,eAAe,EAAC,MAAM,EAAE,6BAA6B,EAAE,aAAa,EAAC,QAAQ;QAC7G,oBAAC,KAAK,CAAC,IAAI,IAAC,IAAI,EAAC,SAAS,EAAC,MAAM,EAAE,oBAAoB,gBAAc,KAAK,CAAC,WAAW,gBAAc,CAAC,IAClG,KAAK,CAAC,WAAW,CACP;QACb,oBAAC,KAAK,CAAC,IAAI;YACT,oBAAC,gBAAgB,IACf,SAAS,EAAE,KAAK,CAAC,8BAA8B,EAC/C,MAAM,EAAE,yBAAyB,EACjC,SAAS,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,EACjC,OAAO,EAAE,KAAK,CAAC,OAAO,GACtB,CACS,CACP,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,oBAAoB,GAAG,CAAC,KAK7B,EAAe,EAAE;IAChB,MAAM,EAAE,WAAW,EAAE,8BAA8B,EAAE,oCAAoC,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAC7G,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,4BAA4B,GAAG,OAAO,CAAC,GAAG,EAAE;QAChD,OAAO,eAAe,CAAC,sBAAsB,EAAE;YAC7C,IAAI,EAAE;gBACJ,KAAK,EAAE,MAAM;aACd;YACD,KAAK,EAAE;gBACL,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ;gBACrC,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU;aAC1C;SACF,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACL,oBAAC,KAAK,IAAC,UAAU,QAAC,IAAI,QAAC,MAAM,EAAE,yBAAyB;QACtD,oBAAC,aAAa,IACZ,SAAS,EAAE,8BAA8B,EACzC,eAAe,EAAE,oCAAoC,EACrD,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,0BAA0B,EAClC,YAAY,EAAE,GAAG,EAAE,CAAC,oBAAC,yBAAyB,IAAC,QAAQ,EAAC,aAAa,GAAG,EACxE,SAAS,SACM;QACjB,oBAAC,KAAK,CAAC,IAAI,IAAC,IAAI;YACd,oBAAC,aAAa,IAAC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,4BAA4B,IAC/D,WAAW,CACE,CACL;QAEb,oBAAC,aAAa,IACZ,MAAM,EAAE,0BAA0B,EAClC,UAAU,EAAE,IAAI,EAChB,YAAY,EAAE,GAAG,EAAE,CAAC,oBAAC,yBAAyB,IAAC,QAAQ,EAAC,aAAa,GAAG,GACzD,CACX,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { CommandBarButton, DefaultButton, Stack, concatStyleSets } from '@fluentui/react';\nimport { useTheme } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { sidePaneHeaderContainerStyles, sidePaneHeaderStyles } from '../common/styles/ParticipantContainer.styles';\nimport {\n mobilePaneBackButtonStyles,\n mobilePaneButtonStyles,\n mobilePaneControlBarStyle,\n mobilePaneHiddenIconStyles\n} from './styles/Pane.styles';\nimport { CallWithChatCompositeIcon } from './icons';\n\n/*\n @private\n /\nexport const SidePaneHeader = (props: {\n headingText?: string;\n dismissSidePaneButtonAriaLabel?: string;\n dismissSidePaneButtonAriaDescription?: string;\n onClose: () => void;\n mobileView: boolean;\n}): JSX.Element => {\n const theme = useTheme();\n const sidePaneCloseButtonStyles = useMemo(\n () => ({\n root: {\n minWidth: '1.5rem',\n padding: '0.5rem 0.25rem',\n marginRight: '0.25rem',\n backgroundColor: theme.semanticColors.bodyBackground\n },\n icon: { color: theme.palette.neutralSecondary },\n iconHovered: { color: theme.palette.neutralSecondary },\n iconPressed: { color: theme.palette.neutralSecondary }\n }),\n [theme.palette.neutralSecondary, theme.semanticColors.bodyBackground]\n );\n\n if (props.mobileView) {\n return <SidePaneMobileHeader {...props} />;\n }\n\n return (\n <Stack horizontal horizontalAlign=\"space-between\" styles={sidePaneHeaderContainerStyles} verticalAlign=\"center\">\n <Stack.Item role=\"heading\" styles={sidePaneHeaderStyles} aria-label={props.headingText} aria-level={2}>\n {props.headingText}\n </Stack.Item>\n <Stack.Item>\n <CommandBarButton\n ariaLabel={props.dismissSidePaneButtonAriaLabel}\n styles={sidePaneCloseButtonStyles}\n iconProps={{ iconName: 'cancel' }}\n onClick={props.onClose}\n />\n </Stack.Item>\n </Stack>\n );\n};\n\nconst SidePaneMobileHeader = (props: {\n headingText?: string;\n dismissSidePaneButtonAriaLabel?: string;\n dismissSidePaneButtonAriaDescription?: string;\n onClose: () => void;\n}): JSX.Element => {\n const { headingText, dismissSidePaneButtonAriaLabel, dismissSidePaneButtonAriaDescription, onClose } = props;\n const theme = useTheme();\n const mobilePaneButtonStylesThemed = useMemo(() => {\n return concatStyleSets(mobilePaneButtonStyles, {\n root: {\n width: '100%'\n },\n label: {\n fontSize: theme.fonts.medium.fontSize,\n fontWeight: theme.fonts.medium.fontWeight\n }\n });\n }, [theme]);\n\n return (\n <Stack horizontal grow styles={mobilePaneControlBarStyle}>\n <DefaultButton\n ariaLabel={dismissSidePaneButtonAriaLabel}\n ariaDescription={dismissSidePaneButtonAriaDescription}\n onClick={onClose}\n styles={mobilePaneBackButtonStyles}\n onRenderIcon={() => <CallWithChatCompositeIcon iconName=\"ChevronLeft\" />}\n autoFocus\n ></DefaultButton>\n <Stack.Item grow>\n <DefaultButton checked={true} styles={mobilePaneButtonStylesThemed}>\n {headingText}\n </DefaultButton>\n </Stack.Item>\n {/ Hidden icon to take the same space as the actual back button on the left. */}\n <DefaultButton\n styles={mobilePaneHiddenIconStyles}\n ariaHidden={true}\n onRenderIcon={() => <CallWithChatCompositeIcon iconName=\"ChevronLeft\" />}\n ></DefaultButton>\n </Stack>\n );\n};\n"]}
1	+ {"version":3,"file":"SidePaneHeader.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/common/SidePaneHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { CommandBarButton, DefaultButton, Stack, concatStyleSets } from '@fluentui/react';\nimport { useTheme } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { sidePaneHeaderContainerStyles, sidePaneHeaderStyles } from '../common/styles/ParticipantContainer.styles';\nimport {\n mobilePaneBackButtonStyles,\n mobilePaneButtonStyles,\n mobilePaneControlBarStyle,\n mobilePaneHiddenIconStyles\n} from './styles/Pane.styles';\nimport { CallWithChatCompositeIcon } from './icons';\n\n/*\n @private\n /\nexport const SidePaneHeader = (props: {\n headingText?: string;\n dismissSidePaneButtonAriaLabel?: string;\n dismissSidePaneButtonAriaDescription?: string;\n onClose: () => void;\n mobileView: boolean;\n}): JSX.Element => {\n const theme = useTheme();\n const sidePaneCloseButtonStyles = useMemo(\n () => ({\n root: {\n minWidth: '1.5rem',\n padding: '0.5rem 0.25rem',\n marginRight: '0.25rem',\n backgroundColor: theme.semanticColors.bodyBackground,\n '@media (forced-colors: active)': {\n border: `0.1rem solid ${theme.palette.neutralSecondary}`,\n borderRadius: theme.effects.roundedCorner4\n }\n },\n icon: { color: theme.palette.neutralSecondary },\n iconHovered: { color: theme.palette.neutralSecondary },\n iconPressed: { color: theme.palette.neutralSecondary }\n }),\n [theme.palette.neutralSecondary, theme.semanticColors.bodyBackground, theme.effects.roundedCorner4]\n );\n\n if (props.mobileView) {\n return <SidePaneMobileHeader {...props} />;\n }\n\n return (\n <Stack horizontal horizontalAlign=\"space-between\" styles={sidePaneHeaderContainerStyles} verticalAlign=\"center\">\n <Stack.Item role=\"heading\" styles={sidePaneHeaderStyles} aria-label={props.headingText} aria-level={2}>\n {props.headingText}\n </Stack.Item>\n <Stack.Item>\n <CommandBarButton\n ariaLabel={props.dismissSidePaneButtonAriaLabel}\n styles={sidePaneCloseButtonStyles}\n iconProps={{ iconName: 'cancel' }}\n onClick={props.onClose}\n />\n </Stack.Item>\n </Stack>\n );\n};\n\nconst SidePaneMobileHeader = (props: {\n headingText?: string;\n dismissSidePaneButtonAriaLabel?: string;\n dismissSidePaneButtonAriaDescription?: string;\n onClose: () => void;\n}): JSX.Element => {\n const { headingText, dismissSidePaneButtonAriaLabel, dismissSidePaneButtonAriaDescription, onClose } = props;\n const theme = useTheme();\n const mobilePaneButtonStylesThemed = useMemo(() => {\n return concatStyleSets(mobilePaneButtonStyles, {\n root: {\n width: '100%'\n },\n label: {\n fontSize: theme.fonts.medium.fontSize,\n fontWeight: theme.fonts.medium.fontWeight\n }\n });\n }, [theme]);\n\n return (\n <Stack horizontal grow styles={mobilePaneControlBarStyle}>\n <DefaultButton\n ariaLabel={dismissSidePaneButtonAriaLabel}\n ariaDescription={dismissSidePaneButtonAriaDescription}\n onClick={onClose}\n styles={mobilePaneBackButtonStyles}\n onRenderIcon={() => <CallWithChatCompositeIcon iconName=\"ChevronLeft\" />}\n autoFocus\n ></DefaultButton>\n <Stack.Item grow>\n <DefaultButton checked={true} styles={mobilePaneButtonStylesThemed}>\n {headingText}\n </DefaultButton>\n </Stack.Item>\n {/ Hidden icon to take the same space as the actual back button on the left. */}\n <DefaultButton\n styles={mobilePaneHiddenIconStyles}\n ariaHidden={true}\n onRenderIcon={() => <CallWithChatCompositeIcon iconName=\"ChevronLeft\" />}\n ></DefaultButton>\n </Stack>\n );\n};\n"]}

package/dist/dist-esm/react-composites/src/composites/common/styles/Pane.styles.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { IButtonStyles, IStackStyles, IStackTokens } from '@fluentui/react';
+import { IButtonStyles, IStackStyles, IStackTokens, ITheme } from '@fluentui/react';
 /**
  * @private
  */
@@ -44,4 +44,6 @@ export declare const availableSpaceStyles: IStackStyles;
  * @private
  */
 export declare const sidePaneTokens: IStackTokens;
+/** @private */
+export declare const paneHighContrastStyles: (theme: ITheme) => string;
 //# sourceMappingURL=Pane.styles.d.ts.map

package/dist/dist-esm/react-composites/src/composites/common/styles/Pane.styles.js CHANGED Viewed

@@ -1,6 +1,6 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
-import { concatStyleSets } from '@fluentui/react';
+import { concatStyleSets, mergeStyles } from '@fluentui/react';
 import { CHAT_CONTAINER_MIN_WIDTH_REM } from '../constants';
 const SIDE_PANE_PADDING_LR_REM = 0.25;
 /**
@@ -91,4 +91,12 @@ export const availableSpaceStyles = { root: { width: '100%', height: '100%' } };
 export const sidePaneTokens = {
     childrenGap: '0.5rem'
 };
+/** @private */
+export const paneHighContrastStyles = (theme) => mergeStyles({
+    '@media (forced-colors: active)': {
+        border: `0.125rem solid ${theme.palette.black}`,
+        borderRadius: theme.effects.roundedCorner4,
+        margin: '0.5rem 0.25rem 0.5rem 0rem'
+    }
+});
 //# sourceMappingURL=Pane.styles.js.map

package/dist/dist-esm/react-composites/src/composites/common/styles/Pane.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Pane.styles.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/common/styles/Pane.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,~~EAA6C~~,MAAM,iBAAiB,CAAC;~~AAC7F~~,OAAO,EAAE,4BAA4B,EAAE,MAAM,cAAc,CAAC;AAE5D,MAAM,wBAAwB,GAAG,IAAI,CAAC;AAEtC;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,CAAC;AAE3E;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAiB,eAAe,CAAC,eAAe,EAAE,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC;AAEnH;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAiB,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,CAAC;AAEpF;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAkB;IACvD,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,QAAQ;QAClB,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,MAAM;QAClB,OAAO,EAAE,QAAQ;KAClB;IACD,WAAW,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE;IACnC,kBAAkB,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE;CAC3C,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAkB,eAAe,CAAC,0BAA0B,EAAE;IACnG,IAAI,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE;CAC/B,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAkB;IACnD,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;QACd,YAAY,EAAE,4BAA4B;QAC1C,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;QACd,UAAU,EAAE,MAAM;QAClB,OAAO,EAAE,GAAG;KACb;IACD,WAAW,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE;IACnC,kBAAkB,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE;IAC1C,aAAa,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE;IAC1D,KAAK,EAAE;QACL,QAAQ,EAAE,MAAM;QAChB,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,MAAM;QAClB,QAAQ,EAAE,QAAQ;QAClB,YAAY,EAAE,UAAU;QACxB,UAAU,EAAE,QAAQ;KACrB;IACD,YAAY,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE;CAClC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAiB;IACxC,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM;KAChB;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,QAAiB,EAAE,QAAiB,EAAgB,EAAE,CAAC,CAAC;IACrF,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;QACd,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,UAAU,wBAAwB,KAAK;QAChD,QAAQ,EAAE,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,SAAS;QAC/B,QAAQ,EAAE,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,GAAG,4BAA4B,GAAG,wBAAwB,GAAG,CAAC,KAAK;KAC1F;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAiB,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,CAAC;AAE9F;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAiB;IAC1C,WAAW,EAAE,QAAQ;CACtB,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { concatStyleSets, IButtonStyles, IStackStyles, IStackTokens } from '@fluentui/react';\nimport { CHAT_CONTAINER_MIN_WIDTH_REM } from '../constants';\n\nconst SIDE_PANE_PADDING_LR_REM = 0.25;\n\n/*\n @private\n /\nexport const mobilePaneStyle = { root: { width: '100%', height: '100%' } };\n\n/\n @private\n /\nexport const hiddenMobilePaneStyle: IStackStyles = concatStyleSets(mobilePaneStyle, { root: { display: 'none' } });\n\n/\n @private\n /\nexport const mobilePaneControlBarStyle: IStackStyles = { root: { height: '3rem' } };\n\n/\n @private\n /\nexport const mobilePaneBackButtonStyles: IButtonStyles = {\n root: {\n border: 'none',\n minWidth: '2.5rem',\n maxWidth: '2.875rem',\n height: '100%',\n background: 'none',\n padding: '0 1rem'\n },\n rootChecked: { background: 'none' },\n rootCheckedHovered: { background: 'none' }\n};\n\n/\n @private\n /\nexport const mobilePaneHiddenIconStyles: IButtonStyles = concatStyleSets(mobilePaneBackButtonStyles, {\n root: { visibility: 'hidden' }\n});\n\n/\n @private\n /\nexport const mobilePaneButtonStyles: IButtonStyles = {\n root: {\n border: 'none',\n borderBottom: '0.125rem solid transparent',\n width: '8rem',\n height: '100%',\n background: 'none',\n padding: '0'\n },\n rootChecked: { background: 'none' },\n rootCheckedHovered: { background: 'none' },\n flexContainer: { flexFlow: 'column', display: 'contents' },\n label: {\n fontSize: '1rem',\n fontWeight: 100,\n lineHeight: '2rem',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap'\n },\n labelChecked: { fontWeight: 600 }\n};\n\n/\n @private\n /\nexport const hiddenStyles: IStackStyles = {\n root: {\n display: 'none'\n }\n};\n\n/\n @private\n /\nexport const sidePaneStyles = (maxWidth?: string, minWidth?: string): IStackStyles => ({\n root: {\n height: 'auto',\n width: '100%',\n padding: `0.5rem ${SIDE_PANE_PADDING_LR_REM}rem`,\n maxWidth: maxWidth ?? '21.5rem',\n minWidth: minWidth ?? `${CHAT_CONTAINER_MIN_WIDTH_REM + SIDE_PANE_PADDING_LR_REM 2}rem`\n }\n});\n\n/*\n @private\n /\nexport const availableSpaceStyles: IStackStyles = { root: { width: '100%', height: '100%' } };\n\n/\n @private\n */\nexport const sidePaneTokens: IStackTokens = {\n childrenGap: '0.5rem'\n};\n"]}
1	+ {"version":3,"file":"Pane.styles.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/common/styles/Pane.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { concatStyleSets, IButtonStyles, IStackStyles, IStackTokens, ITheme, mergeStyles } from '@fluentui/react';\nimport { CHAT_CONTAINER_MIN_WIDTH_REM } from '../constants';\n\nconst SIDE_PANE_PADDING_LR_REM = 0.25;\n\n/*\n @private\n /\nexport const mobilePaneStyle = { root: { width: '100%', height: '100%' } };\n\n/\n @private\n /\nexport const hiddenMobilePaneStyle: IStackStyles = concatStyleSets(mobilePaneStyle, { root: { display: 'none' } });\n\n/\n @private\n /\nexport const mobilePaneControlBarStyle: IStackStyles = { root: { height: '3rem' } };\n\n/\n @private\n /\nexport const mobilePaneBackButtonStyles: IButtonStyles = {\n root: {\n border: 'none',\n minWidth: '2.5rem',\n maxWidth: '2.875rem',\n height: '100%',\n background: 'none',\n padding: '0 1rem'\n },\n rootChecked: { background: 'none' },\n rootCheckedHovered: { background: 'none' }\n};\n\n/\n @private\n /\nexport const mobilePaneHiddenIconStyles: IButtonStyles = concatStyleSets(mobilePaneBackButtonStyles, {\n root: { visibility: 'hidden' }\n});\n\n/\n @private\n /\nexport const mobilePaneButtonStyles: IButtonStyles = {\n root: {\n border: 'none',\n borderBottom: '0.125rem solid transparent',\n width: '8rem',\n height: '100%',\n background: 'none',\n padding: '0'\n },\n rootChecked: { background: 'none' },\n rootCheckedHovered: { background: 'none' },\n flexContainer: { flexFlow: 'column', display: 'contents' },\n label: {\n fontSize: '1rem',\n fontWeight: 100,\n lineHeight: '2rem',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap'\n },\n labelChecked: { fontWeight: 600 }\n};\n\n/\n @private\n /\nexport const hiddenStyles: IStackStyles = {\n root: {\n display: 'none'\n }\n};\n\n/\n @private\n /\nexport const sidePaneStyles = (maxWidth?: string, minWidth?: string): IStackStyles => ({\n root: {\n height: 'auto',\n width: '100%',\n padding: `0.5rem ${SIDE_PANE_PADDING_LR_REM}rem`,\n maxWidth: maxWidth ?? '21.5rem',\n minWidth: minWidth ?? `${CHAT_CONTAINER_MIN_WIDTH_REM + SIDE_PANE_PADDING_LR_REM 2}rem`\n }\n});\n\n/*\n @private\n /\nexport const availableSpaceStyles: IStackStyles = { root: { width: '100%', height: '100%' } };\n\n/\n @private\n /\nexport const sidePaneTokens: IStackTokens = {\n childrenGap: '0.5rem'\n};\n\n/* @private */\nexport const paneHighContrastStyles = (theme: ITheme): string =>\n mergeStyles({\n '@media (forced-colors: active)': {\n border: `0.125rem solid ${theme.palette.black}`,\n borderRadius: theme.effects.roundedCorner4,\n margin: '0.5rem 0.25rem 0.5rem 0rem'\n }\n });\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@azure/communication-react",
-  "version": "1.21.0-alpha-202411020018",
+  "version": "1.21.0-alpha-202411060016",
   "sideEffects": false,
   "description": "React library for building modern communication user experiences utilizing Azure Communication Services",
   "keywords": [
@@ -55,7 +55,7 @@
     "uuid": "^9.0.0"
   },
   "peerDependencies": {
-    "@azure/communication-calling": "1.30.1-beta.2",
+    "@azure/communication-calling": "1.31.1-beta.1",
     "@azure/communication-calling-effects": "1.1.1-beta.1",
     "@azure/communication-chat": "1.6.0-beta.3",
     "@types/react": ">=16.8.0 <19.0.0",
@@ -84,6 +84,7 @@
     "build": "rushx check-deps && rushx _by-flavor \"rushx _build:by-flavor\"",
     "build:cjs": "rollup -c --silent",
     "build:esm": "npm run _if-preprocess && rushx copy-original && rushx preprocess && rushx copy-preprocess  && tspc -project tsconfig.preprocess.json || (if-env COMMUNICATION_REACT_FLAVOR=beta && tspc)",
+    "build:minify": "rollup -c rollup.config.mjs",
     "build:watch": "",
     "build:api": "rushx _by-flavor \"rushx _api-extractor:complete:by-flavor\"",
     "clean": "rimraf dist && rimraf ../**/preprocessed && rimraf ../**/preprocess-dist",