@elliemae/ds-chat 2.3.0-next.9 → 2.3.0-rc.1
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/cjs/exported-related/chat-container-header/styled.js +1 -1
- package/cjs/parts/chat-container-messages-list/ChatContainerMessagesList.js +14 -11
- package/cjs/parts/chat-container-messages-list/styled.js +7 -3
- package/cjs/parts/chat-container-messages-list/useGetNewMessages.js +28 -0
- package/esm/exported-related/chat-container-header/styled.js +1 -1
- package/esm/parts/chat-container-messages-list/ChatContainerMessagesList.js +16 -13
- package/esm/parts/chat-container-messages-list/styled.js +7 -4
- package/esm/parts/chat-container-messages-list/useGetNewMessages.js +24 -0
- package/package.json +15 -11
- package/types/exported-related/bubble/ChatBubble.d.ts +1 -1
- package/types/exported-related/bubble/props.d.ts +9 -9
- package/types/exported-related/chat-card/ChatCard.d.ts +1 -1
- package/types/exported-related/chat-card/props.d.ts +4 -4
- package/types/exported-related/chat-container-header/ChatContainerHeader.d.ts +1 -1
- package/types/exported-related/chat-container-header/props.d.ts +2 -2
- package/types/exported-related/chat-container-header/tests/ChatContainerHeader.test.d.ts +1 -0
- package/types/exported-related/chat-empty-state/ChatEmptyState.d.ts +1 -1
- package/types/exported-related/chat-empty-state/props.d.ts +2 -2
- package/types/exported-related/chat-sidebar/SideBarChat.d.ts +1 -1
- package/types/exported-related/floating-button/FloatingButton.d.ts +1 -1
- package/types/exported-related/floating-container/styled.d.ts +2 -1
- package/types/exported-related/message-delimiter/MessageDelimiter.d.ts +1 -1
- package/types/exported-related/message-delimiter/props.d.ts +365 -1
- package/types/exported-related/system-message/SystemMessage.d.ts +1 -1
- package/types/exported-related/tile-button/TileButton.d.ts +1 -1
- package/types/exported-related/tile-button/props.d.ts +19 -19
- package/types/parts/chat-composer/ChatContainerComposer.d.ts +1 -1
- package/types/parts/chat-container/ChatContainer.d.ts +1 -1
- package/types/parts/chat-container-messages-list/ChatContainerMessagesList.d.ts +1 -1
- package/types/parts/chat-container-messages-list/styled.d.ts +1 -0
- package/types/parts/chat-container-messages-list/useGetNewMessages.d.ts +2 -0
- package/types/react-desc-prop-types.d.ts +761 -17
|
@@ -17,7 +17,7 @@ const StyledChatContainerContentHeader = /*#__PURE__*/styled__default["default"]
|
|
|
17
17
|
})(["width:100%;min-height:48px;border-bottom:1px solid ", ";background:", ";", "{& button{background:transparent;}}"], props => props.theme.colors.neutral['200'], props => props.theme.colors.neutral['050'], StyledChatContainerContentHeaderActions);
|
|
18
18
|
const StyledChatContainerContentHeaderLabel = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
|
|
19
19
|
componentId: "sc-rsxerm-2"
|
|
20
|
-
})(["justify-content:center;align-items:center;font-weight:bold;font-size:18px;color:", ";"], props => props.theme.colors.neutral['700']);
|
|
20
|
+
})(["justify-content:center;align-items:center;font-weight:bold;font-size:18px;color:", ";line-height:1.6;"], props => props.theme.colors.neutral['700']);
|
|
21
21
|
|
|
22
22
|
exports.StyledChatContainerContentHeader = StyledChatContainerContentHeader;
|
|
23
23
|
exports.StyledChatContainerContentHeaderActions = StyledChatContainerContentHeaderActions;
|
|
@@ -26,6 +26,7 @@ var MessageDelimiter = require('../../exported-related/message-delimiter/Message
|
|
|
26
26
|
var SystemMessage = require('../../exported-related/system-message/SystemMessage.js');
|
|
27
27
|
var styled = require('./styled.js');
|
|
28
28
|
var reactDescPropTypes = require('../../react-desc-prop-types.js');
|
|
29
|
+
var useGetNewMessages = require('./useGetNewMessages.js');
|
|
29
30
|
var jsxRuntime = require('react/jsx-runtime');
|
|
30
31
|
|
|
31
32
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -89,6 +90,7 @@ const ChatContainerMessagesList = props$1 => {
|
|
|
89
90
|
})), {}, {
|
|
90
91
|
estimateSize: React__default["default"].useCallback(() => 80, [])
|
|
91
92
|
}));
|
|
93
|
+
const newMessages = useGetNewMessages.useGetNewMessages(messages);
|
|
92
94
|
const debouncedScroll = React__default["default"].useMemo(() => lodash.debounce(() => {
|
|
93
95
|
var _virtualListRef$curre;
|
|
94
96
|
|
|
@@ -229,7 +231,12 @@ const ChatContainerMessagesList = props$1 => {
|
|
|
229
231
|
|
|
230
232
|
e.preventDefault();
|
|
231
233
|
(_loadMoreRef$current2 = loadMoreRef.current) === null || _loadMoreRef$current2 === void 0 ? void 0 : _loadMoreRef$current2.focus();
|
|
232
|
-
} else if (hasMoreItems === 'top' && e.shiftKey)
|
|
234
|
+
} else if (hasMoreItems === 'top' && e.shiftKey) {
|
|
235
|
+
var _loadMoreRef$current3;
|
|
236
|
+
|
|
237
|
+
e.preventDefault();
|
|
238
|
+
(_loadMoreRef$current3 = loadMoreRef.current) === null || _loadMoreRef$current3 === void 0 ? void 0 : _loadMoreRef$current3.focus();
|
|
239
|
+
} else if (!e.shiftKey) {
|
|
233
240
|
if (bannerPosition) {
|
|
234
241
|
var _bannerRef$current;
|
|
235
242
|
|
|
@@ -289,11 +296,6 @@ const ChatContainerMessagesList = props$1 => {
|
|
|
289
296
|
case 'Tab':
|
|
290
297
|
if (document.activeElement !== loadMoreRef.current) {
|
|
291
298
|
if (hasMoreItems === 'bottom' && !e.shiftKey) {
|
|
292
|
-
var _loadMoreRef$current3;
|
|
293
|
-
|
|
294
|
-
e.preventDefault();
|
|
295
|
-
(_loadMoreRef$current3 = loadMoreRef.current) === null || _loadMoreRef$current3 === void 0 ? void 0 : _loadMoreRef$current3.focus();
|
|
296
|
-
} else if (hasMoreItems === 'top' && e.shiftKey) {
|
|
297
299
|
var _loadMoreRef$current4;
|
|
298
300
|
|
|
299
301
|
e.preventDefault();
|
|
@@ -348,12 +350,10 @@ const ChatContainerMessagesList = props$1 => {
|
|
|
348
350
|
})) : null, row.type === props.BUBBLE_TYPES.DELIMITER ? /*#__PURE__*/jsxRuntime.jsx(MessageDelimiter.MessageDelimiter, _objectSpread({}, row)) : null, row.type === props.BUBBLE_TYPES.SYSTEM ? /*#__PURE__*/jsxRuntime.jsx(SystemMessage.SystemMessage, _objectSpread({}, row)) : null)
|
|
349
351
|
}, "ds-chat-bubble-".concat(index, "-").concat(row.dsId, "-").concat(row.type));
|
|
350
352
|
}), [virtualItems, messages, sendingMessages, handleKey, sendingText]);
|
|
351
|
-
return /*#__PURE__*/jsxRuntime.
|
|
352
|
-
children: /*#__PURE__*/jsxRuntime.jsx(styled.StyledChatContainerContentList, {
|
|
353
|
+
return /*#__PURE__*/jsxRuntime.jsxs(styled.StyledWrapper, _objectSpread(_objectSpread({}, globalAttributes), {}, {
|
|
354
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(styled.StyledChatContainerContentList, {
|
|
353
355
|
"data-testid": "chat-thread-container",
|
|
354
356
|
tabIndex: 0,
|
|
355
|
-
"aria-live": "polite",
|
|
356
|
-
"aria-relevant": "additions",
|
|
357
357
|
ref: virtualListRef,
|
|
358
358
|
role: "list",
|
|
359
359
|
onKeyDown: handleListKey,
|
|
@@ -368,7 +368,10 @@ const ChatContainerMessagesList = props$1 => {
|
|
|
368
368
|
"data-testid": "ds-chat-load-more-btn",
|
|
369
369
|
innerRef: loadMoreRef
|
|
370
370
|
})) : null, render)
|
|
371
|
-
})
|
|
371
|
+
}), /*#__PURE__*/_jsx__default["default"](styled.StyledNewMessagesHiddenContainer, {
|
|
372
|
+
"aria-live": "polite",
|
|
373
|
+
"aria-hidden": "false"
|
|
374
|
+
}, void 0, newMessages.map(newMessage => /*#__PURE__*/_jsx__default["default"]("p", {}, void 0, newMessage.title, " ", newMessage.time, " ", newMessage.body, " ", newMessage.errorMessage, " ", newMessage.helpMessage)))]
|
|
372
375
|
}));
|
|
373
376
|
};
|
|
374
377
|
|
|
@@ -20,19 +20,23 @@ const StyledWrapperListItem = /*#__PURE__*/styled__default["default"].div.withCo
|
|
|
20
20
|
const StyledChatContainerContentList = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
21
21
|
componentId: "sc-1jhprzr-2"
|
|
22
22
|
})(["width:100%;height:100%;padding:", ";padding-bottom:0;overflow-y:auto;overflow-x:hidden;"], props => props.theme.space.xs);
|
|
23
|
-
const
|
|
23
|
+
const StyledNewMessagesHiddenContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
24
24
|
componentId: "sc-1jhprzr-3"
|
|
25
|
+
})(["position:absolute;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(100%);white-space:nowrap;"]);
|
|
26
|
+
const StyledChatContainerContentListScroll = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
27
|
+
componentId: "sc-1jhprzr-4"
|
|
25
28
|
})(["width:100%;height:", ";position:relative;"], props => props.height);
|
|
26
29
|
const StyledLoadMoreContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
27
|
-
componentId: "sc-1jhprzr-
|
|
30
|
+
componentId: "sc-1jhprzr-5"
|
|
28
31
|
})(["position:absolute;width:calc(100% + ", ");padding:", ";left:-", ";right:-", ";display:grid;justify-content:center;align-items:center;", " ", ""], props => props.theme.space.xxs, props => props.theme.space.xxs, props => props.theme.space.xxs, props => props.theme.space.xxs, props => props.hasMoreItems === 'top' ? 'top: 0;' : '', props => props.hasMoreItems === 'bottom' ? 'bottom: 0;' : '');
|
|
29
32
|
const ListItem = /*#__PURE__*/styled__default["default"].div.withConfig({
|
|
30
|
-
componentId: "sc-1jhprzr-
|
|
33
|
+
componentId: "sc-1jhprzr-6"
|
|
31
34
|
})(["&:focus,&:focus-visible{outline:none;&:after{content:'';display:block;position:absolute;top:0;left:-", ";pointer-events:none;border-radius:2px;background-color:#ebedf0;width:calc(100% + 24px);border:2px solid #1e79c2;height:100%;z-index:-1;}}"], props => props.theme.space.xxs);
|
|
32
35
|
|
|
33
36
|
exports.ListItem = ListItem;
|
|
34
37
|
exports.StyledChatContainerContentList = StyledChatContainerContentList;
|
|
35
38
|
exports.StyledChatContainerContentListScroll = StyledChatContainerContentListScroll;
|
|
36
39
|
exports.StyledLoadMoreContainer = StyledLoadMoreContainer;
|
|
40
|
+
exports.StyledNewMessagesHiddenContainer = StyledNewMessagesHiddenContainer;
|
|
37
41
|
exports.StyledWrapper = StyledWrapper;
|
|
38
42
|
exports.StyledWrapperListItem = StyledWrapperListItem;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.async-iterator.map.js');
|
|
10
|
+
require('core-js/modules/esnext.iterator.map.js');
|
|
11
|
+
var React = require('react');
|
|
12
|
+
|
|
13
|
+
const useGetNewMessages = messages => {
|
|
14
|
+
const [seenMessages, setSeenMessages] = React.useState({});
|
|
15
|
+
const newMessages = React.useMemo(() => {
|
|
16
|
+
const list = [];
|
|
17
|
+
messages.forEach(message => {
|
|
18
|
+
if (!(message.dsId in seenMessages)) {
|
|
19
|
+
list.push(message);
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
setSeenMessages(Object.fromEntries(messages.map(m => [m.dsId, true])));
|
|
23
|
+
return list; // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
24
|
+
}, [messages]);
|
|
25
|
+
return newMessages;
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
exports.useGetNewMessages = useGetNewMessages;
|
|
@@ -9,6 +9,6 @@ const StyledChatContainerContentHeader = /*#__PURE__*/styled(Grid).withConfig({
|
|
|
9
9
|
})(["width:100%;min-height:48px;border-bottom:1px solid ", ";background:", ";", "{& button{background:transparent;}}"], props => props.theme.colors.neutral['200'], props => props.theme.colors.neutral['050'], StyledChatContainerContentHeaderActions);
|
|
10
10
|
const StyledChatContainerContentHeaderLabel = /*#__PURE__*/styled(Grid).withConfig({
|
|
11
11
|
componentId: "sc-rsxerm-2"
|
|
12
|
-
})(["justify-content:center;align-items:center;font-weight:bold;font-size:18px;color:", ";"], props => props.theme.colors.neutral['700']);
|
|
12
|
+
})(["justify-content:center;align-items:center;font-weight:bold;font-size:18px;color:", ";line-height:1.6;"], props => props.theme.colors.neutral['700']);
|
|
13
13
|
|
|
14
14
|
export { StyledChatContainerContentHeader, StyledChatContainerContentHeaderActions, StyledChatContainerContentHeaderLabel };
|
|
@@ -20,9 +20,10 @@ import { ChatBubble } from '../../exported-related/bubble/ChatBubble.js';
|
|
|
20
20
|
import { BUBBLE_TYPES } from '../../exported-related/bubble/props.js';
|
|
21
21
|
import { MessageDelimiter } from '../../exported-related/message-delimiter/MessageDelimiter.js';
|
|
22
22
|
import { SystemMessage } from '../../exported-related/system-message/SystemMessage.js';
|
|
23
|
-
import { ListItem, StyledWrapperListItem, StyledWrapper, StyledChatContainerContentList, StyledChatContainerContentListScroll, StyledLoadMoreContainer } from './styled.js';
|
|
23
|
+
import { ListItem, StyledWrapperListItem, StyledWrapper, StyledChatContainerContentList, StyledChatContainerContentListScroll, StyledLoadMoreContainer, StyledNewMessagesHiddenContainer } from './styled.js';
|
|
24
24
|
import { ChatContainerMessagesListPropTypes, defaultPropsMessagesList } from '../../react-desc-prop-types.js';
|
|
25
|
-
import {
|
|
25
|
+
import { useGetNewMessages } from './useGetNewMessages.js';
|
|
26
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
26
27
|
|
|
27
28
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
28
29
|
|
|
@@ -78,6 +79,7 @@ const ChatContainerMessagesList = props => {
|
|
|
78
79
|
})), {}, {
|
|
79
80
|
estimateSize: React.useCallback(() => 80, [])
|
|
80
81
|
}));
|
|
82
|
+
const newMessages = useGetNewMessages(messages);
|
|
81
83
|
const debouncedScroll = React.useMemo(() => debounce(() => {
|
|
82
84
|
var _virtualListRef$curre;
|
|
83
85
|
|
|
@@ -218,7 +220,12 @@ const ChatContainerMessagesList = props => {
|
|
|
218
220
|
|
|
219
221
|
e.preventDefault();
|
|
220
222
|
(_loadMoreRef$current2 = loadMoreRef.current) === null || _loadMoreRef$current2 === void 0 ? void 0 : _loadMoreRef$current2.focus();
|
|
221
|
-
} else if (hasMoreItems === 'top' && e.shiftKey)
|
|
223
|
+
} else if (hasMoreItems === 'top' && e.shiftKey) {
|
|
224
|
+
var _loadMoreRef$current3;
|
|
225
|
+
|
|
226
|
+
e.preventDefault();
|
|
227
|
+
(_loadMoreRef$current3 = loadMoreRef.current) === null || _loadMoreRef$current3 === void 0 ? void 0 : _loadMoreRef$current3.focus();
|
|
228
|
+
} else if (!e.shiftKey) {
|
|
222
229
|
if (bannerPosition) {
|
|
223
230
|
var _bannerRef$current;
|
|
224
231
|
|
|
@@ -278,11 +285,6 @@ const ChatContainerMessagesList = props => {
|
|
|
278
285
|
case 'Tab':
|
|
279
286
|
if (document.activeElement !== loadMoreRef.current) {
|
|
280
287
|
if (hasMoreItems === 'bottom' && !e.shiftKey) {
|
|
281
|
-
var _loadMoreRef$current3;
|
|
282
|
-
|
|
283
|
-
e.preventDefault();
|
|
284
|
-
(_loadMoreRef$current3 = loadMoreRef.current) === null || _loadMoreRef$current3 === void 0 ? void 0 : _loadMoreRef$current3.focus();
|
|
285
|
-
} else if (hasMoreItems === 'top' && e.shiftKey) {
|
|
286
288
|
var _loadMoreRef$current4;
|
|
287
289
|
|
|
288
290
|
e.preventDefault();
|
|
@@ -337,12 +339,10 @@ const ChatContainerMessagesList = props => {
|
|
|
337
339
|
})) : null, row.type === BUBBLE_TYPES.DELIMITER ? /*#__PURE__*/jsx(MessageDelimiter, _objectSpread({}, row)) : null, row.type === BUBBLE_TYPES.SYSTEM ? /*#__PURE__*/jsx(SystemMessage, _objectSpread({}, row)) : null)
|
|
338
340
|
}, "ds-chat-bubble-".concat(index, "-").concat(row.dsId, "-").concat(row.type));
|
|
339
341
|
}), [virtualItems, messages, sendingMessages, handleKey, sendingText]);
|
|
340
|
-
return /*#__PURE__*/
|
|
341
|
-
children: /*#__PURE__*/jsx(StyledChatContainerContentList, {
|
|
342
|
+
return /*#__PURE__*/jsxs(StyledWrapper, _objectSpread(_objectSpread({}, globalAttributes), {}, {
|
|
343
|
+
children: [/*#__PURE__*/jsx(StyledChatContainerContentList, {
|
|
342
344
|
"data-testid": "chat-thread-container",
|
|
343
345
|
tabIndex: 0,
|
|
344
|
-
"aria-live": "polite",
|
|
345
|
-
"aria-relevant": "additions",
|
|
346
346
|
ref: virtualListRef,
|
|
347
347
|
role: "list",
|
|
348
348
|
onKeyDown: handleListKey,
|
|
@@ -357,7 +357,10 @@ const ChatContainerMessagesList = props => {
|
|
|
357
357
|
"data-testid": "ds-chat-load-more-btn",
|
|
358
358
|
innerRef: loadMoreRef
|
|
359
359
|
})) : null, render)
|
|
360
|
-
})
|
|
360
|
+
}), /*#__PURE__*/_jsx(StyledNewMessagesHiddenContainer, {
|
|
361
|
+
"aria-live": "polite",
|
|
362
|
+
"aria-hidden": "false"
|
|
363
|
+
}, void 0, newMessages.map(newMessage => /*#__PURE__*/_jsx("p", {}, void 0, newMessage.title, " ", newMessage.time, " ", newMessage.body, " ", newMessage.errorMessage, " ", newMessage.helpMessage)))]
|
|
361
364
|
}));
|
|
362
365
|
};
|
|
363
366
|
|
|
@@ -12,14 +12,17 @@ const StyledWrapperListItem = /*#__PURE__*/styled.div.withConfig({
|
|
|
12
12
|
const StyledChatContainerContentList = /*#__PURE__*/styled.div.withConfig({
|
|
13
13
|
componentId: "sc-1jhprzr-2"
|
|
14
14
|
})(["width:100%;height:100%;padding:", ";padding-bottom:0;overflow-y:auto;overflow-x:hidden;"], props => props.theme.space.xs);
|
|
15
|
-
const
|
|
15
|
+
const StyledNewMessagesHiddenContainer = /*#__PURE__*/styled.div.withConfig({
|
|
16
16
|
componentId: "sc-1jhprzr-3"
|
|
17
|
+
})(["position:absolute;width:1px;height:1px;margin:-1px;border:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(100%);white-space:nowrap;"]);
|
|
18
|
+
const StyledChatContainerContentListScroll = /*#__PURE__*/styled.div.withConfig({
|
|
19
|
+
componentId: "sc-1jhprzr-4"
|
|
17
20
|
})(["width:100%;height:", ";position:relative;"], props => props.height);
|
|
18
21
|
const StyledLoadMoreContainer = /*#__PURE__*/styled.div.withConfig({
|
|
19
|
-
componentId: "sc-1jhprzr-
|
|
22
|
+
componentId: "sc-1jhprzr-5"
|
|
20
23
|
})(["position:absolute;width:calc(100% + ", ");padding:", ";left:-", ";right:-", ";display:grid;justify-content:center;align-items:center;", " ", ""], props => props.theme.space.xxs, props => props.theme.space.xxs, props => props.theme.space.xxs, props => props.theme.space.xxs, props => props.hasMoreItems === 'top' ? 'top: 0;' : '', props => props.hasMoreItems === 'bottom' ? 'bottom: 0;' : '');
|
|
21
24
|
const ListItem = /*#__PURE__*/styled.div.withConfig({
|
|
22
|
-
componentId: "sc-1jhprzr-
|
|
25
|
+
componentId: "sc-1jhprzr-6"
|
|
23
26
|
})(["&:focus,&:focus-visible{outline:none;&:after{content:'';display:block;position:absolute;top:0;left:-", ";pointer-events:none;border-radius:2px;background-color:#ebedf0;width:calc(100% + 24px);border:2px solid #1e79c2;height:100%;z-index:-1;}}"], props => props.theme.space.xxs);
|
|
24
27
|
|
|
25
|
-
export { ListItem, StyledChatContainerContentList, StyledChatContainerContentListScroll, StyledLoadMoreContainer, StyledWrapper, StyledWrapperListItem };
|
|
28
|
+
export { ListItem, StyledChatContainerContentList, StyledChatContainerContentListScroll, StyledLoadMoreContainer, StyledNewMessagesHiddenContainer, StyledWrapper, StyledWrapperListItem };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
2
|
+
import 'core-js/modules/esnext.async-iterator.for-each.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
4
|
+
import 'core-js/modules/esnext.iterator.for-each.js';
|
|
5
|
+
import 'core-js/modules/esnext.async-iterator.map.js';
|
|
6
|
+
import 'core-js/modules/esnext.iterator.map.js';
|
|
7
|
+
import { useState, useMemo } from 'react';
|
|
8
|
+
|
|
9
|
+
const useGetNewMessages = messages => {
|
|
10
|
+
const [seenMessages, setSeenMessages] = useState({});
|
|
11
|
+
const newMessages = useMemo(() => {
|
|
12
|
+
const list = [];
|
|
13
|
+
messages.forEach(message => {
|
|
14
|
+
if (!(message.dsId in seenMessages)) {
|
|
15
|
+
list.push(message);
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
setSeenMessages(Object.fromEntries(messages.map(m => [m.dsId, true])));
|
|
19
|
+
return list; // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
20
|
+
}, [messages]);
|
|
21
|
+
return newMessages;
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export { useGetNewMessages };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-chat",
|
|
3
|
-
"version": "2.3.0-
|
|
3
|
+
"version": "2.3.0-rc.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Chat",
|
|
6
6
|
"module": "./esm/index.js",
|
|
@@ -35,6 +35,10 @@
|
|
|
35
35
|
"import": "./esm/parts/chat-container/ChatContainer.js",
|
|
36
36
|
"require": "./cjs/parts/chat-container/ChatContainer.js"
|
|
37
37
|
},
|
|
38
|
+
"./parts/chat-container-messages-list/useGetNewMessages": {
|
|
39
|
+
"import": "./esm/parts/chat-container-messages-list/useGetNewMessages.js",
|
|
40
|
+
"require": "./cjs/parts/chat-container-messages-list/useGetNewMessages.js"
|
|
41
|
+
},
|
|
38
42
|
"./parts/chat-container-messages-list/styled": {
|
|
39
43
|
"import": "./esm/parts/chat-container-messages-list/styled.js",
|
|
40
44
|
"require": "./cjs/parts/chat-container-messages-list/styled.js"
|
|
@@ -261,18 +265,18 @@
|
|
|
261
265
|
"generateSubmodules": true
|
|
262
266
|
},
|
|
263
267
|
"dependencies": {
|
|
264
|
-
"@elliemae/ds-banner": "2.3.0-
|
|
265
|
-
"@elliemae/ds-button": "2.3.0-
|
|
266
|
-
"@elliemae/ds-grid": "2.3.0-
|
|
267
|
-
"@elliemae/ds-icons": "2.3.0-
|
|
268
|
-
"@elliemae/ds-indeterminate-progress-indicator": "2.3.0-
|
|
269
|
-
"@elliemae/ds-props-helpers": "2.3.0-
|
|
270
|
-
"@elliemae/ds-system": "2.3.0-
|
|
271
|
-
"@elliemae/ds-tooltip": "2.3.0-
|
|
272
|
-
"@elliemae/ds-truncated-tooltip-text": "2.3.0-
|
|
268
|
+
"@elliemae/ds-banner": "2.3.0-rc.1",
|
|
269
|
+
"@elliemae/ds-button": "2.3.0-rc.1",
|
|
270
|
+
"@elliemae/ds-grid": "2.3.0-rc.1",
|
|
271
|
+
"@elliemae/ds-icons": "2.3.0-rc.1",
|
|
272
|
+
"@elliemae/ds-indeterminate-progress-indicator": "2.3.0-rc.1",
|
|
273
|
+
"@elliemae/ds-props-helpers": "2.3.0-rc.1",
|
|
274
|
+
"@elliemae/ds-system": "2.3.0-rc.1",
|
|
275
|
+
"@elliemae/ds-tooltip": "2.3.0-rc.1",
|
|
276
|
+
"@elliemae/ds-truncated-tooltip-text": "2.3.0-rc.1",
|
|
273
277
|
"prop-types": "~15.7.2",
|
|
274
278
|
"react-desc": "~4.1.2",
|
|
275
|
-
"react-virtual": "~2.
|
|
279
|
+
"react-virtual": "~2.8.2"
|
|
276
280
|
},
|
|
277
281
|
"devDependencies": {
|
|
278
282
|
"@testing-library/dom": "~8.11.1",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { BubblePropsT } from './props';
|
|
3
3
|
declare const ChatBubble: React.ComponentType<BubblePropsT>;
|
|
4
|
-
declare const ChatBubbleWithSchema:
|
|
4
|
+
declare const ChatBubbleWithSchema: import("@elliemae/ds-props-helpers/types/propTypes/types").DocumentedReactComponent<BubblePropsT>;
|
|
5
5
|
export { ChatBubble, ChatBubbleWithSchema };
|
|
@@ -19,15 +19,15 @@ export interface BubblePropsT {
|
|
|
19
19
|
}
|
|
20
20
|
export declare const defaultBubbleProps: BubblePropsT;
|
|
21
21
|
export declare const BubblesPropTypes: {
|
|
22
|
-
dsId:
|
|
23
|
-
type:
|
|
24
|
-
title:
|
|
25
|
-
time:
|
|
26
|
-
body:
|
|
27
|
-
onClick:
|
|
28
|
-
errorMessage:
|
|
29
|
-
helpMessage:
|
|
22
|
+
dsId: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
23
|
+
type: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
24
|
+
title: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
25
|
+
time: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
26
|
+
body: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
27
|
+
onClick: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
28
|
+
errorMessage: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
29
|
+
helpMessage: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
30
30
|
};
|
|
31
31
|
export declare const propsArrowBubble: {
|
|
32
|
-
type:
|
|
32
|
+
type: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
33
33
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { CardPropTypes } from './props';
|
|
3
3
|
declare const ChatCard: React.ComponentType<CardPropTypes>;
|
|
4
|
-
declare const ChatCardWithSchema:
|
|
4
|
+
declare const ChatCardWithSchema: import("@elliemae/ds-props-helpers/types/propTypes/types").DocumentedReactComponent<CardPropTypes>;
|
|
5
5
|
export { ChatCard, ChatCardWithSchema };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare const defaultProps: CardPropTypes;
|
|
3
3
|
export declare const propTypes: {
|
|
4
|
-
title:
|
|
5
|
-
content:
|
|
6
|
-
time:
|
|
7
|
-
rightAddon:
|
|
4
|
+
title: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
5
|
+
content: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
6
|
+
time: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
7
|
+
rightAddon: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
8
8
|
};
|
|
9
9
|
export interface CardPropTypes {
|
|
10
10
|
title: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { HeaderProps } from './props';
|
|
3
3
|
declare const ChatContainerHeader: React.ComponentType<HeaderProps>;
|
|
4
|
-
declare const ChatContainerHeaderWithSchema:
|
|
4
|
+
declare const ChatContainerHeaderWithSchema: import("@elliemae/ds-props-helpers/types/propTypes/types").DocumentedReactComponent<HeaderProps>;
|
|
5
5
|
export { ChatContainerHeader, ChatContainerHeaderWithSchema };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare const defaultProps: HeaderProps;
|
|
3
3
|
export declare const propTypes: {
|
|
4
|
-
title:
|
|
5
|
-
children:
|
|
4
|
+
title: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
5
|
+
children: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
6
6
|
};
|
|
7
7
|
export interface HeaderProps {
|
|
8
8
|
title: string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ChatEmptyStateProps } from './props';
|
|
3
3
|
declare const ChatEmptyState: React.ComponentType<ChatEmptyStateProps>;
|
|
4
|
-
declare const ChatEmptyStateWithSchema:
|
|
4
|
+
declare const ChatEmptyStateWithSchema: import("@elliemae/ds-props-helpers/types/propTypes/types").DocumentedReactComponent<ChatEmptyStateProps>;
|
|
5
5
|
export { ChatEmptyState, ChatEmptyStateWithSchema };
|
|
@@ -5,6 +5,6 @@ export interface ChatEmptyStateProps {
|
|
|
5
5
|
}
|
|
6
6
|
export declare const defaultProps: ChatEmptyStateProps;
|
|
7
7
|
export declare const emptyStateProps: {
|
|
8
|
-
label:
|
|
9
|
-
action:
|
|
8
|
+
label: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
9
|
+
action: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
|
|
10
10
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { ChatSidebarProps } from './props';
|
|
3
3
|
declare const SideBarChat: React.ComponentType<ChatSidebarProps>;
|
|
4
|
-
declare const SideBarChatWithSchema:
|
|
4
|
+
declare const SideBarChatWithSchema: import("@elliemae/ds-props-helpers/types/propTypes/types").DocumentedReactComponent<ChatSidebarProps>;
|
|
5
5
|
export { SideBarChat, SideBarChatWithSchema };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { FloatingButtonProps } from './props';
|
|
3
3
|
declare const FloatingButton: React.ComponentType<FloatingButtonProps>;
|
|
4
|
-
declare const FloatingButtonWithSchema:
|
|
4
|
+
declare const FloatingButtonWithSchema: import("@elliemae/ds-props-helpers/types/propTypes/types").DocumentedReactComponent<FloatingButtonProps>;
|
|
5
5
|
export { FloatingButton, FloatingButtonWithSchema };
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledFloatingContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { MessageDelimiterProps } from './props';
|
|
3
3
|
declare const MessageDelimiter: React.ComponentType<MessageDelimiterProps>;
|
|
4
|
-
declare const MessageDelimiterWithSchema:
|
|
4
|
+
declare const MessageDelimiterWithSchema: import("@elliemae/ds-props-helpers/types/propTypes/types").DocumentedReactComponent<MessageDelimiterProps>;
|
|
5
5
|
export { MessageDelimiter, MessageDelimiterWithSchema };
|