@zohoim/chat-components 1.1.6-beta.1 → 1.1.6-beta.2
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/es/Theme/TooltipWrapper.js +20 -20
- package/es/constants/index.js +3 -4
- package/es/im/IMAttachmentHandler/IMAttachmentHandler.js +2 -2
- package/es/im/IMAttachmentHandler/props/propTypes.js +1 -1
- package/es/im/IMMessage/props/propTypes.js +1 -1
- package/lib/Theme/TooltipWrapper.js +28 -23
- package/lib/constants/index.js +4 -4
- package/lib/im/IMAttachmentHandler/IMAttachmentHandler.js +2 -2
- package/lib/im/IMAttachmentHandler/props/propTypes.js +1 -1
- package/lib/im/IMMessage/props/propTypes.js +1 -1
- package/package.json +4 -4
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
2
|
|
|
3
3
|
/** ** Libraries *** */
|
|
4
|
-
import React from 'react';
|
|
4
|
+
import React, { useCallback, useEffect, useRef } from 'react';
|
|
5
5
|
import PropTypes from 'prop-types';
|
|
6
6
|
/** ** Components *** */
|
|
7
7
|
|
|
@@ -23,36 +23,32 @@ export default function TooltipWrapper(props) {
|
|
|
23
23
|
getContainerRef,
|
|
24
24
|
customStyle = dummyObject
|
|
25
25
|
} = props;
|
|
26
|
-
|
|
27
|
-
const tooltipRef =
|
|
26
|
+
const timerRef = useRef(null);
|
|
27
|
+
const tooltipRef = useRef(null);
|
|
28
28
|
setLibraryConfig({
|
|
29
29
|
getTooltipContainer: () => getContainerRef()
|
|
30
30
|
});
|
|
31
|
-
|
|
32
|
-
function handleMouseOverDispatch(e) {
|
|
31
|
+
const handleMouseOverDispatch = useCallback(e => {
|
|
33
32
|
const containerRef = getContainerRef();
|
|
34
33
|
|
|
35
34
|
if (tooltipRef && tooltipRef.current) {
|
|
36
35
|
tooltipRef.current.handleOver(e, containerRef);
|
|
37
36
|
}
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
timer = clearTimeout(timer);
|
|
37
|
+
}, [getContainerRef]);
|
|
38
|
+
const handleOver = useCallback(e => {
|
|
39
|
+
if (timerRef.current) {
|
|
40
|
+
timerRef.current = clearTimeout(timerRef.current);
|
|
43
41
|
}
|
|
44
42
|
|
|
45
|
-
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
timer = clearTimeout(timer);
|
|
43
|
+
timerRef.current = setTimeout(() => handleMouseOverDispatch(e), getLibraryConfig('tooltipDebounce'));
|
|
44
|
+
}, [handleMouseOverDispatch]);
|
|
45
|
+
const removeTimeout = useCallback(() => {
|
|
46
|
+
if (timerRef.current) {
|
|
47
|
+
timerRef.current = clearTimeout(timerRef.current);
|
|
51
48
|
}
|
|
52
|
-
} // componentDidMount and componentWillUnmount case
|
|
49
|
+
}, []); // componentDidMount and componentWillUnmount case
|
|
53
50
|
|
|
54
|
-
|
|
55
|
-
React.useEffect(() => {
|
|
51
|
+
useEffect(() => {
|
|
56
52
|
const containerRef = getContainerRef();
|
|
57
53
|
|
|
58
54
|
if (containerRef) {
|
|
@@ -62,11 +58,15 @@ export default function TooltipWrapper(props) {
|
|
|
62
58
|
}
|
|
63
59
|
|
|
64
60
|
return () => {
|
|
61
|
+
setLibraryConfig({
|
|
62
|
+
getTooltipContainer: () => null
|
|
63
|
+
});
|
|
64
|
+
|
|
65
65
|
if (containerRef) {
|
|
66
66
|
containerRef.removeEventListener('mouseover', handleOver, false);
|
|
67
67
|
containerRef.removeEventListener('mouseout', removeTimeout, false); // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
68
68
|
|
|
69
|
-
tooltipRef.current.unObserveElement();
|
|
69
|
+
tooltipRef.current && tooltipRef.current.unObserveElement();
|
|
70
70
|
}
|
|
71
71
|
}; // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
72
72
|
}, []);
|
package/es/constants/index.js
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
export const MSG_ACTION_POPUP_PORTAL = 'MSG_ACTION_POPUP_PORTAL';
|
|
2
2
|
export const EDITOR_POPUP_PORTAL = 'EDITOR_POPUP_PORTAL';
|
|
3
3
|
export const EDITOR_POPUP_TARGET_PORTAL = 'EDITOR_POPUP_TARGET_PORTAL';
|
|
4
|
-
const version = '1.4.
|
|
4
|
+
const version = '1.4.13';
|
|
5
5
|
export const defaultEditorURL = // `https://static.localzohocdn.com/rtelibrary/${version}/js/rte.js`;
|
|
6
|
-
// `https://static.
|
|
7
|
-
// `https://static.
|
|
8
|
-
`https://static.zohocdn.com/rtelibrary/${version}/js/rte.min.js`;
|
|
6
|
+
`https://static.zohocdn.com/rtelibrary/${version}/js/rte.js`; // `https://static.localzohocdn.com/rtelibrary/${version}/js/rte.min.js`;
|
|
7
|
+
// `https://static.zohocdn.com/rtelibrary/${version}/js/rte.min.js`;
|
|
@@ -23,7 +23,7 @@ export default function IMAttachmentHandler(props) {
|
|
|
23
23
|
isMultiAttachment,
|
|
24
24
|
onAttach: propOnAttach,
|
|
25
25
|
attachmentType,
|
|
26
|
-
|
|
26
|
+
integrationService
|
|
27
27
|
} = props;
|
|
28
28
|
const {
|
|
29
29
|
attachmentHandlerProps = dummyObject
|
|
@@ -34,7 +34,7 @@ export default function IMAttachmentHandler(props) {
|
|
|
34
34
|
} = useIMAttachmentHandler({
|
|
35
35
|
onAttach: propOnAttach,
|
|
36
36
|
attachmentType,
|
|
37
|
-
|
|
37
|
+
integrationService
|
|
38
38
|
});
|
|
39
39
|
return /*#__PURE__*/React.createElement(AttachmentHandler, _extends({
|
|
40
40
|
iconName: iconName,
|
|
@@ -23,6 +23,6 @@ const imAttachmentHandlerPropTypes = {
|
|
|
23
23
|
onAttach: PropTypes.func,
|
|
24
24
|
customProps: PropTypes.object,
|
|
25
25
|
attachmentType: PropTypes.oneOf(['image', 'document', 'documentAndImage']),
|
|
26
|
-
|
|
26
|
+
integrationService: PropTypes.oneOf([WHATSAPP, TELEGRAM, INSTAGRAM, WECHAT, TWILLIO, LINE, IM_TALK, FACEBOOKMESSENGER])
|
|
27
27
|
};
|
|
28
28
|
export default imAttachmentHandlerPropTypes;
|
|
@@ -52,7 +52,7 @@ const imMessagePropTypes = {
|
|
|
52
52
|
type: PropTypes.string
|
|
53
53
|
}).isRequired,
|
|
54
54
|
sessionDetails: PropTypes.shape({
|
|
55
|
-
|
|
55
|
+
integrationService: PropTypes.string
|
|
56
56
|
}),
|
|
57
57
|
defaultAvatarUrls: PropTypes.shape({
|
|
58
58
|
autoMessageAvatar: PropTypes.string,
|
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
+
|
|
3
5
|
Object.defineProperty(exports, "__esModule", {
|
|
4
6
|
value: true
|
|
5
7
|
});
|
|
6
8
|
exports["default"] = TooltipWrapper;
|
|
7
9
|
|
|
8
|
-
var _react =
|
|
10
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
11
|
|
|
10
12
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
13
|
|
|
@@ -21,48 +23,46 @@ var _TooltipWrapperModule = _interopRequireDefault(require("./css/TooltipWrapper
|
|
|
21
23
|
|
|
22
24
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
23
25
|
|
|
26
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
27
|
+
|
|
28
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
29
|
+
|
|
24
30
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
25
31
|
|
|
26
32
|
function TooltipWrapper(props) {
|
|
27
33
|
var getContainerRef = props.getContainerRef,
|
|
28
34
|
_props$customStyle = props.customStyle,
|
|
29
35
|
customStyle = _props$customStyle === void 0 ? _emptyConstants.dummyObject : _props$customStyle;
|
|
30
|
-
var
|
|
31
|
-
|
|
32
|
-
var tooltipRef = _react["default"].useRef(null);
|
|
33
|
-
|
|
36
|
+
var timerRef = (0, _react.useRef)(null);
|
|
37
|
+
var tooltipRef = (0, _react.useRef)(null);
|
|
34
38
|
(0, _Config.setLibraryConfig)({
|
|
35
39
|
getTooltipContainer: function getTooltipContainer() {
|
|
36
40
|
return getContainerRef();
|
|
37
41
|
}
|
|
38
42
|
});
|
|
39
|
-
|
|
40
|
-
function handleMouseOverDispatch(e) {
|
|
43
|
+
var handleMouseOverDispatch = (0, _react.useCallback)(function (e) {
|
|
41
44
|
var containerRef = getContainerRef();
|
|
42
45
|
|
|
43
46
|
if (tooltipRef && tooltipRef.current) {
|
|
44
47
|
tooltipRef.current.handleOver(e, containerRef);
|
|
45
48
|
}
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
timer = clearTimeout(timer);
|
|
49
|
+
}, [getContainerRef]);
|
|
50
|
+
var handleOver = (0, _react.useCallback)(function (e) {
|
|
51
|
+
if (timerRef.current) {
|
|
52
|
+
timerRef.current = clearTimeout(timerRef.current);
|
|
51
53
|
}
|
|
52
54
|
|
|
53
|
-
|
|
55
|
+
timerRef.current = setTimeout(function () {
|
|
54
56
|
return handleMouseOverDispatch(e);
|
|
55
57
|
}, (0, _Config.getLibraryConfig)('tooltipDebounce'));
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
timer = clearTimeout(timer);
|
|
58
|
+
}, [handleMouseOverDispatch]);
|
|
59
|
+
var removeTimeout = (0, _react.useCallback)(function () {
|
|
60
|
+
if (timerRef.current) {
|
|
61
|
+
timerRef.current = clearTimeout(timerRef.current);
|
|
61
62
|
}
|
|
62
|
-
} // componentDidMount and componentWillUnmount case
|
|
63
|
-
|
|
63
|
+
}, []); // componentDidMount and componentWillUnmount case
|
|
64
64
|
|
|
65
|
-
_react
|
|
65
|
+
(0, _react.useEffect)(function () {
|
|
66
66
|
var containerRef = getContainerRef();
|
|
67
67
|
|
|
68
68
|
if (containerRef) {
|
|
@@ -72,17 +72,22 @@ function TooltipWrapper(props) {
|
|
|
72
72
|
}
|
|
73
73
|
|
|
74
74
|
return function () {
|
|
75
|
+
(0, _Config.setLibraryConfig)({
|
|
76
|
+
getTooltipContainer: function getTooltipContainer() {
|
|
77
|
+
return null;
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
|
|
75
81
|
if (containerRef) {
|
|
76
82
|
containerRef.removeEventListener('mouseover', handleOver, false);
|
|
77
83
|
containerRef.removeEventListener('mouseout', removeTimeout, false); // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
78
84
|
|
|
79
|
-
tooltipRef.current.unObserveElement();
|
|
85
|
+
tooltipRef.current && tooltipRef.current.unObserveElement();
|
|
80
86
|
}
|
|
81
87
|
}; // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
82
88
|
}, []);
|
|
83
89
|
/* External CSS Customization */
|
|
84
90
|
|
|
85
|
-
|
|
86
91
|
var newStyle = (0, _useMergeStyle["default"])(_TooltipWrapperModule["default"], customStyle);
|
|
87
92
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
88
93
|
className: newStyle.tooltipWrapper
|
package/lib/constants/index.js
CHANGED
|
@@ -10,9 +10,9 @@ var EDITOR_POPUP_PORTAL = 'EDITOR_POPUP_PORTAL';
|
|
|
10
10
|
exports.EDITOR_POPUP_PORTAL = EDITOR_POPUP_PORTAL;
|
|
11
11
|
var EDITOR_POPUP_TARGET_PORTAL = 'EDITOR_POPUP_TARGET_PORTAL';
|
|
12
12
|
exports.EDITOR_POPUP_TARGET_PORTAL = EDITOR_POPUP_TARGET_PORTAL;
|
|
13
|
-
var version = '1.4.
|
|
13
|
+
var version = '1.4.13';
|
|
14
14
|
var defaultEditorURL = // `https://static.localzohocdn.com/rtelibrary/${version}/js/rte.js`;
|
|
15
|
-
// `https://static.
|
|
16
|
-
// `https://static.
|
|
17
|
-
|
|
15
|
+
"https://static.zohocdn.com/rtelibrary/".concat(version, "/js/rte.js"); // `https://static.localzohocdn.com/rtelibrary/${version}/js/rte.min.js`;
|
|
16
|
+
// `https://static.zohocdn.com/rtelibrary/${version}/js/rte.min.js`;
|
|
17
|
+
|
|
18
18
|
exports.defaultEditorURL = defaultEditorURL;
|
|
@@ -31,14 +31,14 @@ function IMAttachmentHandler(props) {
|
|
|
31
31
|
isMultiAttachment = props.isMultiAttachment,
|
|
32
32
|
propOnAttach = props.onAttach,
|
|
33
33
|
attachmentType = props.attachmentType,
|
|
34
|
-
|
|
34
|
+
integrationService = props.integrationService;
|
|
35
35
|
var _customProps$attachme = customProps.attachmentHandlerProps,
|
|
36
36
|
attachmentHandlerProps = _customProps$attachme === void 0 ? _emptyConstants.dummyObject : _customProps$attachme;
|
|
37
37
|
|
|
38
38
|
var _useIMAttachmentHandl = (0, _useIMAttachmentHandler["default"])({
|
|
39
39
|
onAttach: propOnAttach,
|
|
40
40
|
attachmentType: attachmentType,
|
|
41
|
-
|
|
41
|
+
integrationService: integrationService
|
|
42
42
|
}),
|
|
43
43
|
onAttach = _useIMAttachmentHandl.onAttach,
|
|
44
44
|
supportedTypes = _useIMAttachmentHandl.supportedTypes;
|
|
@@ -32,7 +32,7 @@ var imAttachmentHandlerPropTypes = {
|
|
|
32
32
|
onAttach: _propTypes["default"].func,
|
|
33
33
|
customProps: _propTypes["default"].object,
|
|
34
34
|
attachmentType: _propTypes["default"].oneOf(['image', 'document', 'documentAndImage']),
|
|
35
|
-
|
|
35
|
+
integrationService: _propTypes["default"].oneOf([WHATSAPP, TELEGRAM, INSTAGRAM, WECHAT, TWILLIO, LINE, IM_TALK, FACEBOOKMESSENGER])
|
|
36
36
|
};
|
|
37
37
|
var _default = imAttachmentHandlerPropTypes;
|
|
38
38
|
exports["default"] = _default;
|
|
@@ -62,7 +62,7 @@ var imMessagePropTypes = {
|
|
|
62
62
|
type: _propTypes["default"].string
|
|
63
63
|
}).isRequired,
|
|
64
64
|
sessionDetails: _propTypes["default"].shape({
|
|
65
|
-
|
|
65
|
+
integrationService: _propTypes["default"].string
|
|
66
66
|
}),
|
|
67
67
|
defaultAvatarUrls: _propTypes["default"].shape({
|
|
68
68
|
autoMessageAvatar: _propTypes["default"].string,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zohoim/chat-components",
|
|
3
|
-
"version": "1.1.6-beta.
|
|
3
|
+
"version": "1.1.6-beta.2",
|
|
4
4
|
"description": "Chat Components",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -45,8 +45,8 @@
|
|
|
45
45
|
"@zohodesk/utils": "1.3.14",
|
|
46
46
|
"@zohodesk/variables": "1.0.0",
|
|
47
47
|
"@zohodesk/virtualizer": "1.0.13",
|
|
48
|
-
"@zohoim/chat-components-hooks": "1.1.6-beta.
|
|
49
|
-
"@zohoim/chat-components-utils": "1.1.6-beta.
|
|
48
|
+
"@zohoim/chat-components-hooks": "1.1.6-beta.2",
|
|
49
|
+
"@zohoim/chat-components-utils": "1.1.6-beta.2",
|
|
50
50
|
"html-to-react": "1.7.0 ",
|
|
51
51
|
"jsdom": "23.0.0",
|
|
52
52
|
"react-sortable-hoc": "1.11.0",
|
|
@@ -70,5 +70,5 @@
|
|
|
70
70
|
"react-sortable-hoc": "1.11.0",
|
|
71
71
|
"velocity-react": "1.4.3"
|
|
72
72
|
},
|
|
73
|
-
"gitHead": "
|
|
73
|
+
"gitHead": "7f04c95dbf6b5ba4a0092135f4b02b981bc7c802"
|
|
74
74
|
}
|