@azure/communication-react 1.18.0-beta.1 → 1.18.1

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

@@ -1 +0,0 @@
-{"version":3,"file":"AddPeopleDropdown.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/AddPeopleDropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { DefaultButton, IContextualMenuItem, IContextualMenuProps, PrimaryButton, Stack, useTheme } from '@fluentui/react';\nimport { _DrawerMenu, _DrawerMenuItemProps, Announcer } from '@internal/react-components';\nimport copy from 'copy-to-clipboard';\nimport { useMemo, useState } from 'react';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { CallWithChatCompositeIcon } from './icons';\nimport { iconStyles, themedCopyLinkButtonStyles, themedMenuStyle } from './AddPeopleDropdown.styles';\nimport { CallingDialpad } from './CallingDialpad';\nimport { CallingDialpadStrings } from './CallingDialpad';\nimport { _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\nimport { copyLinkButtonContainerStyles, copyLinkButtonStackStyles } from './styles/PeoplePaneContent.styles';\nimport { drawerContainerStyles } from '../CallComposite/styles/CallComposite.styles';\nimport { convertContextualMenuItemToDrawerMenuItem } from './ConvertContextualMenuItemToDrawerMenuItem';\nimport { PhoneNumberIdentifier } from '@azure/communication-common';\nimport { AddPhoneNumberOptions } from '@azure/communication-calling';\nimport { useId } from '@fluentui/react-hooks';\nimport { CalloutWithIcon } from './CalloutWithIcon';\n\n/** @private */\nexport interface AddPeopleDropdownStrings extends CallingDialpadStrings {\n  copyInviteLinkButtonLabel: string;\n  copyInviteLinkButtonActionedLabel: string;\n  openDialpadButtonLabel: string;\n  peoplePaneAddPeopleButtonLabel: string;\n  copyInviteLinkActionedAriaLabel: string;\n}\n\n/** @private */\nexport interface AddPeopleDropdownProps {\n  inviteLink?: string;\n  mobileView?: boolean;\n  strings: AddPeopleDropdownStrings;\n  onAddParticipant: (participant: PhoneNumberIdentifier, options?: AddPhoneNumberOptions) => void;\n  alternateCallerId?: string;\n  onCopyInviteLink?: () => void;\n  inviteLinkCopiedRecently?: boolean;\n}\n\n/** @private */\nexport const AddPeopleDropdown = (props: AddPeopleDropdownProps): JSX.Element => {\n  const theme = useTheme();\n  const {\n    inviteLink,\n    strings,\n    mobileView,\n    onAddParticipant,\n    alternateCallerId,\n    onCopyInviteLink,\n    inviteLinkCopiedRecently\n  } = props;\n  const [showDialpad, setShowDialpad] = useState(false);\n  const [announcerStrings, setAnnouncerStrings] = useState<string>();\n  const menuStyleThemed = useMemo(() => themedMenuStyle(theme), [theme]);\n  const copyLinkButtonStylesThemed = useMemo(() => themedCopyLinkButtonStyles(theme, mobileView), [mobileView, theme]);\n  const defaultMenuProps = useMemo((): IContextualMenuProps => {\n    const menuProps: IContextualMenuProps = {\n      styles: menuStyleThemed,\n      items: [],\n      useTargetWidth: true,\n      calloutProps: {\n        preventDismissOnEvent\n      },\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      onMenuOpened(contextualMenu?) {\n        setAnnouncerStrings(undefined);\n      }\n    };\n    if (inviteLink) {\n      menuProps.items.push({\n        key: 'InviteLinkKey',\n        text: strings.copyInviteLinkButtonLabel,\n        itemProps: {\n          styles: copyLinkButtonStylesThemed\n        },\n        iconProps: {\n          iconName: 'Link',\n          style: iconStyles\n        },\n        onClick: () => {\n          setAnnouncerStrings(strings.copyInviteLinkActionedAriaLabel);\n          copy(inviteLink);\n          onCopyInviteLink?.();\n        }\n      });\n    }\n\n    // only show the dialpad option when alternateCallerId is set\n    if (alternateCallerId) {\n      menuProps.items.push({\n        key: 'DialpadKey',\n        text: strings.openDialpadButtonLabel,\n        itemProps: {\n          styles: copyLinkButtonStylesThemed\n        },\n        iconProps: {\n          iconName: PeoplePaneOpenDialpadIconNameTrampoline(),\n          style: iconStyles\n        },\n        onClick: () => setShowDialpad(true),\n        'data-ui-id': 'call-dial-phone-number-button'\n      });\n    }\n    return menuProps;\n  }, [menuStyleThemed, inviteLink, alternateCallerId, strings.copyInviteLinkButtonLabel, strings.copyInviteLinkActionedAriaLabel, strings.openDialpadButtonLabel, copyLinkButtonStylesThemed, onCopyInviteLink]);\n  const onDismissDialpad = (): void => {\n    setShowDialpad(false);\n  };\n  const [addPeopleDrawerMenuItems, setAddPeopleDrawerMenuItems] = useState<_DrawerMenuItemProps[]>([]);\n  const setDrawerMenuItemsForAddPeople: () => void = useMemo(() => {\n    return () => {\n      const drawerMenuItems = defaultMenuProps.items.map((contextualMenu: IContextualMenuItem) => convertContextualMenuItemToDrawerMenuItem(contextualMenu, () => setAddPeopleDrawerMenuItems([])));\n      setAddPeopleDrawerMenuItems(drawerMenuItems);\n    };\n  }, [defaultMenuProps, setAddPeopleDrawerMenuItems]);\n  const calloutButtonId = useId('callout-button');\n  if (mobileView) {\n    return <Stack>\n        <Announcer ariaLive={'assertive'} announcementString={announcerStrings} />\n        {defaultMenuProps.items.length > 0 && <Stack.Item styles={copyLinkButtonContainerStyles}>\n            <PrimaryButton id={calloutButtonId} onClick={setDrawerMenuItemsForAddPeople} styles={copyLinkButtonStylesThemed} onRenderIcon={() => PeoplePaneAddPersonIconTrampoline()} text={strings.peoplePaneAddPeopleButtonLabel} data-ui-id=\"call-add-people-button\" />\n            {inviteLinkCopiedRecently && <CalloutWithIcon targetId={calloutButtonId} text={strings.copyInviteLinkButtonActionedLabel} doNotLayer={true} />}\n          </Stack.Item>}\n\n        {addPeopleDrawerMenuItems.length > 0 && <Stack styles={drawerContainerStyles()} data-ui-id=\"call-add-people-dropdown\">\n            <_DrawerMenu disableMaxHeight={true} onLightDismiss={() => setAddPeopleDrawerMenuItems([])} items={addPeopleDrawerMenuItems} />\n          </Stack>}\n        {alternateCallerId && <CallingDialpad isMobile={true} strings={strings} showDialpad={showDialpad} onDismissDialpad={onDismissDialpad} onAddParticipant={onAddParticipant} alternateCallerId={alternateCallerId} />}\n      </Stack>;\n  }\n  return <>\n      {<Stack>\n          <Announcer ariaLive={'assertive'} announcementString={announcerStrings} />\n          {alternateCallerId && <CallingDialpad isMobile={false} strings={strings} showDialpad={showDialpad} onDismissDialpad={onDismissDialpad} onAddParticipant={onAddParticipant} alternateCallerId={alternateCallerId} />}\n\n          {defaultMenuProps.items.length > 0 && <Stack styles={copyLinkButtonStackStyles}>\n              <DefaultButton id={calloutButtonId} onRenderIcon={() => PeoplePaneAddPersonIconTrampoline()} text={strings.peoplePaneAddPeopleButtonLabel} menuProps={defaultMenuProps} styles={copyLinkButtonStylesThemed} data-ui-id=\"call-add-people-button\" />\n              {inviteLinkCopiedRecently && <CalloutWithIcon targetId={calloutButtonId} text={strings.copyInviteLinkButtonActionedLabel} />}\n            </Stack>}\n        </Stack>}\n    </>;\n};\nfunction PeoplePaneOpenDialpadIconNameTrampoline(): string {\n  /* @conditional-compile-remove(PSTN-calls) */\n  return 'PeoplePaneOpenDialpad';\n  return '';\n}\nfunction PeoplePaneAddPersonIconTrampoline(): JSX.Element {\n  /* @conditional-compile-remove(PSTN-calls) */\n  return <CallWithChatCompositeIcon iconName=\"PeoplePaneAddPerson\" />;\n  return <></>;\n}"]}

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

@@ -1,17 +0,0 @@
-import { IButtonStyles, IContextualMenuStyles, Theme } from '@fluentui/react';
-/**
- * @private
- */
-export declare const themedCopyLinkButtonStyles: (theme: Theme, mobileView?: boolean) => Partial<IButtonStyles>;
-/**
- * @private
- */
-export declare const themedMenuStyle: (theme: Theme) => Partial<IContextualMenuStyles>;
-/**
- * @private
- */
-export declare const iconStyles: {
-    lineHeight: string;
-    width: string;
-};
-//# sourceMappingURL=AddPeopleDropdown.styles.d.ts.map

package/dist/dist-esm/react-composites/src/composites/common/AddPeopleDropdown.styles.js

@@ -1,32 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-/**
- * @private
- */
-export const themedCopyLinkButtonStyles = (theme, mobileView) => ({
-    root: {
-        minHeight: mobileView ? '3rem' : '2.5rem',
-        borderRadius: mobileView ? theme.effects.roundedCorner6 : theme.effects.roundedCorner4,
-        width: '100%'
-    },
-    textContainer: {
-        display: 'contents'
-    }
-});
-/**
- * @private
- */
-export const themedMenuStyle = (theme) => ({
-    root: {
-        borderRadius: theme.effects.roundedCorner6
-    }
-});
-/**
- * @private
- */
-export const iconStyles = {
-    // overwrite default line height which results in icons having different size
-    lineHeight: '0',
-    width: '1.125rem'
-};
-//# sourceMappingURL=AddPeopleDropdown.styles.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"AddPeopleDropdown.styles.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/AddPeopleDropdown.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAIlC;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,KAAY,EAAE,UAAoB,EAA0B,EAAE,CAAC,CAAC;IACzG,IAAI,EAAE;QACJ,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ;QACzC,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,cAAc;QACtF,KAAK,EAAE,MAAM;KACd;IACD,aAAa,EAAE;QACb,OAAO,EAAE,UAAU;KACpB;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAAY,EAAkC,EAAE,CAAC,CAAC;IAChF,IAAI,EAAE;QACJ,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;KAC3C;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,6EAA6E;IAC7E,UAAU,EAAE,GAAG;IACf,KAAK,EAAE,UAAU;CAClB,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, IContextualMenuStyles, Theme } from '@fluentui/react';\n\n/**\n * @private\n */\nexport const themedCopyLinkButtonStyles = (theme: Theme, mobileView?: boolean): Partial<IButtonStyles> => ({\n  root: {\n    minHeight: mobileView ? '3rem' : '2.5rem',\n    borderRadius: mobileView ? theme.effects.roundedCorner6 : theme.effects.roundedCorner4,\n    width: '100%'\n  },\n  textContainer: {\n    display: 'contents'\n  }\n});\n\n/**\n * @private\n */\nexport const themedMenuStyle = (theme: Theme): Partial<IContextualMenuStyles> => ({\n  root: {\n    borderRadius: theme.effects.roundedCorner6\n  }\n});\n\n/**\n * @private\n */\nexport const iconStyles = {\n  // overwrite default line height which results in icons having different size\n  lineHeight: '0',\n  width: '1.125rem'\n};"]}

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

@@ -1,22 +0,0 @@
-/// <reference types="react" />
-import { PhoneNumberIdentifier } from '@azure/communication-common';
-import { AddPhoneNumberOptions } from '@azure/communication-calling';
-/** @private */
-export interface CallingDialpadStrings {
-    dialpadModalAriaLabel: string;
-    dialpadModalTitle: string;
-    dialpadCloseModalButtonAriaLabel: string;
-    dialpadStartCallButtonLabel: string;
-}
-/** @private */
-export interface CallingDialpadProps {
-    isMobile: boolean;
-    showDialpad: boolean;
-    strings: CallingDialpadStrings;
-    onDismissDialpad: () => void;
-    onAddParticipant: (participant: PhoneNumberIdentifier, options?: AddPhoneNumberOptions) => void;
-    alternateCallerId: string;
-}
-/** @private */
-export declare const CallingDialpad: (props: CallingDialpadProps) => JSX.Element;
-//# sourceMappingURL=CallingDialpad.d.ts.map

package/dist/dist-esm/react-composites/src/composites/common/CallingDialpad.js

@@ -1,74 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-import React from 'react';
-import { useState } from 'react';
-import { useMemo } from 'react';
-import { Dialpad } from "../../../../react-components/src";
-import { _DrawerSurface } from "../../../../react-components/src";
-import { Modal, Stack, useTheme, Text, IconButton } from '@fluentui/react';
-import { PrimaryButton } from '@fluentui/react';
-import { themeddialpadModalStyle } from './CallingDialpad.styles';
-import { themedCallButtonStyle, themedDialpadStyle } from './CallingDialpad.styles';
-/* @conditional-compile-remove(PSTN-calls) */
-import { CallWithChatCompositeIcon } from './icons';
-import { drawerContainerStyles } from '../CallComposite/styles/CallComposite.styles';
-/** @private */
-export const CallingDialpad = (props) => {
-    const { strings, isMobile, showDialpad, onDismissDialpad, onAddParticipant, alternateCallerId } = props;
-    const [textFieldInput, setTextFieldInput] = useState('');
-    const theme = useTheme();
-    const onDismissTriggered = () => {
-        setTextFieldInput('');
-        onDismissDialpad();
-    };
-    const onClickCall = () => {
-        if (onAddParticipant) {
-            /**
-             * Format the phone number in dialpad textfield to make sure the phone number is in E.164 format.
-             * We assume the input number always include countrycode
-             */
-            const phoneNumber = {
-                phoneNumber: '+' + textFieldInput.replace(/\D/g, '').replaceAll(' ', '')
-            };
-            onAddParticipant(phoneNumber, {
-                alternateCallerId: {
-                    phoneNumber: alternateCallerId
-                }
-            });
-            onDismissTriggered();
-        }
-    };
-    const dialpadModalStyle = useMemo(() => themeddialpadModalStyle(theme), [theme]);
-    const dialpadStyle = useMemo(() => themedDialpadStyle(isMobile, theme), [theme, isMobile]);
-    const callButtonStyle = useMemo(() => themedCallButtonStyle(theme), [theme]);
-    const dialpadComponent = () => {
-        return React.createElement(React.Fragment, null,
-            React.createElement(Dialpad, { styles: dialpadStyle, onChange: setTextFieldInput, longPressTrigger: isMobile ? 'touch' : 'mouseAndTouch' }),
-            React.createElement(PrimaryButton, { text: strings.dialpadStartCallButtonLabel, onRenderIcon: () => DialpadStartCallIconTrampoline(), onClick: onClickCall, styles: callButtonStyle, disabled: textFieldInput === '' }));
-        return React.createElement(React.Fragment, null);
-    };
-    if (isMobile) {
-        return React.createElement(Stack, { "data-ui-id": "call-with-chat-composite-dialpad" }, showDialpad && React.createElement(Stack, { styles: drawerContainerStyles() },
-            React.createElement(_DrawerSurface, { onLightDismiss: onDismissTriggered, disableMaxHeight: true },
-                React.createElement(Stack, { style: {
-                        padding: '1rem'
-                    } }, dialpadComponent()))));
-    }
-    return React.createElement(React.Fragment, null, React.createElement(Modal, { titleAriaId: strings.dialpadModalAriaLabel, isOpen: showDialpad, onDismiss: onDismissTriggered, isBlocking: true, styles: dialpadModalStyle, "data-ui-id": "call-with-chat-composite-dialpad" },
-        React.createElement(Stack, { horizontal: true, horizontalAlign: "space-between", verticalAlign: "center" },
-            React.createElement(Text, null, strings.dialpadModalTitle),
-            React.createElement(IconButton, { iconProps: {
-                    iconName: 'Cancel'
-                }, ariaLabel: strings.dialpadCloseModalButtonAriaLabel, onClick: onDismissTriggered, style: {
-                    color: theme.palette.black
-                } })),
-        React.createElement(Stack, { style: {
-                overflow: 'hidden'
-            } }, dialpadComponent())));
-};
-function DialpadStartCallIconTrampoline() {
-    /* @conditional-compile-remove(PSTN-calls) */
-    return React.createElement(CallWithChatCompositeIcon, { iconName: "DialpadStartCall" });
-    return React.createElement(React.Fragment, null);
-}
-//# sourceMappingURL=CallingDialpad.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"CallingDialpad.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/CallingDialpad.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { useState } from 'react';\nimport { useMemo } from 'react';\nimport { Dialpad, DialpadStyles } from '@internal/react-components';\nimport { _DrawerMenu, _DrawerMenuItemProps, _DrawerSurface } from '@internal/react-components';\nimport { IModalStyles, Modal, Stack, useTheme, Text, IconButton } from '@fluentui/react';\nimport { IButtonStyles, PrimaryButton } from '@fluentui/react';\nimport { themeddialpadModalStyle } from './CallingDialpad.styles';\nimport { themedCallButtonStyle, themedDialpadStyle } from './CallingDialpad.styles';\n/* @conditional-compile-remove(PSTN-calls) */\nimport { CallWithChatCompositeIcon } from './icons';\nimport { PhoneNumberIdentifier } from '@azure/communication-common';\nimport { AddPhoneNumberOptions } from '@azure/communication-calling';\nimport { drawerContainerStyles } from '../CallComposite/styles/CallComposite.styles';\n\n/** @private */\nexport interface CallingDialpadStrings {\n  dialpadModalAriaLabel: string;\n  dialpadModalTitle: string;\n  dialpadCloseModalButtonAriaLabel: string;\n  dialpadStartCallButtonLabel: string;\n}\n\n/** @private */\nexport interface CallingDialpadProps {\n  isMobile: boolean;\n  showDialpad: boolean;\n  strings: CallingDialpadStrings;\n  onDismissDialpad: () => void;\n  onAddParticipant: (participant: PhoneNumberIdentifier, options?: AddPhoneNumberOptions) => void;\n  alternateCallerId: string;\n}\n\n/** @private */\nexport const CallingDialpad = (props: CallingDialpadProps): JSX.Element => {\n  const {\n    strings,\n    isMobile,\n    showDialpad,\n    onDismissDialpad,\n    onAddParticipant,\n    alternateCallerId\n  } = props;\n  const [textFieldInput, setTextFieldInput] = useState('');\n  const theme = useTheme();\n  const onDismissTriggered = (): void => {\n    setTextFieldInput('');\n    onDismissDialpad();\n  };\n  const onClickCall = (): void => {\n    if (onAddParticipant) {\n      /**\n       * Format the phone number in dialpad textfield to make sure the phone number is in E.164 format.\n       * We assume the input number always include countrycode\n       */\n\n      const phoneNumber = {\n        phoneNumber: '+' + textFieldInput.replace(/\\D/g, '').replaceAll(' ', '')\n      };\n      onAddParticipant(phoneNumber, {\n        alternateCallerId: {\n          phoneNumber: alternateCallerId\n        }\n      });\n      onDismissTriggered();\n    }\n  };\n  const dialpadModalStyle: Partial<IModalStyles> = useMemo(() => themeddialpadModalStyle(theme), [theme]);\n  const dialpadStyle: Partial<DialpadStyles> = useMemo(() => themedDialpadStyle(isMobile, theme), [theme, isMobile]);\n  const callButtonStyle: Partial<IButtonStyles> = useMemo(() => themedCallButtonStyle(theme), [theme]);\n  const dialpadComponent = (): JSX.Element => {\n    return <>\n        <Dialpad styles={dialpadStyle} onChange={setTextFieldInput} longPressTrigger={isMobile ? 'touch' : 'mouseAndTouch'} />\n        <PrimaryButton text={strings.dialpadStartCallButtonLabel} onRenderIcon={() => DialpadStartCallIconTrampoline()} onClick={onClickCall} styles={callButtonStyle} disabled={textFieldInput === ''} />\n      </>;\n    return <></>;\n  };\n  if (isMobile) {\n    return <Stack data-ui-id=\"call-with-chat-composite-dialpad\">\n        {showDialpad && <Stack styles={drawerContainerStyles()}>\n            <_DrawerSurface onLightDismiss={onDismissTriggered} disableMaxHeight={true}>\n              <Stack style={{\n            padding: '1rem'\n          }}>{dialpadComponent()}</Stack>\n            </_DrawerSurface>\n          </Stack>}\n      </Stack>;\n  }\n  return <>\n      {<Modal titleAriaId={strings.dialpadModalAriaLabel} isOpen={showDialpad} onDismiss={onDismissTriggered} isBlocking={true} styles={dialpadModalStyle} data-ui-id=\"call-with-chat-composite-dialpad\">\n          <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\">\n            <Text>{strings.dialpadModalTitle}</Text>\n            <IconButton iconProps={{\n          iconName: 'Cancel'\n        }} ariaLabel={strings.dialpadCloseModalButtonAriaLabel} onClick={onDismissTriggered} style={{\n          color: theme.palette.black\n        }} />\n          </Stack>\n\n          <Stack style={{\n        overflow: 'hidden'\n      }}>{dialpadComponent()}</Stack>\n        </Modal>}\n    </>;\n};\nfunction DialpadStartCallIconTrampoline(): JSX.Element {\n  /* @conditional-compile-remove(PSTN-calls) */\n  return <CallWithChatCompositeIcon iconName=\"DialpadStartCall\" />;\n  return <></>;\n}"]}

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

@@ -1,15 +0,0 @@
-import { IButtonStyles, IModalStyles, Theme } from '@fluentui/react';
-import { DialpadStyles } from "../../../../react-components/src";
-/**
- * @private
- */
-export declare const themeddialpadModalStyle: (theme: Theme) => Partial<IModalStyles>;
-/**
- * @private
- */
-export declare const themedDialpadStyle: (isMobile: boolean, theme: Theme) => Partial<DialpadStyles>;
-/**
- * @private
- */
-export declare const themedCallButtonStyle: (theme: Theme) => Partial<IButtonStyles>;
-//# sourceMappingURL=CallingDialpad.styles.d.ts.map

package/dist/dist-esm/react-composites/src/composites/common/CallingDialpad.styles.js

@@ -1,61 +0,0 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-/**
- * @private
- */
-export const themeddialpadModalStyle = (theme) => ({
-    main: {
-        borderRadius: theme.effects.roundedCorner6,
-        padding: '1rem'
-    }
-});
-/**
- * @private
- */
-export const themedDialpadStyle = (isMobile, theme) => ({
-    root: {
-        padding: 0,
-        marginLeft: 0,
-        marginRight: 0,
-        maxWidth: '100%'
-    },
-    textField: {
-        root: {
-            borderBottom: `1px solid ${theme.palette.neutralTertiaryAlt}`
-        },
-        field: {
-            backgroundColor: theme.palette.white,
-            fontSize: theme.fonts.large.fontSize,
-            padding: '0 0.5rem',
-            textAlign: isMobile ? 'center' : 'left',
-            ':active': {
-                padding: '0 0.5rem'
-            }
-        }
-    },
-    deleteIcon: {
-        root: {
-            backgroundColor: theme.palette.white
-        }
-    },
-    digit: {
-        color: theme.palette.themeDarkAlt
-    }
-});
-/**
- * @private
- */
-export const themedCallButtonStyle = (theme) => ({
-    root: {
-        fontWeight: theme.fonts.medium.fontWeight,
-        fontSize: theme.fonts.medium.fontSize,
-        width: '100%',
-        height: '2.5rem',
-        borderRadius: 3,
-        padding: '0.625rem'
-    },
-    textContainer: {
-        display: 'contents'
-    }
-});
-//# sourceMappingURL=CallingDialpad.styles.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"CallingDialpad.styles.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/CallingDialpad.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAKlC;;GAEG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,KAAY,EAAyB,EAAE,CAAC,CAAC;IAC/E,IAAI,EAAE;QACJ,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;QAC1C,OAAO,EAAE,MAAM;KAChB;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,QAAiB,EAAE,KAAY,EAA0B,EAAE,CAAC,CAAC;IAC9F,IAAI,EAAE;QACJ,OAAO,EAAE,CAAC;QACV,UAAU,EAAE,CAAC;QACb,WAAW,EAAE,CAAC;QACd,QAAQ,EAAE,MAAM;KACjB;IACD,SAAS,EAAE;QACT,IAAI,EAAE;YACJ,YAAY,EAAE,aAAa,KAAK,CAAC,OAAO,CAAC,kBAAkB,EAAE;SAC9D;QACD,KAAK,EAAE;YACL,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;YACpC,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ;YACpC,OAAO,EAAE,UAAU;YACnB,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM;YACvC,SAAS,EAAE;gBACT,OAAO,EAAE,UAAU;aACpB;SACF;KACF;IACD,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK;SACrC;KACF;IACD,KAAK,EAAE;QACL,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;KAClC;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,KAAY,EAA0B,EAAE,CAAC,CAAC;IAC9E,IAAI,EAAE;QACJ,UAAU,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU;QACzC,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ;QACrC,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,QAAQ;QAChB,YAAY,EAAE,CAAC;QACf,OAAO,EAAE,UAAU;KACpB;IACD,aAAa,EAAE;QACb,OAAO,EAAE,UAAU;KACpB;CACF,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, IModalStyles, Theme } from '@fluentui/react';\nimport { DialpadStyles } from '@internal/react-components';\n\n/**\n * @private\n */\nexport const themeddialpadModalStyle = (theme: Theme): Partial<IModalStyles> => ({\n  main: {\n    borderRadius: theme.effects.roundedCorner6,\n    padding: '1rem'\n  }\n});\n\n/**\n * @private\n */\nexport const themedDialpadStyle = (isMobile: boolean, theme: Theme): Partial<DialpadStyles> => ({\n  root: {\n    padding: 0,\n    marginLeft: 0,\n    marginRight: 0,\n    maxWidth: '100%'\n  },\n  textField: {\n    root: {\n      borderBottom: `1px solid ${theme.palette.neutralTertiaryAlt}`\n    },\n    field: {\n      backgroundColor: theme.palette.white,\n      fontSize: theme.fonts.large.fontSize,\n      padding: '0 0.5rem',\n      textAlign: isMobile ? 'center' : 'left',\n      ':active': {\n        padding: '0 0.5rem'\n      }\n    }\n  },\n  deleteIcon: {\n    root: {\n      backgroundColor: theme.palette.white\n    }\n  },\n  digit: {\n    color: theme.palette.themeDarkAlt\n  }\n});\n\n/**\n * @private\n */\nexport const themedCallButtonStyle = (theme: Theme): Partial<IButtonStyles> => ({\n  root: {\n    fontWeight: theme.fonts.medium.fontWeight,\n    fontSize: theme.fonts.medium.fontSize,\n    width: '100%',\n    height: '2.5rem',\n    borderRadius: 3,\n    padding: '0.625rem'\n  },\n  textContainer: {\n    display: 'contents'\n  }\n});"]}