@azure/communication-react 1.2.3-alpha-202205110014.0 → 1.2.3-alpha-202205120015.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dist-cjs/communication-react/index.js +130 -90
- package/dist/dist-cjs/communication-react/index.js.map +1 -1
- package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js +1 -1
- package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.js +0 -2
- package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/Dialpad/Dialpad.d.ts +50 -0
- package/dist/dist-esm/react-components/src/components/Dialpad/Dialpad.d.ts.map +1 -0
- package/dist/dist-esm/react-components/src/components/Dialpad/Dialpad.js +72 -0
- package/dist/dist-esm/react-components/src/components/Dialpad/Dialpad.js.map +1 -0
- package/dist/dist-esm/react-components/src/components/InputBoxComponent.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/InputBoxComponent.js +1 -2
- package/dist/dist-esm/react-components/src/components/InputBoxComponent.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/LocalVideoTile.d.ts +29 -0
- package/dist/dist-esm/react-components/src/components/LocalVideoTile.d.ts.map +1 -0
- package/dist/dist-esm/react-components/src/components/LocalVideoTile.js +66 -0
- package/dist/dist-esm/react-components/src/components/LocalVideoTile.js.map +1 -0
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.d.ts +2 -0
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.js +2 -0
- package/dist/dist-esm/react-components/src/components/RemoteVideoTile.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/SendBox.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/SendBox.js +0 -2
- package/dist/dist-esm/react-components/src/components/SendBox.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/VideoGallery.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/VideoGallery.js +18 -40
- package/dist/dist-esm/react-components/src/components/VideoGallery.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/index.d.ts +2 -0
- package/dist/dist-esm/react-components/src/components/index.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/index.js +1 -0
- package/dist/dist-esm/react-components/src/components/index.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/ChatMessageComponent.styles.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/ChatMessageComponent.styles.js +1 -2
- package/dist/dist-esm/react-components/src/components/styles/ChatMessageComponent.styles.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/Dialpad.styles.d.ts +22 -0
- package/dist/dist-esm/react-components/src/components/styles/Dialpad.styles.d.ts.map +1 -0
- package/dist/dist-esm/react-components/src/components/styles/Dialpad.styles.js +74 -0
- package/dist/dist-esm/react-components/src/components/styles/Dialpad.styles.js.map +1 -0
- package/dist/dist-esm/react-components/src/components/styles/InputBoxComponent.style.d.ts +1 -1
- package/dist/dist-esm/react-components/src/components/styles/InputBoxComponent.style.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/InputBoxComponent.style.js +20 -25
- package/dist/dist-esm/react-components/src/components/styles/InputBoxComponent.style.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/SendBox.styles.d.ts +0 -1
- package/dist/dist-esm/react-components/src/components/styles/SendBox.styles.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/SendBox.styles.js +3 -3
- package/dist/dist-esm/react-components/src/components/styles/SendBox.styles.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/utils/formatPhoneNumber.d.ts +5 -0
- package/dist/dist-esm/react-components/src/components/utils/formatPhoneNumber.d.ts.map +1 -0
- package/dist/dist-esm/react-components/src/components/utils/formatPhoneNumber.js +44 -0
- package/dist/dist-esm/react-components/src/components/utils/formatPhoneNumber.js.map +1 -0
- package/dist/dist-esm/react-components/src/localization/LocalizationProvider.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/localization/LocalizationProvider.js.map +1 -1
- package/dist/dist-esm/react-components/src/theming/themes.d.ts.map +1 -1
- package/dist/dist-esm/react-components/src/theming/themes.js +6 -0
- package/dist/dist-esm/react-components/src/theming/themes.js.map +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.js +1 -1
- package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.js.map +1 -1
- package/package.json +7 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatMessageComponentAsEditBox.d.ts","sourceRoot":"","sources":["../../../../../../../react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"ChatMessageComponentAsEditBox.d.ts","sourceRoot":"","sources":["../../../../../../../react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAExD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAgB1C,eAAe;AACf,oBAAY,kCAAkC,GAAG;IAC/C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,oBAAoB,CAAC;IAC9B;;;OAGG;IACH,iBAAiB,EAAE,OAAO,CAAC;CAC5B,CAAC;AAIF;;GAEG;AACH,eAAO,MAAM,6BAA6B,UAAW,kCAAkC,KAAG,WA2GzF,CAAC"}
|
package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.js
CHANGED
|
@@ -7,7 +7,6 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react';
|
|
|
7
7
|
import { editBoxStyle, inputBoxIcon, editingButtonStyle, editBoxStyleSet } from '../styles/EditBox.styles';
|
|
8
8
|
import { InputBoxButton, InputBoxComponent } from '../InputBoxComponent';
|
|
9
9
|
import { borderAndBoxShadowStyle } from '../styles/SendBox.styles';
|
|
10
|
-
import { isDarkThemed } from '../../theming/themeUtils';
|
|
11
10
|
/* @conditional-compile-remove(file-sharing) */
|
|
12
11
|
import { _FileUploadCards } from '../FileUploadCards';
|
|
13
12
|
const MAXIMUM_LENGTH_OF_MESSAGE = 8000;
|
|
@@ -56,7 +55,6 @@ export const ChatMessageComponentAsEditBox = (props) => {
|
|
|
56
55
|
}, [message.attachedFilesMetadata]);
|
|
57
56
|
return (React.createElement(Stack, { className: mergeStyles(borderAndBoxShadowStyle({
|
|
58
57
|
theme,
|
|
59
|
-
errorColor: isDarkThemed(theme) ? '#f1707b' : '#a80000',
|
|
60
58
|
hasErrorMessage: false,
|
|
61
59
|
disabled: false
|
|
62
60
|
})) },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatMessageComponentAsEditBox.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,EAAE,IAAI,EAAc,WAAW,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxF,OAAO,EAAE,aAAa,EAAE,sCAAgC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAC7D,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3G,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzE,OAAO,EAAE,uBAAuB,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"ChatMessageComponentAsEditBox.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,EAAE,IAAI,EAAc,WAAW,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxF,OAAO,EAAE,aAAa,EAAE,sCAAgC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAC7D,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAC3G,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzE,OAAO,EAAE,uBAAuB,EAAE,MAAM,0BAA0B,CAAC;AAEnE,+CAA+C;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,MAAM,yBAAyB,GAAG,IAAI,CAAC;AAEvC,MAAM,kBAAkB,GAAG,CAAC,KAAa,EAAe,EAAE;IACxD,MAAM,SAAS,GAAG,WAAW,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IACvD,OAAO,oBAAC,IAAI,IAAC,QAAQ,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;AACnE,CAAC,CAAC;AAEF,MAAM,kBAAkB,GAAG,CAAC,KAAa,EAAe,EAAE;IACxD,MAAM,SAAS,GAAG,WAAW,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IACvD,OAAO,oBAAC,IAAI,IAAC,QAAQ,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;AACnE,CAAC,CAAC;AAiBF;;GAEG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,KAAyC,EAAe,EAAE;IACtG,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IACvD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAS,OAAO,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC;IAC1E,MAAM,gBAAgB,GAAG,KAAK,CAAC,MAAM,CAAa,IAAI,CAAC,CAAC;IACxD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,YAAY,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC;IAChD,MAAM,aAAa,GAAG,YAAY,KAAK,IAAI,CAAC;IAE5C,SAAS,CAAC,GAAG,EAAE;;QACb,MAAA,gBAAgB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IACpC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,OAAO,GAAG,CACd,KAA8D,EAC9D,QAA6B,EACvB,EAAE;QACR,YAAY,CAAC,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,EAAE,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,MAAM,kBAAkB,GACtB,YAAY,KAAK,UAAU;QACzB,CAAC,CAAC,aAAa,CAAC,OAAO,CAAC,gBAAgB,EAAE,EAAE,WAAW,EAAE,GAAG,yBAAyB,EAAE,EAAE,CAAC;QAC1F,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,wBAAwB,GAAG,WAAW,CAC1C,GAAG,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,EACxD,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,CACjC,CAAC;IAEF,MAAM,wBAAwB,GAAG,WAAW,CAC1C,GAAG,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,EACxD,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,CACjC,CAAC;IAEF,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,eAAe,CAAC,eAAe,EAAE,EAAE,SAAS,EAAE,EAAE,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;IACtG,CAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC;IAEjC,+CAA+C;IAC/C,MAAM,mBAAmB,GAAG,WAAW,CAAC,GAAG,EAAE;;QAC3C,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE;YAC/B,oBAAC,gBAAgB,IACf,iBAAiB,EAAE,MAAA,OAAO,CAAC,qBAAqB,0CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;oBAC/D,EAAE,EAAE,IAAI,CAAC,IAAI;oBACb,QAAQ,EAAE,IAAI,CAAC,IAAI;oBACnB,QAAQ,EAAE,CAAC;iBACZ,CAAC,CAAC,GACH,CACE,CACP,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,CAAC,qBAAqB,CAAC,CAAC,CAAC;IAEpC,OAAO,CACL,oBAAC,KAAK,IACJ,SAAS,EAAE,WAAW,CACpB,uBAAuB,CAAC;YACtB,KAAK;YACL,eAAe,EAAE,KAAK;YACtB,QAAQ,EAAE,KAAK;SAChB,CAAC,CACH;QAED,oBAAC,iBAAiB,IAChB,cAAc,EAAE,KAAK,CAAC,iBAAiB,EACvC,EAAE,EAAE,SAAS,EACb,YAAY,EAAE,gBAAgB,EAC9B,cAAc,EAAE,YAAY,CAAC,KAAK,CAAC,iBAAiB,CAAC,EACrD,eAAe,EAAE,OAAO,CAAC,sBAAsB,EAC/C,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,OAAO,EACjB,cAAc,EAAE,GAAG,EAAE;gBACnB,aAAa,IAAI,QAAQ,CAAC,SAAS,CAAC,CAAC;YACvC,CAAC,EACD,cAAc,EAAE,KAAK,EACrB,SAAS,EAAE,yBAAyB,EACpC,YAAY,EAAE,kBAAkB,EAChC,MAAM,EAAE,aAAa;YAErB,oBAAC,cAAc,IACb,SAAS,EAAE,kBAAkB,EAC7B,SAAS,EAAE,OAAO,CAAC,mBAAmB,EACtC,cAAc,EAAE,OAAO,CAAC,mBAAmB,EAC3C,YAAY,EAAE,wBAAwB,EACtC,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,IAAI,QAAQ,EAAE,CAAC;gBACzB,CAAC,EACD,EAAE,EAAE,oBAAoB,GACxB;YACF,oBAAC,cAAc,IACb,SAAS,EAAE,kBAAkB,EAC7B,SAAS,EAAE,OAAO,CAAC,mBAAmB,EACtC,cAAc,EAAE,OAAO,CAAC,mBAAmB,EAC3C,YAAY,EAAE,wBAAwB,EACtC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,aAAa,IAAI,QAAQ,CAAC,SAAS,CAAC,CAAC;oBACrC,CAAC,CAAC,eAAe,EAAE,CAAC;gBACtB,CAAC,EACD,EAAE,EAAE,mBAAmB,GACvB,CACgB;QAElB,+CAA+C;QAC/C,mBAAmB,EAAE,CAEjB,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,WAAmB,EAAW,EAAE,CAAC,WAAW,CAAC,MAAM,GAAG,yBAAyB,CAAC;AAC1G,MAAM,cAAc,GAAG,CAAC,WAAmB,EAAW,EAAE,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,CAAC;AACzF,MAAM,eAAe,GAAG,CAAC,WAAmB,EAAgB,EAAE,CAC5D,cAAc,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { IButtonStyles, IStyle, ITextFieldStyles } from '@fluentui/react';
|
|
3
|
+
/**
|
|
4
|
+
* Strings of {@link _Dialpad} that can be overridden.
|
|
5
|
+
*
|
|
6
|
+
* @internal
|
|
7
|
+
*/
|
|
8
|
+
export interface _DialpadStrings {
|
|
9
|
+
errorText: string;
|
|
10
|
+
defaultText: string;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Styles for {@link _Dialpad} component.
|
|
14
|
+
*
|
|
15
|
+
* @internal
|
|
16
|
+
*/
|
|
17
|
+
export interface _DialpadStyles {
|
|
18
|
+
root?: IStyle;
|
|
19
|
+
button?: IButtonStyles;
|
|
20
|
+
textField?: Partial<ITextFieldStyles>;
|
|
21
|
+
primaryContent?: IStyle;
|
|
22
|
+
secondaryContent?: IStyle;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Type for {@link _DialpadButton} input
|
|
26
|
+
*
|
|
27
|
+
* @internal
|
|
28
|
+
*/
|
|
29
|
+
export interface _DialpadButtonProps {
|
|
30
|
+
primaryContent: string;
|
|
31
|
+
secondaryContent?: string;
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Props for {@link _Dialpad} component.
|
|
35
|
+
*
|
|
36
|
+
* @internal
|
|
37
|
+
*/
|
|
38
|
+
export interface _DialpadProps {
|
|
39
|
+
strings: _DialpadStrings;
|
|
40
|
+
dialpadButtons?: _DialpadButtonProps[][];
|
|
41
|
+
styles?: _DialpadStyles;
|
|
42
|
+
}
|
|
43
|
+
/**
|
|
44
|
+
* A component to allow users to enter phone number through clicking on dialpad/using keyboard
|
|
45
|
+
*
|
|
46
|
+
*
|
|
47
|
+
* @internal
|
|
48
|
+
*/
|
|
49
|
+
export declare const _Dialpad: (props: _DialpadProps) => JSX.Element;
|
|
50
|
+
//# sourceMappingURL=Dialpad.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dialpad.d.ts","sourceRoot":"","sources":["../../../../../../../react-components/src/components/Dialpad/Dialpad.tsx"],"names":[],"mappings":";AAGA,OAAO,EAIL,aAAa,EACb,MAAM,EACN,gBAAgB,EAMjB,MAAM,iBAAiB,CAAC;AAYzB;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;;;GAIG;AACH,MAAM,WAAW,aAAa;IAE5B,OAAO,EAAE,eAAe,CAAC;IACzB,cAAc,CAAC,EAAE,mBAAmB,EAAE,EAAE,CAAC;IACzC,MAAM,CAAC,EAAE,cAAc,CAAC;CACzB;AAED;;;;;GAKG;AACH,eAAO,MAAM,QAAQ,UAAW,aAAa,KAAG,WAE/C,CAAC"}
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
// Copyright (c) Microsoft Corporation.
|
|
2
|
+
// Licensed under the MIT license.
|
|
3
|
+
import { concatStyleSets, DefaultButton, FocusZone, mergeStyles, Stack, Text, TextField, useTheme } from '@fluentui/react';
|
|
4
|
+
import { _formatString } from "../../../../acs-ui-common/src";
|
|
5
|
+
import React, { useState } from 'react';
|
|
6
|
+
import { buttonStyles, containerStyles, primaryContentStyles, secondaryContentStyles, textFieldStyles } from '../styles/Dialpad.styles';
|
|
7
|
+
import { formatPhoneNumber } from '../utils/formatPhoneNumber';
|
|
8
|
+
/**
|
|
9
|
+
* A component to allow users to enter phone number through clicking on dialpad/using keyboard
|
|
10
|
+
*
|
|
11
|
+
*
|
|
12
|
+
* @internal
|
|
13
|
+
*/
|
|
14
|
+
export const _Dialpad = (props) => {
|
|
15
|
+
return React.createElement(DialpadContainer, Object.assign({ errorText: props.strings.errorText, defaultText: props.strings.defaultText }, props));
|
|
16
|
+
};
|
|
17
|
+
const DialpadButton = (props) => {
|
|
18
|
+
var _a, _b, _c, _d;
|
|
19
|
+
const theme = useTheme();
|
|
20
|
+
return (React.createElement(DefaultButton, { onClick: () => {
|
|
21
|
+
props.onClick(props.primaryContent);
|
|
22
|
+
}, styles: concatStyleSets(buttonStyles(theme), (_a = props.styles) === null || _a === void 0 ? void 0 : _a.button) },
|
|
23
|
+
React.createElement(Stack, null,
|
|
24
|
+
React.createElement(Text, { className: mergeStyles(primaryContentStyles(theme), (_b = props.styles) === null || _b === void 0 ? void 0 : _b.primaryContent) }, props.primaryContent),
|
|
25
|
+
React.createElement(Text, { className: mergeStyles(secondaryContentStyles(theme), (_c = props.styles) === null || _c === void 0 ? void 0 : _c.secondaryContent) }, (_d = props.secondaryContent) !== null && _d !== void 0 ? _d : ' '))));
|
|
26
|
+
};
|
|
27
|
+
const dialPadButtonsDefault = [
|
|
28
|
+
[
|
|
29
|
+
{ primaryContent: '1' },
|
|
30
|
+
{ primaryContent: '2', secondaryContent: 'ABC' },
|
|
31
|
+
{ primaryContent: '3', secondaryContent: 'DEF' }
|
|
32
|
+
],
|
|
33
|
+
[
|
|
34
|
+
{ primaryContent: '4', secondaryContent: 'GHI' },
|
|
35
|
+
{ primaryContent: '5', secondaryContent: 'JKL' },
|
|
36
|
+
{ primaryContent: '6', secondaryContent: 'MNO' }
|
|
37
|
+
],
|
|
38
|
+
[
|
|
39
|
+
{ primaryContent: '7', secondaryContent: 'PQRS' },
|
|
40
|
+
{ primaryContent: '8', secondaryContent: 'TUV' },
|
|
41
|
+
{ primaryContent: '9', secondaryContent: 'WXYZ' }
|
|
42
|
+
],
|
|
43
|
+
[{ primaryContent: '*' }, { primaryContent: '0', secondaryContent: '+' }, { primaryContent: '#' }]
|
|
44
|
+
];
|
|
45
|
+
const DialpadContainer = (props) => {
|
|
46
|
+
var _a, _b, _c;
|
|
47
|
+
const theme = useTheme();
|
|
48
|
+
const [textValue, setTextValue] = useState('');
|
|
49
|
+
const [error, setError] = useState('');
|
|
50
|
+
const onClickDialpad = (input) => {
|
|
51
|
+
setError('');
|
|
52
|
+
setTextValue(textValue + input);
|
|
53
|
+
};
|
|
54
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
55
|
+
const setText = (e) => {
|
|
56
|
+
// if text content includes non-valid dialpad input return an error
|
|
57
|
+
if (!`${e.target.value}`.match(/^[0-9\s*#+()-]*$/)) {
|
|
58
|
+
setError(_formatString(props.errorText, { invalidCharacter: `${e.target.value.slice(e.target.value.length - 1)}` }));
|
|
59
|
+
}
|
|
60
|
+
else {
|
|
61
|
+
setError('');
|
|
62
|
+
setTextValue(e.target.value);
|
|
63
|
+
}
|
|
64
|
+
};
|
|
65
|
+
const dialpadButtonsContent = (_a = props.dialpadButtons) !== null && _a !== void 0 ? _a : dialPadButtonsDefault;
|
|
66
|
+
return (React.createElement("div", { className: mergeStyles(containerStyles(theme), (_b = props.styles) === null || _b === void 0 ? void 0 : _b.root) },
|
|
67
|
+
React.createElement(TextField, { styles: concatStyleSets(textFieldStyles(theme), (_c = props.styles) === null || _c === void 0 ? void 0 : _c.textField), value: formatPhoneNumber(textValue), onChange: setText, errorMessage: error, placeholder: props.defaultText }),
|
|
68
|
+
React.createElement(FocusZone, null, dialpadButtonsContent.map((rows, i) => {
|
|
69
|
+
return (React.createElement(Stack, { horizontal: true, key: `row_${i}`, horizontalAlign: "stretch" }, rows.map((button, i) => (React.createElement(DialpadButton, { key: `button_${i}`, primaryContent: button.primaryContent, secondaryContent: button.secondaryContent, styles: props.styles, onClick: onClickDialpad })))));
|
|
70
|
+
}))));
|
|
71
|
+
};
|
|
72
|
+
//# sourceMappingURL=Dialpad.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Dialpad.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/Dialpad/Dialpad.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EACL,eAAe,EACf,aAAa,EACb,SAAS,EAIT,WAAW,EACX,KAAK,EACL,IAAI,EACJ,SAAS,EACT,QAAQ,EACT,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,aAAa,EAAE,sCAAgC;AACxD,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EACL,YAAY,EACZ,eAAe,EACf,oBAAoB,EACpB,sBAAsB,EACtB,eAAe,EAChB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AA+C/D;;;;;GAKG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAe,EAAE;IAC5D,OAAO,oBAAC,gBAAgB,kBAAC,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,WAAW,IAAM,KAAK,EAAI,CAAC;AACrH,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,KAKtB,EAAe,EAAE;;IAChB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,OAAO,CACL,oBAAC,aAAa,IACZ,OAAO,EAAE,GAAG,EAAE;YACZ,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;QACtC,CAAC,EACD,MAAM,EAAE,eAAe,CAAC,YAAY,CAAC,KAAK,CAAC,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,MAAM,CAAC;QAElE,oBAAC,KAAK;YACJ,oBAAC,IAAI,IAAC,SAAS,EAAE,WAAW,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,cAAc,CAAC,IACpF,KAAK,CAAC,cAAc,CAChB;YAEP,oBAAC,IAAI,IAAC,SAAS,EAAE,WAAW,CAAC,sBAAsB,CAAC,KAAK,CAAC,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,gBAAgB,CAAC,IACxF,MAAA,KAAK,CAAC,gBAAgB,mCAAI,GAAG,CACzB,CACD,CACM,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,qBAAqB,GAA4B;IACrD;QACE,EAAE,cAAc,EAAE,GAAG,EAAE;QACvB,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,KAAK,EAAE;QAChD,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,KAAK,EAAE;KACjD;IACD;QACE,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,KAAK,EAAE;QAChD,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,KAAK,EAAE;QAChD,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,KAAK,EAAE;KACjD;IACD;QACE,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,MAAM,EAAE;QACjD,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,KAAK,EAAE;QAChD,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,MAAM,EAAE;KAClD;IACD,CAAC,EAAE,cAAc,EAAE,GAAG,EAAE,EAAE,EAAE,cAAc,EAAE,GAAG,EAAE,gBAAgB,EAAE,GAAG,EAAE,EAAE,EAAE,cAAc,EAAE,GAAG,EAAE,CAAC;CACnG,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,KAKzB,EAAe,EAAE;;IAChB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC/C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACvC,MAAM,cAAc,GAAG,CAAC,KAAa,EAAQ,EAAE;QAC7C,QAAQ,CAAC,EAAE,CAAC,CAAC;QAEb,YAAY,CAAC,SAAS,GAAG,KAAK,CAAC,CAAC;IAClC,CAAC,CAAC;IAEF,8DAA8D;IAC9D,MAAM,OAAO,GAAG,CAAC,CAAM,EAAQ,EAAE;QAC/B,mEAAmE;QACnE,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC,kBAAkB,CAAC,EAAE;YAClD,QAAQ,CACN,aAAa,CAAC,KAAK,CAAC,SAAS,EAAE,EAAE,gBAAgB,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,EAAE,CAAC,CAC3G,CAAC;SACH;aAAM;YACL,QAAQ,CAAC,EAAE,CAAC,CAAC;YACb,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;SAC9B;IACH,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAG,MAAA,KAAK,CAAC,cAAc,mCAAI,qBAAqB,CAAC;IAE5E,OAAO,CACL,6BAAK,SAAS,EAAE,WAAW,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,IAAI,CAAC;QACrE,oBAAC,SAAS,IACR,MAAM,EAAE,eAAe,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,SAAS,CAAC,EACxE,KAAK,EAAE,iBAAiB,CAAC,SAAS,CAAC,EACnC,QAAQ,EAAE,OAAO,EACjB,YAAY,EAAE,KAAK,EACnB,WAAW,EAAE,KAAK,CAAC,WAAW,GAC9B;QACF,oBAAC,SAAS,QACP,qBAAqB,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;YACrC,OAAO,CACL,oBAAC,KAAK,IAAC,UAAU,QAAC,GAAG,EAAE,OAAO,CAAC,EAAE,EAAE,eAAe,EAAC,SAAS,IACzD,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CACvB,oBAAC,aAAa,IACZ,GAAG,EAAE,UAAU,CAAC,EAAE,EAClB,cAAc,EAAE,MAAM,CAAC,cAAc,EACrC,gBAAgB,EAAE,MAAM,CAAC,gBAAgB,EACzC,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,OAAO,EAAE,cAAc,GACvB,CACH,CAAC,CACI,CACT,CAAC;QACJ,CAAC,CAAC,CACQ,CACR,CACP,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputBoxComponent.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/InputBoxComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,EAAY,SAAS,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAC3E,OAAO,EAIL,MAAM,EACN,UAAU,EAKX,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAgB5C;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,gBAAgB;IAC3D,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,sHAAsH;IACtH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,6DAA6D;IAC7D,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,aAAK,sBAAsB,GAAG;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,cAAc,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5G,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IACtF,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,SAAS,CAAC,EAAE,kBAAkB,CAAC;CAChC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,UAAW,sBAAsB,KAAG,
|
|
1
|
+
{"version":3,"file":"InputBoxComponent.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/InputBoxComponent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,EAAY,SAAS,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAC3E,OAAO,EAIL,MAAM,EACN,UAAU,EAKX,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAgB5C;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,gBAAgB;IAC3D,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,sHAAsH;IACtH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,6DAA6D;IAC7D,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,aAAK,sBAAsB,GAAG;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,cAAc,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5G,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IACtF,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,mBAAmB,CAAC;IAC7B,SAAS,CAAC,EAAE,kBAAkB,CAAC;CAChC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,UAAW,sBAAsB,KAAG,WA6EjE,CAAC;AAEF;;;;GAIG;AACH,oBAAY,mBAAmB,GAAG;IAChC,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,GAAG,CAAC,OAAO,CAAC;IAChD,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACnE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,cAAc,UAAW,mBAAmB,KAAG,WA+B3D,CAAC"}
|
|
@@ -10,11 +10,10 @@ import { useTheme } from '../theming';
|
|
|
10
10
|
*/
|
|
11
11
|
export const InputBoxComponent = (props) => {
|
|
12
12
|
const { styles, id, 'data-ui-id': dataUiId, textValue, onChange, textFieldRef, placeholderText, onKeyDown, onEnterKeyDown, supportNewline, inputClassName, errorMessage, disabled, children } = props;
|
|
13
|
-
const theme = useTheme();
|
|
14
13
|
const mergedRootStyle = mergeStyles(inputBoxWrapperStyle, styles === null || styles === void 0 ? void 0 : styles.root);
|
|
15
14
|
const mergedTextFiledStyle = mergeStyles(inputBoxStyle, inputClassName, props.inlineChildren ? {} : inputBoxNewLineSpaceAffordance);
|
|
16
15
|
const mergedTextContainerStyle = mergeStyles(textContainerStyle, styles === null || styles === void 0 ? void 0 : styles.textFieldContainer);
|
|
17
|
-
const mergedTextFieldStyle = concatStyleSets(textFieldStyle
|
|
16
|
+
const mergedTextFieldStyle = concatStyleSets(textFieldStyle, {
|
|
18
17
|
fieldGroup: styles === null || styles === void 0 ? void 0 : styles.textField,
|
|
19
18
|
errorMessage: styles === null || styles === void 0 ? void 0 : styles.systemMessage
|
|
20
19
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputBoxComponent.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/InputBoxComponent.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAwB,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3E,OAAO,EACL,KAAK,EACL,SAAS,EACT,WAAW,EAGX,eAAe,EACf,UAAU,EACV,WAAW,EAEZ,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EACL,aAAa,EACb,oBAAoB,EACpB,gBAAgB,EAChB,cAAc,EACd,kBAAkB,EAClB,2BAA2B,EAC3B,4BAA4B,EAC5B,8BAA8B,EAC9B,uBAAuB,EACxB,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAuCtC;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAA6B,EAAe,EAAE;IAC9E,MAAM,EACJ,MAAM,EACN,EAAE,EACF,YAAY,EAAE,QAAQ,EACtB,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,eAAe,EACf,SAAS,EACT,cAAc,EACd,cAAc,EACd,cAAc,EACd,YAAY,EACZ,QAAQ,EACR,QAAQ,EACT,GAAG,KAAK,CAAC;IAEV,MAAM,
|
|
1
|
+
{"version":3,"file":"InputBoxComponent.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/InputBoxComponent.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { OnRenderAvatarCallback, VideoStreamOptions } from '../types';
|
|
3
|
+
import { LocalVideoCameraCycleButtonProps } from './LocalVideoCameraButton';
|
|
4
|
+
import { VideoTileStylesProps } from './VideoTile';
|
|
5
|
+
/**
|
|
6
|
+
* A memoized version of VideoTile for rendering local participant.
|
|
7
|
+
*
|
|
8
|
+
* @private
|
|
9
|
+
*/
|
|
10
|
+
export declare const LocalVideoTile: React.MemoExoticComponent<(props: {
|
|
11
|
+
userId: string;
|
|
12
|
+
onCreateLocalStreamView?: ((options?: VideoStreamOptions | undefined) => Promise<void>) | undefined;
|
|
13
|
+
onDisposeLocalStreamView?: (() => void) | undefined;
|
|
14
|
+
isAvailable?: boolean | undefined;
|
|
15
|
+
isMuted?: boolean | undefined;
|
|
16
|
+
renderElement?: HTMLElement | undefined;
|
|
17
|
+
displayName?: string | undefined;
|
|
18
|
+
initialsName?: string | undefined;
|
|
19
|
+
localVideoViewOptions?: VideoStreamOptions | undefined;
|
|
20
|
+
onRenderAvatar?: OnRenderAvatarCallback | undefined;
|
|
21
|
+
showLabel: boolean;
|
|
22
|
+
showMuteIndicator?: boolean | undefined;
|
|
23
|
+
showCameraSwitcherInLocalPreview?: boolean | undefined;
|
|
24
|
+
localVideoCameraCycleButtonProps?: LocalVideoCameraCycleButtonProps | undefined;
|
|
25
|
+
localVideoCameraSwitcherLabel?: string | undefined;
|
|
26
|
+
localVideoSelectedDescription?: string | undefined;
|
|
27
|
+
styles?: VideoTileStylesProps | undefined;
|
|
28
|
+
}) => JSX.Element>;
|
|
29
|
+
//# sourceMappingURL=LocalVideoTile.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LocalVideoTile.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/LocalVideoTile.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AACtE,OAAO,EAA+B,gCAAgC,EAAE,MAAM,0BAA0B,CAAC;AAEzG,OAAO,EAAa,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAE9D;;;;GAIG;AACH,eAAO,MAAM,cAAc;YAEf,MAAM;6EAC8C,QAAQ,IAAI,CAAC;sCACxC,IAAI;;;;;;;;eAQ1B,OAAO;;;;;;;kBA2FrB,CAAC"}
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
// Copyright (c) Microsoft Corporation.
|
|
2
|
+
// Licensed under the MIT license.
|
|
3
|
+
import { Stack } from '@fluentui/react';
|
|
4
|
+
import { _formatString } from "../../../acs-ui-common/src";
|
|
5
|
+
import React, { useEffect, useMemo } from 'react';
|
|
6
|
+
import { LocalVideoCameraCycleButton } from './LocalVideoCameraButton';
|
|
7
|
+
import { StreamMedia } from './StreamMedia';
|
|
8
|
+
import { VideoTile } from './VideoTile';
|
|
9
|
+
/**
|
|
10
|
+
* A memoized version of VideoTile for rendering local participant.
|
|
11
|
+
*
|
|
12
|
+
* @private
|
|
13
|
+
*/
|
|
14
|
+
export const LocalVideoTile = React.memo((props) => {
|
|
15
|
+
const { isAvailable, isMuted, onCreateLocalStreamView, onDisposeLocalStreamView, localVideoViewOptions, renderElement, userId, showLabel, displayName, initialsName, onRenderAvatar, showMuteIndicator, styles, showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps, localVideoCameraSwitcherLabel, localVideoSelectedDescription } = props;
|
|
16
|
+
useEffect(() => {
|
|
17
|
+
if (isAvailable && !renderElement) {
|
|
18
|
+
onCreateLocalStreamView === null || onCreateLocalStreamView === void 0 ? void 0 : onCreateLocalStreamView(localVideoViewOptions);
|
|
19
|
+
}
|
|
20
|
+
// Always clean up element to make tile up to date and be able to dispose correctly
|
|
21
|
+
return () => {
|
|
22
|
+
if (renderElement) {
|
|
23
|
+
onDisposeLocalStreamView === null || onDisposeLocalStreamView === void 0 ? void 0 : onDisposeLocalStreamView();
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
}, [isAvailable, onCreateLocalStreamView, onDisposeLocalStreamView, localVideoViewOptions, renderElement]);
|
|
27
|
+
// The execution order for above useEffect is onCreateRemoteStreamView =>(async time gap) RenderElement generated => element disposed => onDisposeRemoteStreamView
|
|
28
|
+
// Element disposed could happen during async time gap, which still cause leaks for unused renderElement.
|
|
29
|
+
// Need to do an entire cleanup when remoteTile gets disposed and make sure element gets correctly disposed
|
|
30
|
+
useEffect(() => {
|
|
31
|
+
return () => {
|
|
32
|
+
onDisposeLocalStreamView === null || onDisposeLocalStreamView === void 0 ? void 0 : onDisposeLocalStreamView();
|
|
33
|
+
};
|
|
34
|
+
}, [onDisposeLocalStreamView]);
|
|
35
|
+
const renderVideoStreamElement = useMemo(() => {
|
|
36
|
+
// Checking if renderElement is well defined or not as calling SDK has a number of video streams limitation which
|
|
37
|
+
// implies that, after their threshold, all streams have no child (blank video)
|
|
38
|
+
if (!renderElement || !renderElement.childElementCount) {
|
|
39
|
+
// Returning `undefined` results in the placeholder with avatar being shown
|
|
40
|
+
return undefined;
|
|
41
|
+
}
|
|
42
|
+
return (React.createElement(React.Fragment, null,
|
|
43
|
+
React.createElement(FloatingLocalCameraCycleButton, { showCameraSwitcherInLocalPreview: showCameraSwitcherInLocalPreview !== null && showCameraSwitcherInLocalPreview !== void 0 ? showCameraSwitcherInLocalPreview : false, localVideoCameraCycleButtonProps: localVideoCameraCycleButtonProps, localVideoCameraSwitcherLabel: localVideoCameraSwitcherLabel, localVideoSelectedDescription: localVideoSelectedDescription }),
|
|
44
|
+
React.createElement(StreamMedia, { videoStreamElement: renderElement })));
|
|
45
|
+
}, [
|
|
46
|
+
localVideoCameraCycleButtonProps,
|
|
47
|
+
localVideoCameraSwitcherLabel,
|
|
48
|
+
localVideoSelectedDescription,
|
|
49
|
+
renderElement,
|
|
50
|
+
showCameraSwitcherInLocalPreview
|
|
51
|
+
]);
|
|
52
|
+
return (React.createElement(VideoTile, { key: userId, userId: userId, renderElement: renderVideoStreamElement, showLabel: showLabel, displayName: displayName, initialsName: initialsName, styles: styles, onRenderPlaceholder: onRenderAvatar, isMuted: isMuted, showMuteIndicator: showMuteIndicator }));
|
|
53
|
+
});
|
|
54
|
+
const FloatingLocalCameraCycleButton = (props) => {
|
|
55
|
+
const { showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps, localVideoCameraSwitcherLabel, localVideoSelectedDescription } = props;
|
|
56
|
+
const ariaDescription = (localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.selectedCamera) &&
|
|
57
|
+
localVideoSelectedDescription &&
|
|
58
|
+
_formatString(localVideoSelectedDescription, {
|
|
59
|
+
cameraName: localVideoCameraCycleButtonProps.selectedCamera.name
|
|
60
|
+
});
|
|
61
|
+
return (React.createElement(Stack, { horizontalAlign: "end" }, showCameraSwitcherInLocalPreview &&
|
|
62
|
+
(localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.cameras) !== undefined &&
|
|
63
|
+
(localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.selectedCamera) !== undefined &&
|
|
64
|
+
(localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.onSelectCamera) !== undefined && (React.createElement(LocalVideoCameraCycleButton, { cameras: localVideoCameraCycleButtonProps.cameras, selectedCamera: localVideoCameraCycleButtonProps.selectedCamera, onSelectCamera: localVideoCameraCycleButtonProps.onSelectCamera, label: localVideoCameraSwitcherLabel, ariaDescription: ariaDescription }))));
|
|
65
|
+
};
|
|
66
|
+
//# sourceMappingURL=LocalVideoTile.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LocalVideoTile.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/LocalVideoTile.tsx"],"names":[],"mappings":"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"}
|
|
@@ -4,6 +4,8 @@ import { OnRenderAvatarCallback, VideoStreamOptions } from '../types';
|
|
|
4
4
|
* A memoized version of VideoTile for rendering remote participants. React.memo is used for a performance
|
|
5
5
|
* boost by memoizing the same rendered component to avoid rerendering a VideoTile when its position in the
|
|
6
6
|
* array changes causing a rerender in the parent component. https://reactjs.org/docs/react-api.html#reactmemo
|
|
7
|
+
*
|
|
8
|
+
* @private
|
|
7
9
|
*/
|
|
8
10
|
export declare const RemoteVideoTile: React.MemoExoticComponent<(props: {
|
|
9
11
|
userId: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RemoteVideoTile.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/RemoteVideoTile.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAItE
|
|
1
|
+
{"version":3,"file":"RemoteVideoTile.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/RemoteVideoTile.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6B,MAAM,OAAO,CAAC;AAClD,OAAO,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAItE;;;;;;GAMG;AACH,eAAO,MAAM,eAAe;YAEhB,MAAM;yCACsB,MAAM,+CAAmC,QAAQ,IAAI,CAAC;0CACrD,MAAM,KAAK,QAAQ,IAAI,CAAC;;;;;;;;;;kBAoFhE,CAAC"}
|
|
@@ -7,6 +7,8 @@ import { VideoTile } from './VideoTile';
|
|
|
7
7
|
* A memoized version of VideoTile for rendering remote participants. React.memo is used for a performance
|
|
8
8
|
* boost by memoizing the same rendered component to avoid rerendering a VideoTile when its position in the
|
|
9
9
|
* array changes causing a rerender in the parent component. https://reactjs.org/docs/react-api.html#reactmemo
|
|
10
|
+
*
|
|
11
|
+
* @private
|
|
10
12
|
*/
|
|
11
13
|
export const RemoteVideoTile = React.memo((props) => {
|
|
12
14
|
const { isAvailable, isMuted, isSpeaking, isScreenSharingOn, onCreateRemoteStreamView, onDisposeRemoteStreamView, remoteVideoViewOptions, renderElement, userId, displayName, onRenderAvatar, showMuteIndicator } = props;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RemoteVideoTile.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/RemoteVideoTile.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC
|
|
1
|
+
{"version":3,"file":"RemoteVideoTile.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/RemoteVideoTile.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CACvC,CAAC,KAaA,EAAE,EAAE;IACH,MAAM,EACJ,WAAW,EACX,OAAO,EACP,UAAU,EACV,iBAAiB,EACjB,wBAAwB,EACxB,yBAAyB,EACzB,sBAAsB,EACtB,aAAa,EACb,MAAM,EACN,WAAW,EACX,cAAc,EACd,iBAAiB,EAClB,GAAG,KAAK,CAAC;IAEV,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,WAAW,IAAI,CAAC,aAAa,EAAE;YACjC,wBAAwB,IAAI,wBAAwB,CAAC,MAAM,EAAE,sBAAsB,CAAC,CAAC;SACtF;QACD,mFAAmF;QACnF,2FAA2F;QAC3F,8DAA8D;QAC9D,OAAO,GAAG,EAAE;YACV,IAAI,aAAa,IAAI,CAAC,iBAAiB,EAAE;gBACvC,yBAAyB,IAAI,yBAAyB,CAAC,MAAM,CAAC,CAAC;aAChE;QACH,CAAC,CAAC;IACJ,CAAC,EAAE;QACD,WAAW;QACX,wBAAwB;QACxB,yBAAyB;QACzB,sBAAsB;QACtB,aAAa;QACb,MAAM;QACN,iBAAiB;KAClB,CAAC,CAAC;IAEH,kKAAkK;IAClK,yGAAyG;IACzG,2GAA2G;IAC3G,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,8EAA8E;YAC9E,IAAI,CAAC,iBAAiB,EAAE;gBACtB,yBAAyB,IAAI,yBAAyB,CAAC,MAAM,CAAC,CAAC;aAChE;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,yBAAyB,EAAE,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAE3D,MAAM,wBAAwB,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5C,iHAAiH;QACjH,+EAA+E;QAC/E,IAAI,CAAC,aAAa,IAAI,CAAC,aAAa,CAAC,iBAAiB,EAAE;YACtD,2EAA2E;YAC3E,OAAO,SAAS,CAAC;SAClB;QAED,OAAO,oBAAC,WAAW,IAAC,kBAAkB,EAAE,aAAa,GAAI,CAAC;IAC5D,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,MAAM,EACX,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,wBAAwB,EACvC,WAAW,EAAE,WAAW,EACxB,mBAAmB,EAAE,cAAc,EACnC,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,iBAAiB,EAAE,iBAAiB,GACpC,CACH,CAAC;AACJ,CAAC,CACF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SendBox.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/SendBox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAyD,MAAM,iBAAiB,CAAC;AAQhG,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"SendBox.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/SendBox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAyD,MAAM,iBAAiB,CAAC;AAQhG,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAU5C,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAKzD;;;;GAIG;AACH,MAAM,WAAW,kBAAmB,SAAQ,gBAAgB;IAC1D,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,yDAAyD;IACzD,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,kHAAkH;IAClH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sHAAsH;IACtH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;GAGG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;;;;OAMG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAE7B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;;;GAIG;AACH,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,eAAe,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,mBAAmB,EAAE,MAAM,CAAC;IAE5B;;OAEG;IACH,uBAAuB,EAAE,MAAM,CAAC;CACjC;AAED;;;;GAIG;AACH,MAAM,WAAW,YAAY;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACnD;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B;;;OAGG;IACH,qBAAqB,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,GAAG,SAAS,KAAK,KAAK,CAAC,YAAY,CAAC;IAClF;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,GAAG,CAAC,OAAO,CAAC;IACjD;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IAClC;;;OAGG;IACH,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAE/B;;;;;OAKG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IAExC;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAEvC;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,OAAO,UAAW,YAAY,KAAG,WA4L7C,CAAC"}
|
|
@@ -7,7 +7,6 @@ import { useTheme } from '../theming';
|
|
|
7
7
|
import { useLocale } from '../localization';
|
|
8
8
|
import { useIdentifiers } from '../identifiers';
|
|
9
9
|
import { InputBoxButton, InputBoxComponent } from './InputBoxComponent';
|
|
10
|
-
import { isDarkThemed } from '../theming/themeUtils';
|
|
11
10
|
/* @conditional-compile-remove(file-sharing) */
|
|
12
11
|
import { SendBoxErrors } from './SendBoxErrors';
|
|
13
12
|
/* @conditional-compile-remove(file-sharing) */
|
|
@@ -107,7 +106,6 @@ export const SendBox = (props) => {
|
|
|
107
106
|
React.createElement(SendBoxErrors, Object.assign({}, sendBoxErrorsProps)),
|
|
108
107
|
React.createElement(Stack, { className: mergeStyles(borderAndBoxShadowStyle({
|
|
109
108
|
theme,
|
|
110
|
-
errorColor: isDarkThemed(theme) ? '#f1707b' : '#a80000',
|
|
111
109
|
hasErrorMessage: !!errorMessage,
|
|
112
110
|
disabled: !!disabled
|
|
113
111
|
})) },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SendBox.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/SendBox.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAsB,WAAW,EAAE,eAAe,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAChG,OAAO,EACL,YAAY,EACZ,eAAe,EACf,aAAa,EACb,oBAAoB,EACpB,uBAAuB,EACxB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExE
|
|
1
|
+
{"version":3,"file":"SendBox.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/SendBox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VideoGallery.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/VideoGallery.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAiD,MAAM,EAAiC,MAAM,iBAAiB,CAAC;AAEvH,OAAO,EAAE,gBAAgB,EAAE,MAAM,GAAG,CAAC;AAKrC,OAAO,EACL,gBAAgB,EAChB,sBAAsB,EACtB,4BAA4B,EAC5B,6BAA6B,EAC7B,kBAAkB,EACnB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"VideoGallery.d.ts","sourceRoot":"","sources":["../../../../../../react-components/src/components/VideoGallery.tsx"],"names":[],"mappings":"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"}
|
|
@@ -9,18 +9,15 @@ import { useTheme } from '../theming';
|
|
|
9
9
|
import { GridLayout } from './GridLayout';
|
|
10
10
|
import { RemoteVideoTile } from './RemoteVideoTile';
|
|
11
11
|
import { ResponsiveHorizontalGallery } from './ResponsiveHorizontalGallery';
|
|
12
|
-
import { StreamMedia } from './StreamMedia';
|
|
13
12
|
import { HORIZONTAL_GALLERY_BUTTON_WIDTH, HORIZONTAL_GALLERY_GAP } from './styles/HorizontalGallery.styles';
|
|
14
13
|
import { LARGE_HORIZONTAL_GALLERY_TILE_SIZE_REM, SMALL_HORIZONTAL_GALLERY_TILE_SIZE_REM, floatingLocalVideoModalStyle, floatingLocalVideoTileStyle, horizontalGalleryContainerStyle, horizontalGalleryStyle, layerHostStyle, localVideoTileContainerStyle, videoGalleryContainerStyle, videoGalleryOuterDivStyle, localVideoTileOuterPaddingPX, SMALL_FLOATING_MODAL_SIZE_PX, LARGE_FLOATING_MODAL_SIZE_PX } from './styles/VideoGallery.styles';
|
|
15
14
|
import { isNarrowWidth, _useContainerHeight, _useContainerWidth } from './utils/responsive';
|
|
16
15
|
import { LocalScreenShare } from './VideoGallery/LocalScreenShare';
|
|
17
16
|
import { RemoteScreenShare } from './VideoGallery/RemoteScreenShare';
|
|
18
|
-
import { VideoTile } from './VideoTile';
|
|
19
17
|
import { useId } from '@fluentui/react-hooks';
|
|
20
|
-
import { LocalVideoCameraCycleButton } from './LocalVideoCameraButton';
|
|
21
18
|
import { localVideoTileWithControlsContainerStyle, LOCAL_VIDEO_TILE_ZINDEX } from './styles/VideoGallery.styles';
|
|
22
19
|
import { _ModalClone } from './ModalClone/ModalClone';
|
|
23
|
-
import {
|
|
20
|
+
import { LocalVideoTile } from './LocalVideoTile';
|
|
24
21
|
// Currently the Calling JS SDK supports up to 4 remote video streams
|
|
25
22
|
const DEFAULT_MAX_REMOTE_VIDEO_STREAMS = 4;
|
|
26
23
|
// Set aside only 6 dominant speakers for remaining audio participants
|
|
@@ -44,7 +41,7 @@ const modalMaxDragPosition = { x: localVideoTileOuterPaddingPX, y: localVideoTil
|
|
|
44
41
|
*/
|
|
45
42
|
export const VideoGallery = (props) => {
|
|
46
43
|
var _a, _b, _c;
|
|
47
|
-
const { localParticipant, remoteParticipants = [], localVideoViewOptions, remoteVideoViewOptions, dominantSpeakers, onRenderLocalVideoTile, onRenderRemoteVideoTile, onCreateLocalStreamView, onCreateRemoteStreamView, onDisposeRemoteStreamView, styles, layout, onRenderAvatar, showMuteIndicator, maxRemoteVideoStreams = DEFAULT_MAX_REMOTE_VIDEO_STREAMS, showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps } = props;
|
|
44
|
+
const { localParticipant, remoteParticipants = [], localVideoViewOptions, remoteVideoViewOptions, dominantSpeakers, onRenderLocalVideoTile, onRenderRemoteVideoTile, onCreateLocalStreamView, onDisposeLocalStreamView, onCreateRemoteStreamView, onDisposeRemoteStreamView, styles, layout, onRenderAvatar, showMuteIndicator, maxRemoteVideoStreams = DEFAULT_MAX_REMOTE_VIDEO_STREAMS, showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps } = props;
|
|
48
45
|
const ids = useIdentifiers();
|
|
49
46
|
const theme = useTheme();
|
|
50
47
|
const localeStrings = useLocale().strings.videoGallery;
|
|
@@ -83,56 +80,37 @@ export const VideoGallery = (props) => {
|
|
|
83
80
|
lastVisibleParticipants: visibleAudioParticipants.current,
|
|
84
81
|
maxDominantSpeakers: MAX_AUDIO_DOMINANT_SPEAKERS
|
|
85
82
|
});
|
|
86
|
-
const LocalCameraCycleButton = useCallback(() => {
|
|
87
|
-
const ariaDescription = (localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.selectedCamera) &&
|
|
88
|
-
_formatString(strings.localVideoSelectedDescription, {
|
|
89
|
-
cameraName: localVideoCameraCycleButtonProps.selectedCamera.name
|
|
90
|
-
});
|
|
91
|
-
return (React.createElement(Stack, { horizontalAlign: "end" }, showCameraSwitcherInLocalPreview &&
|
|
92
|
-
(localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.cameras) !== undefined &&
|
|
93
|
-
(localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.selectedCamera) !== undefined &&
|
|
94
|
-
(localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.onSelectCamera) !== undefined && (React.createElement(LocalVideoCameraCycleButton, { cameras: localVideoCameraCycleButtonProps.cameras, selectedCamera: localVideoCameraCycleButtonProps.selectedCamera, onSelectCamera: localVideoCameraCycleButtonProps.onSelectCamera, label: strings.localVideoCameraSwitcherLabel, ariaDescription: ariaDescription }))));
|
|
95
|
-
}, [
|
|
96
|
-
localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.cameras,
|
|
97
|
-
localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.onSelectCamera,
|
|
98
|
-
localVideoCameraCycleButtonProps === null || localVideoCameraCycleButtonProps === void 0 ? void 0 : localVideoCameraCycleButtonProps.selectedCamera,
|
|
99
|
-
showCameraSwitcherInLocalPreview,
|
|
100
|
-
strings.localVideoCameraSwitcherLabel,
|
|
101
|
-
strings.localVideoSelectedDescription
|
|
102
|
-
]);
|
|
103
83
|
/**
|
|
104
84
|
* Utility function for memoized rendering of LocalParticipant.
|
|
105
85
|
*/
|
|
106
86
|
const localVideoTile = useMemo(() => {
|
|
107
|
-
|
|
87
|
+
var _a, _b;
|
|
108
88
|
if (onRenderLocalVideoTile) {
|
|
109
89
|
return onRenderLocalVideoTile(localParticipant);
|
|
110
90
|
}
|
|
111
|
-
const localVideoTileStyles = shouldFloatLocalVideo ? floatingLocalVideoTileStyle : {}
|
|
112
|
-
const localVideoTileStylesThemed = concatStyleSets(localVideoTileStyles, {
|
|
91
|
+
const localVideoTileStyles = concatStyleSets(shouldFloatLocalVideo ? floatingLocalVideoTileStyle : {}, {
|
|
113
92
|
root: { borderRadius: theme.effects.roundedCorner4 }
|
|
114
93
|
}, styles === null || styles === void 0 ? void 0 : styles.localVideo);
|
|
115
|
-
if (localVideoStream && !localVideoStream.renderElement) {
|
|
116
|
-
onCreateLocalStreamView && onCreateLocalStreamView(localVideoViewOptions);
|
|
117
|
-
}
|
|
118
94
|
return (React.createElement(Stack, { tabIndex: 0, "aria-label": strings.localVideoMovementLabel, role: 'dialog' },
|
|
119
|
-
React.createElement(
|
|
120
|
-
React.createElement(LocalCameraCycleButton, null),
|
|
121
|
-
React.createElement(StreamMedia, { videoStreamElement: localVideoStream.renderElement }))) : undefined, showLabel: !(shouldFloatLocalVideo && isNarrow), displayName: isNarrow ? '' : strings.localVideoLabel, initialsName: localParticipant.displayName, styles: localVideoTileStylesThemed, onRenderPlaceholder: onRenderAvatar, isMuted: localParticipant.isMuted, showMuteIndicator: showMuteIndicator })));
|
|
95
|
+
React.createElement(LocalVideoTile, { userId: localParticipant.userId, onCreateLocalStreamView: onCreateLocalStreamView, onDisposeLocalStreamView: onDisposeLocalStreamView, isAvailable: (_a = localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.videoStream) === null || _a === void 0 ? void 0 : _a.isAvailable, isMuted: localParticipant.isMuted, renderElement: (_b = localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.videoStream) === null || _b === void 0 ? void 0 : _b.renderElement, displayName: isNarrow ? '' : strings.localVideoLabel, initialsName: localParticipant.displayName, localVideoViewOptions: localVideoViewOptions, onRenderAvatar: onRenderAvatar, showLabel: !(shouldFloatLocalVideo && isNarrow), showMuteIndicator: showMuteIndicator, showCameraSwitcherInLocalPreview: showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps: localVideoCameraCycleButtonProps, localVideoCameraSwitcherLabel: strings.localVideoCameraSwitcherLabel, localVideoSelectedDescription: strings.localVideoSelectedDescription, styles: localVideoTileStyles })));
|
|
122
96
|
}, [
|
|
123
|
-
localParticipant,
|
|
124
97
|
isNarrow,
|
|
98
|
+
localParticipant,
|
|
99
|
+
localVideoCameraCycleButtonProps,
|
|
100
|
+
localVideoViewOptions,
|
|
125
101
|
onCreateLocalStreamView,
|
|
102
|
+
onDisposeLocalStreamView,
|
|
103
|
+
onRenderAvatar,
|
|
126
104
|
onRenderLocalVideoTile,
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
strings.localVideoMovementLabel,
|
|
130
|
-
strings.localVideoLabel,
|
|
131
|
-
LocalCameraCycleButton,
|
|
105
|
+
shouldFloatLocalVideo,
|
|
106
|
+
showCameraSwitcherInLocalPreview,
|
|
132
107
|
showMuteIndicator,
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
108
|
+
strings.localVideoCameraSwitcherLabel,
|
|
109
|
+
strings.localVideoLabel,
|
|
110
|
+
strings.localVideoMovementLabel,
|
|
111
|
+
strings.localVideoSelectedDescription,
|
|
112
|
+
styles === null || styles === void 0 ? void 0 : styles.localVideo,
|
|
113
|
+
theme.effects.roundedCorner4
|
|
136
114
|
]);
|
|
137
115
|
const defaultOnRenderVideoTile = useCallback((participant, isVideoParticipant) => {
|
|
138
116
|
const remoteVideoStream = participant.videoStream;
|