npm - @elliemae/ds-chat - Versions diffs - 2.0.0 → 2.1.0-rc.1 - Mend

@elliemae/ds-chat 2.0.0 → 2.1.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.

Files changed (22) hide show

package/cjs/parts/chat-composer/ChatContainerComposer.js CHANGED Viewed

@@ -28,9 +28,9 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var _PaperAirplane, _Grid;
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const ChatComposer = props => {
   var _input$current;
@@ -146,7 +146,7 @@ const ChatComposer = props => {
   }, void 0, inputMaxLength && hasError ? /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/_jsx__default["default"](styled.StyledCounterErrorA11y, {
       role: "alert"
-    }, void 0, maxLengthMessage || "You have exceeded the character limit by ".concat(inputLength - inputMaxLength)), maxLengthMessage || "Please limit to less than ".concat(inputMaxLength, " characters. ")]
+    }, void 0, maxLengthMessage || "You have entered ".concat(inputLength, " characters and have exceeded the limit by ").concat(inputLength - inputMaxLength, ". Please limit to less than ").concat(inputMaxLength, " characters. ")), maxLengthMessage || "Please limit to less than ".concat(inputMaxLength, " characters. ")]
   }) : '', inputMaxLength ? " ".concat(inputLength, " / ").concat(inputMaxLength) : ''), _Grid || (_Grid = /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}))));
 };

package/cjs/parts/chat-container/ChatContainer.js CHANGED Viewed

@@ -29,11 +29,11 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var DSIndeterminateProgressIndicator__default = /*#__PURE__*/_interopDefaultLegacy(DSIndeterminateProgressIndicator);
 var DSBanner__default = /*#__PURE__*/_interopDefaultLegacy(DSBanner);
-var _DSIndeterminateProgr, _StyledIndicatorConta;
+var _DSIndeterminateProgr;
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const ChatContainer = props$1 => {
   var _containerRef$current;
@@ -86,17 +86,21 @@ const ChatContainer = props$1 => {
       const ref = actionRef || listRef;
       if (e.shiftKey && e.key === 'Tab') {
-        e.preventDefault();
+        if (messagesListProps.messages.length > 0) {
+          e.preventDefault();
-        if (['top', 'bottom'].includes(bannerPosition)) {
-          bannerRef.current.focusOnWrapper();
-        } else {
-          const last = ref.current.getMessagesInView().pop();
-          ref.current.focusToIndexWithoutScroll(last);
+          if (['top', 'bottom'].includes(bannerPosition)) {
+            bannerRef.current.focusOnWrapper();
+          } else {
+            var _ref$current;
+            const last = ref.current.getMessagesInView().pop();
+            (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.focusToIndexWithoutScroll(last);
+          }
         }
       }
     }
-  }, [actionRef, onComposerKeyDown, bannerPosition]); // Map actions
+  }, [actionRef, onComposerKeyDown, bannerPosition, messagesListProps.messages.length]); // Map actions
   React__default["default"].useEffect(() => {
     if (actionRef && actionRef.current) {
@@ -146,15 +150,15 @@ const ChatContainer = props$1 => {
       isOpen: true,
       type: bannerProps.type || DSBanner.BANNER_TYPES.INFO,
       actionRef: bannerRef
-    })), sendingMessages && sendingMessages.length > 0 ? _StyledIndicatorConta || (_StyledIndicatorConta = /*#__PURE__*/_jsx__default["default"](styled.StyledIndicatorContainer, {
+    })), sendingMessages && sendingMessages.length > 0 ? /*#__PURE__*/_jsx__default["default"](styled.StyledIndicatorContainer, {
       isLoading: "bottom",
       linear: true,
       "data-testid": "ds-chat-loading-indicator"
     }, void 0, /*#__PURE__*/_jsx__default["default"](DSIndeterminateProgressIndicator__default["default"], {
       processing: true,
-      title: "Loading",
+      title: sendingText,
       lineOnly: true
-    }))) : null), /*#__PURE__*/jsxRuntime.jsx(ChatContainerComposer.ChatComposer, _objectSpread(_objectSpread({}, composerProps), {}, {
+    })) : null), /*#__PURE__*/jsxRuntime.jsx(ChatContainerComposer.ChatComposer, _objectSpread(_objectSpread({}, composerProps), {}, {
       onKeyDown: handleTabs,
       onResize: onResize,
       maxHeight: (((_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.clientHeight) || 0) / 2,

package/cjs/parts/chat-container-messages-list/ChatContainerMessagesList.js CHANGED Viewed

@@ -19,6 +19,7 @@ var React = require('react');
 var reactDesc = require('react-desc');
 var reactVirtual = require('react-virtual');
 var DSButton = require('@elliemae/ds-button');
+var lodash = require('lodash');
 var ChatBubble = require('../bubble/ChatBubble.js');
 var props$1 = require('../bubble/props.js');
 var MessageDelimiter = require('../message-delimiter/MessageDelimiter.js');
@@ -35,9 +36,9 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const getPadding = _ref => {
   let {
@@ -67,6 +68,7 @@ const ChatContainerMessagesList = props$2 => {
     isLoading,
     bannerRef
   } = props$2;
+  const pendingOnScroll = React__default["default"].useRef(false);
   const loadMoreRef = React__default["default"].useRef(null);
   const virtualListRef = React__default["default"].useRef(); // estimateSize should not be really required given what was stated on
   // https://github.com/tannerlinsley/react-virtual/issues/23
@@ -86,9 +88,15 @@ const ChatContainerMessagesList = props$2 => {
   })), {}, {
     estimateSize: React__default["default"].useCallback(() => 80, [])
   }));
-  const onScrollStop = React__default["default"].useCallback(() => {
+  const debouncedScroll = React__default["default"].useMemo(() => lodash.debounce(() => {
     var _virtualListRef$curre;
+    if (document.visibilityState === 'hidden') {
+      pendingOnScroll.current = true;
+      return [];
+    }
+    pendingOnScroll.current = false;
     const {
       bottom,
       top
@@ -97,15 +105,15 @@ const ChatContainerMessagesList = props$2 => {
     const indexList = [];
     list.forEach(item => {
       const {
-        top: itemTop,
-        bottom: itemBottom
+        top: itemTop
       } = item.getBoundingClientRect();
       const itemPadding = 10;
-      if (itemTop + itemPadding < bottom && itemBottom - itemPadding > top) indexList.push(item.dataset.index);
+      if (itemTop + itemPadding < bottom && itemTop + itemPadding > top) indexList.push(item.dataset.index);
     });
     if (onScrollEnds) onScrollEnds(indexList);
     return indexList;
-  }, [onScrollEnds]);
+  }, 500), [onScrollEnds]);
+  const onScrollStop = React__default["default"].useCallback(debouncedScroll, [debouncedScroll]);
   const onlyFocus = React__default["default"].useCallback(index => {
     setTimeout(() => {
       virtualListRef.current.querySelector("[data-index=\"".concat(index, "\"]")).focus();
@@ -117,7 +125,8 @@ const ChatContainerMessagesList = props$2 => {
     };
     vScroll(index, b);
     onlyFocus(index);
-  }, [onlyFocus, vScroll]);
+    onScrollStop();
+  }, [onScrollStop, onlyFocus, vScroll]);
   React__default["default"].useEffect(() => {
     if (actionRef && actionRef.current) {
       actionRef.current.scrollToIndex = function (a) {
@@ -125,6 +134,7 @@ const ChatContainerMessagesList = props$2 => {
           align: 'center'
         };
         vScroll(a, b);
+        onScrollStop();
       };
       actionRef.current.getMessagesInView = onScrollStop;
@@ -138,7 +148,7 @@ const ChatContainerMessagesList = props$2 => {
       actionRef.current.focusToIndexWithoutScroll = onlyFocus;
-      actionRef.current.focusToList = a => {
+      actionRef.current.focusToList = () => {
         var _virtualListRef$curre2;
         (_virtualListRef$curre2 = virtualListRef.current) === null || _virtualListRef$curre2 === void 0 ? void 0 : _virtualListRef$curre2.focus();
@@ -155,7 +165,17 @@ const ChatContainerMessagesList = props$2 => {
     switch (key) {
       case 'ArrowUp':
         e.preventDefault();
-        if (index > 0) virtualListRef.current.querySelector("[data-index=\"".concat(index - 1, "\"]")).focus();
+        if (index > 0) {
+          var _virtualListRef$curre3;
+          ((_virtualListRef$curre3 = virtualListRef.current) === null || _virtualListRef$curre3 === void 0 ? void 0 : _virtualListRef$curre3.querySelector("[data-index=\"".concat(index - 1, "\"]"))).focus();
+        } else if (hasMoreItems === 'top') {
+          var _loadMoreRef$current;
+          (_loadMoreRef$current = loadMoreRef.current) === null || _loadMoreRef$current === void 0 ? void 0 : _loadMoreRef$current.focus();
+        }
         break;
       case 'ArrowDown':
@@ -178,31 +198,31 @@ const ChatContainerMessagesList = props$2 => {
         break;
       case 'Tab':
-        e.preventDefault();
         if (hasMoreItems === 'bottom' && !e.shiftKey) {
-          var _loadMoreRef$current;
-          (_loadMoreRef$current = loadMoreRef.current) === null || _loadMoreRef$current === void 0 ? void 0 : _loadMoreRef$current.focus();
-        } else if (hasMoreItems === 'top' && e.shiftKey) {
           var _loadMoreRef$current2;
+          e.preventDefault();
           (_loadMoreRef$current2 = loadMoreRef.current) === null || _loadMoreRef$current2 === void 0 ? void 0 : _loadMoreRef$current2.focus();
+        } else if (hasMoreItems === 'top' && e.shiftKey) {
+          var _loadMoreRef$current3;
+          e.preventDefault();
+          (_loadMoreRef$current3 = loadMoreRef.current) === null || _loadMoreRef$current3 === void 0 ? void 0 : _loadMoreRef$current3.focus();
         } else if (!e.shiftKey) {
           if (bannerPosition) {
+            e.preventDefault();
             bannerRef.current.focusOnWrapper();
-          } else {
-            actionRef.current.focusToComposer();
           }
         } else {
-          var _virtualListRef$curre3;
+          var _virtualListRef$curre4;
-          (_virtualListRef$curre3 = virtualListRef.current) === null || _virtualListRef$curre3 === void 0 ? void 0 : _virtualListRef$curre3.focus();
+          e.preventDefault();
+          (_virtualListRef$curre4 = virtualListRef.current) === null || _virtualListRef$curre4 === void 0 ? void 0 : _virtualListRef$curre4.focus();
         }
         break;
     }
-  }, [actionRef, hasMoreItems, messages.length, bannerPosition, scrollAndFocus]);
+  }, [actionRef, bannerRef, hasMoreItems, messages.length, bannerPosition, scrollAndFocus]);
   const handleListKey = React__default["default"].useCallback(e => {
     const {
       key
@@ -211,12 +231,24 @@ const ChatContainerMessagesList = props$2 => {
     switch (key) {
       case 'ArrowUp':
         e.preventDefault();
-        onlyFocus(onScrollStop().shift());
+        if (document.activeElement === loadMoreRef.current) {
+          scrollAndFocus(messages.length - 1);
+        } else {
+          onlyFocus(onScrollStop().shift());
+        }
         break;
       case 'ArrowDown':
         e.preventDefault();
-        onlyFocus(onScrollStop().pop());
+        if (document.activeElement === loadMoreRef.current) {
+          virtualListRef.current.querySelector("[data-index=\"0\"]").focus();
+        } else {
+          onlyFocus(onScrollStop().pop());
+        }
         break;
       case 'Home':
@@ -232,15 +264,15 @@ const ChatContainerMessagesList = props$2 => {
       case 'Tab':
         if (document.activeElement !== loadMoreRef.current) {
           if (hasMoreItems === 'bottom' && !e.shiftKey) {
-            var _loadMoreRef$current3;
+            var _loadMoreRef$current4;
             e.preventDefault();
-            (_loadMoreRef$current3 = loadMoreRef.current) === null || _loadMoreRef$current3 === void 0 ? void 0 : _loadMoreRef$current3.focus();
+            (_loadMoreRef$current4 = loadMoreRef.current) === null || _loadMoreRef$current4 === void 0 ? void 0 : _loadMoreRef$current4.focus();
           } else if (hasMoreItems === 'top' && e.shiftKey) {
-            var _loadMoreRef$current4;
+            var _loadMoreRef$current5;
             e.preventDefault();
-            (_loadMoreRef$current4 = loadMoreRef.current) === null || _loadMoreRef$current4 === void 0 ? void 0 : _loadMoreRef$current4.focus();
+            (_loadMoreRef$current5 = loadMoreRef.current) === null || _loadMoreRef$current5 === void 0 ? void 0 : _loadMoreRef$current5.focus();
           } else if (!e.shiftKey) {
             e.preventDefault();
             actionRef.current.focusToComposer();
@@ -249,15 +281,18 @@ const ChatContainerMessagesList = props$2 => {
           e.preventDefault();
           actionRef.current.focusToComposer();
         } else {
-          var _virtualListRef$curre4;
+          var _virtualListRef$curre5;
           e.preventDefault();
-          (_virtualListRef$curre4 = virtualListRef.current) === null || _virtualListRef$curre4 === void 0 ? void 0 : _virtualListRef$curre4.focus();
+          (_virtualListRef$curre5 = virtualListRef.current) === null || _virtualListRef$curre5 === void 0 ? void 0 : _virtualListRef$curre5.focus();
         }
         break;
     }
   }, [actionRef, hasMoreItems, messages.length, onScrollStop, onlyFocus, scrollAndFocus]);
+  const checkPendingOnScroll = React__default["default"].useCallback(() => {
+    if (pendingOnScroll.current === true) onScrollStop();
+  }, [onScrollStop]);
   React__default["default"].useEffect(() => {
     let handlerCallback = null;
     const localVirtualRef = virtualListRef.current;
@@ -271,11 +306,13 @@ const ChatContainerMessagesList = props$2 => {
       virtualListRef.current.addEventListener('scroll', onScroll);
     }
+    document.addEventListener('visibilitychange', checkPendingOnScroll);
     return () => {
       if (handlerCallback) clearTimeout(handlerCallback);
       if (onScrollEnds) localVirtualRef.removeEventListener('scroll', onScroll);
+      document.removeEventListener('visibilitychange', checkPendingOnScroll);
     };
-  }, [onScrollStop, onScrollEnds]);
+  }, [onScrollStop, onScrollEnds, checkPendingOnScroll]);
   const render = React__default["default"].useMemo(() => virtualItems.map(virtualItem => {
     const {
       index,
@@ -296,14 +333,14 @@ const ChatContainerMessagesList = props$2 => {
       "data-index": index,
       style: style,
       ref: measureRef,
-      tabIndex: 0,
+      tabIndex: -1,
       onKeyDown: handleKey,
       role: "listitem",
       children: /*#__PURE__*/_jsx__default["default"](styled.StyledWrapperListItem, {
         type: row.type
       }, void 0, row.type === props$1.BUBBLE_TYPES.SENDER || row.type === props$1.BUBBLE_TYPES.RECIPIENT ?
       /*#__PURE__*/
-      // eslint-disable-next-line
+      // eslint-disable-next-line eslint-comments/no-unlimited-disable
       jsxRuntime.jsx(ChatBubble.ChatBubble, _objectSpread(_objectSpread({}, row), {}, {
         helpMessage: isSending ? sendingText : row.helpMessage
       })) : null, row.type === props$1.BUBBLE_TYPES.DELIMITER ? /*#__PURE__*/jsxRuntime.jsx(MessageDelimiter.MessageDelimiter, _objectSpread({}, row)) : null, row.type === props$1.BUBBLE_TYPES.SYSTEM ? /*#__PURE__*/jsxRuntime.jsx(SystemMessage.SystemMessage, _objectSpread({}, row)) : null)
@@ -319,7 +356,7 @@ const ChatContainerMessagesList = props$2 => {
     onKeyDown: handleListKey,
     children: /*#__PURE__*/_jsx__default["default"](styled.StyledChatContainerContentListScroll, {
       height: "".concat(totalSize, "px")
-    }, void 0, render, !isLoading && hasMoreItems ? /*#__PURE__*/_jsx__default["default"](styled.StyledLoadMoreContainer, {
+    }, void 0, !isLoading && hasMoreItems ? /*#__PURE__*/_jsx__default["default"](styled.StyledLoadMoreContainer, {
       hasMoreItems: hasMoreItems
     }, void 0, /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
       labelText: "Load More",
@@ -327,7 +364,7 @@ const ChatContainerMessagesList = props$2 => {
       onClick: getMoreMessages,
       "data-testid": "ds-chat-load-more-btn",
       innerRef: loadMoreRef
-    })) : null)
+    })) : null, render)
   }));
 };

package/cjs/parts/chat-sidebar/SideBarChat.js CHANGED Viewed

@@ -28,9 +28,9 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const FooterChat = _ref => {
   let {

package/cjs/parts/sidebar-button/SidebarButton.js CHANGED Viewed

@@ -24,9 +24,9 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 const _excluded = ["label", "dsId", "onClick", "Icon"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const SidebarButton = _ref => {
   let {
     label,

package/esm/parts/chat-composer/ChatContainerComposer.js CHANGED Viewed

@@ -18,9 +18,9 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 var _PaperAirplane, _Grid;
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const ChatComposer = props => {
   var _input$current;
@@ -136,7 +136,7 @@ const ChatComposer = props => {
   }, void 0, inputMaxLength && hasError ? /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/_jsx(StyledCounterErrorA11y, {
       role: "alert"
-    }, void 0, maxLengthMessage || "You have exceeded the character limit by ".concat(inputLength - inputMaxLength)), maxLengthMessage || "Please limit to less than ".concat(inputMaxLength, " characters. ")]
+    }, void 0, maxLengthMessage || "You have entered ".concat(inputLength, " characters and have exceeded the limit by ").concat(inputLength - inputMaxLength, ". Please limit to less than ").concat(inputMaxLength, " characters. ")), maxLengthMessage || "Please limit to less than ".concat(inputMaxLength, " characters. ")]
   }) : '', inputMaxLength ? " ".concat(inputLength, " / ").concat(inputMaxLength) : ''), _Grid || (_Grid = /*#__PURE__*/_jsx(Grid, {}))));
 };

package/esm/parts/chat-container/ChatContainer.js CHANGED Viewed

@@ -17,11 +17,11 @@ import { StyledIndicatorContainer, StyledChatContainerContent, MobileStyledChatC
 import { useValidateProps } from './config/useValidateProps.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
-var _DSIndeterminateProgr, _StyledIndicatorConta;
+var _DSIndeterminateProgr;
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const ChatContainer = props => {
   var _containerRef$current;
@@ -74,17 +74,21 @@ const ChatContainer = props => {
       const ref = actionRef || listRef;
       if (e.shiftKey && e.key === 'Tab') {
-        e.preventDefault();
+        if (messagesListProps.messages.length > 0) {
+          e.preventDefault();
-        if (['top', 'bottom'].includes(bannerPosition)) {
-          bannerRef.current.focusOnWrapper();
-        } else {
-          const last = ref.current.getMessagesInView().pop();
-          ref.current.focusToIndexWithoutScroll(last);
+          if (['top', 'bottom'].includes(bannerPosition)) {
+            bannerRef.current.focusOnWrapper();
+          } else {
+            var _ref$current;
+            const last = ref.current.getMessagesInView().pop();
+            (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.focusToIndexWithoutScroll(last);
+          }
         }
       }
     }
-  }, [actionRef, onComposerKeyDown, bannerPosition]); // Map actions
+  }, [actionRef, onComposerKeyDown, bannerPosition, messagesListProps.messages.length]); // Map actions
   React.useEffect(() => {
     if (actionRef && actionRef.current) {
@@ -134,15 +138,15 @@ const ChatContainer = props => {
       isOpen: true,
       type: bannerProps.type || BANNER_TYPES.INFO,
       actionRef: bannerRef
-    })), sendingMessages && sendingMessages.length > 0 ? _StyledIndicatorConta || (_StyledIndicatorConta = /*#__PURE__*/_jsx(StyledIndicatorContainer, {
+    })), sendingMessages && sendingMessages.length > 0 ? /*#__PURE__*/_jsx(StyledIndicatorContainer, {
       isLoading: "bottom",
       linear: true,
       "data-testid": "ds-chat-loading-indicator"
     }, void 0, /*#__PURE__*/_jsx(DSIndeterminateProgressIndicator, {
       processing: true,
-      title: "Loading",
+      title: sendingText,
       lineOnly: true
-    }))) : null), /*#__PURE__*/jsx(ChatComposer, _objectSpread(_objectSpread({}, composerProps), {}, {
+    })) : null), /*#__PURE__*/jsx(ChatComposer, _objectSpread(_objectSpread({}, composerProps), {}, {
       onKeyDown: handleTabs,
       onResize: onResize,
       maxHeight: (((_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.clientHeight) || 0) / 2,

package/esm/parts/chat-container-messages-list/ChatContainerMessagesList.js CHANGED Viewed

@@ -15,6 +15,7 @@ import React from 'react';
 import { describe } from 'react-desc';
 import { useVirtual } from 'react-virtual';
 import DSButton from '@elliemae/ds-button';
+import { debounce } from 'lodash';
 import { ChatBubble } from '../bubble/ChatBubble.js';
 import { BUBBLE_TYPES } from '../bubble/props.js';
 import { MessageDelimiter } from '../message-delimiter/MessageDelimiter.js';
@@ -24,9 +25,9 @@ import { listProps, defaultProps } from './props.js';
 import { useValidateProps } from './config/useValidateProps.js';
 import { jsx } from 'react/jsx-runtime';
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const getPadding = _ref => {
   let {
@@ -56,6 +57,7 @@ const ChatContainerMessagesList = props => {
     isLoading,
     bannerRef
   } = props;
+  const pendingOnScroll = React.useRef(false);
   const loadMoreRef = React.useRef(null);
   const virtualListRef = React.useRef(); // estimateSize should not be really required given what was stated on
   // https://github.com/tannerlinsley/react-virtual/issues/23
@@ -75,9 +77,15 @@ const ChatContainerMessagesList = props => {
   })), {}, {
     estimateSize: React.useCallback(() => 80, [])
   }));
-  const onScrollStop = React.useCallback(() => {
+  const debouncedScroll = React.useMemo(() => debounce(() => {
     var _virtualListRef$curre;
+    if (document.visibilityState === 'hidden') {
+      pendingOnScroll.current = true;
+      return [];
+    }
+    pendingOnScroll.current = false;
     const {
       bottom,
       top
@@ -86,15 +94,15 @@ const ChatContainerMessagesList = props => {
     const indexList = [];
     list.forEach(item => {
       const {
-        top: itemTop,
-        bottom: itemBottom
+        top: itemTop
       } = item.getBoundingClientRect();
       const itemPadding = 10;
-      if (itemTop + itemPadding < bottom && itemBottom - itemPadding > top) indexList.push(item.dataset.index);
+      if (itemTop + itemPadding < bottom && itemTop + itemPadding > top) indexList.push(item.dataset.index);
     });
     if (onScrollEnds) onScrollEnds(indexList);
     return indexList;
-  }, [onScrollEnds]);
+  }, 500), [onScrollEnds]);
+  const onScrollStop = React.useCallback(debouncedScroll, [debouncedScroll]);
   const onlyFocus = React.useCallback(index => {
     setTimeout(() => {
       virtualListRef.current.querySelector("[data-index=\"".concat(index, "\"]")).focus();
@@ -106,7 +114,8 @@ const ChatContainerMessagesList = props => {
     };
     vScroll(index, b);
     onlyFocus(index);
-  }, [onlyFocus, vScroll]);
+    onScrollStop();
+  }, [onScrollStop, onlyFocus, vScroll]);
   React.useEffect(() => {
     if (actionRef && actionRef.current) {
       actionRef.current.scrollToIndex = function (a) {
@@ -114,6 +123,7 @@ const ChatContainerMessagesList = props => {
           align: 'center'
         };
         vScroll(a, b);
+        onScrollStop();
       };
       actionRef.current.getMessagesInView = onScrollStop;
@@ -127,7 +137,7 @@ const ChatContainerMessagesList = props => {
       actionRef.current.focusToIndexWithoutScroll = onlyFocus;
-      actionRef.current.focusToList = a => {
+      actionRef.current.focusToList = () => {
         var _virtualListRef$curre2;
         (_virtualListRef$curre2 = virtualListRef.current) === null || _virtualListRef$curre2 === void 0 ? void 0 : _virtualListRef$curre2.focus();
@@ -144,7 +154,17 @@ const ChatContainerMessagesList = props => {
     switch (key) {
       case 'ArrowUp':
         e.preventDefault();
-        if (index > 0) virtualListRef.current.querySelector("[data-index=\"".concat(index - 1, "\"]")).focus();
+        if (index > 0) {
+          var _virtualListRef$curre3;
+          ((_virtualListRef$curre3 = virtualListRef.current) === null || _virtualListRef$curre3 === void 0 ? void 0 : _virtualListRef$curre3.querySelector("[data-index=\"".concat(index - 1, "\"]"))).focus();
+        } else if (hasMoreItems === 'top') {
+          var _loadMoreRef$current;
+          (_loadMoreRef$current = loadMoreRef.current) === null || _loadMoreRef$current === void 0 ? void 0 : _loadMoreRef$current.focus();
+        }
         break;
       case 'ArrowDown':
@@ -167,31 +187,31 @@ const ChatContainerMessagesList = props => {
         break;
       case 'Tab':
-        e.preventDefault();
         if (hasMoreItems === 'bottom' && !e.shiftKey) {
-          var _loadMoreRef$current;
-          (_loadMoreRef$current = loadMoreRef.current) === null || _loadMoreRef$current === void 0 ? void 0 : _loadMoreRef$current.focus();
-        } else if (hasMoreItems === 'top' && e.shiftKey) {
           var _loadMoreRef$current2;
+          e.preventDefault();
           (_loadMoreRef$current2 = loadMoreRef.current) === null || _loadMoreRef$current2 === void 0 ? void 0 : _loadMoreRef$current2.focus();
+        } else if (hasMoreItems === 'top' && e.shiftKey) {
+          var _loadMoreRef$current3;
+          e.preventDefault();
+          (_loadMoreRef$current3 = loadMoreRef.current) === null || _loadMoreRef$current3 === void 0 ? void 0 : _loadMoreRef$current3.focus();
         } else if (!e.shiftKey) {
           if (bannerPosition) {
+            e.preventDefault();
             bannerRef.current.focusOnWrapper();
-          } else {
-            actionRef.current.focusToComposer();
           }
         } else {
-          var _virtualListRef$curre3;
+          var _virtualListRef$curre4;
-          (_virtualListRef$curre3 = virtualListRef.current) === null || _virtualListRef$curre3 === void 0 ? void 0 : _virtualListRef$curre3.focus();
+          e.preventDefault();
+          (_virtualListRef$curre4 = virtualListRef.current) === null || _virtualListRef$curre4 === void 0 ? void 0 : _virtualListRef$curre4.focus();
         }
         break;
     }
-  }, [actionRef, hasMoreItems, messages.length, bannerPosition, scrollAndFocus]);
+  }, [actionRef, bannerRef, hasMoreItems, messages.length, bannerPosition, scrollAndFocus]);
   const handleListKey = React.useCallback(e => {
     const {
       key
@@ -200,12 +220,24 @@ const ChatContainerMessagesList = props => {
     switch (key) {
       case 'ArrowUp':
         e.preventDefault();
-        onlyFocus(onScrollStop().shift());
+        if (document.activeElement === loadMoreRef.current) {
+          scrollAndFocus(messages.length - 1);
+        } else {
+          onlyFocus(onScrollStop().shift());
+        }
         break;
       case 'ArrowDown':
         e.preventDefault();
-        onlyFocus(onScrollStop().pop());
+        if (document.activeElement === loadMoreRef.current) {
+          virtualListRef.current.querySelector("[data-index=\"0\"]").focus();
+        } else {
+          onlyFocus(onScrollStop().pop());
+        }
         break;
       case 'Home':
@@ -221,15 +253,15 @@ const ChatContainerMessagesList = props => {
       case 'Tab':
         if (document.activeElement !== loadMoreRef.current) {
           if (hasMoreItems === 'bottom' && !e.shiftKey) {
-            var _loadMoreRef$current3;
+            var _loadMoreRef$current4;
             e.preventDefault();
-            (_loadMoreRef$current3 = loadMoreRef.current) === null || _loadMoreRef$current3 === void 0 ? void 0 : _loadMoreRef$current3.focus();
+            (_loadMoreRef$current4 = loadMoreRef.current) === null || _loadMoreRef$current4 === void 0 ? void 0 : _loadMoreRef$current4.focus();
           } else if (hasMoreItems === 'top' && e.shiftKey) {
-            var _loadMoreRef$current4;
+            var _loadMoreRef$current5;
             e.preventDefault();
-            (_loadMoreRef$current4 = loadMoreRef.current) === null || _loadMoreRef$current4 === void 0 ? void 0 : _loadMoreRef$current4.focus();
+            (_loadMoreRef$current5 = loadMoreRef.current) === null || _loadMoreRef$current5 === void 0 ? void 0 : _loadMoreRef$current5.focus();
           } else if (!e.shiftKey) {
             e.preventDefault();
             actionRef.current.focusToComposer();
@@ -238,15 +270,18 @@ const ChatContainerMessagesList = props => {
           e.preventDefault();
           actionRef.current.focusToComposer();
         } else {
-          var _virtualListRef$curre4;
+          var _virtualListRef$curre5;
           e.preventDefault();
-          (_virtualListRef$curre4 = virtualListRef.current) === null || _virtualListRef$curre4 === void 0 ? void 0 : _virtualListRef$curre4.focus();
+          (_virtualListRef$curre5 = virtualListRef.current) === null || _virtualListRef$curre5 === void 0 ? void 0 : _virtualListRef$curre5.focus();
         }
         break;
     }
   }, [actionRef, hasMoreItems, messages.length, onScrollStop, onlyFocus, scrollAndFocus]);
+  const checkPendingOnScroll = React.useCallback(() => {
+    if (pendingOnScroll.current === true) onScrollStop();
+  }, [onScrollStop]);
   React.useEffect(() => {
     let handlerCallback = null;
     const localVirtualRef = virtualListRef.current;
@@ -260,11 +295,13 @@ const ChatContainerMessagesList = props => {
       virtualListRef.current.addEventListener('scroll', onScroll);
     }
+    document.addEventListener('visibilitychange', checkPendingOnScroll);
     return () => {
       if (handlerCallback) clearTimeout(handlerCallback);
       if (onScrollEnds) localVirtualRef.removeEventListener('scroll', onScroll);
+      document.removeEventListener('visibilitychange', checkPendingOnScroll);
     };
-  }, [onScrollStop, onScrollEnds]);
+  }, [onScrollStop, onScrollEnds, checkPendingOnScroll]);
   const render = React.useMemo(() => virtualItems.map(virtualItem => {
     const {
       index,
@@ -285,14 +322,14 @@ const ChatContainerMessagesList = props => {
       "data-index": index,
       style: style,
       ref: measureRef,
-      tabIndex: 0,
+      tabIndex: -1,
       onKeyDown: handleKey,
       role: "listitem",
       children: /*#__PURE__*/_jsx(StyledWrapperListItem, {
         type: row.type
       }, void 0, row.type === BUBBLE_TYPES.SENDER || row.type === BUBBLE_TYPES.RECIPIENT ?
       /*#__PURE__*/
-      // eslint-disable-next-line
+      // eslint-disable-next-line eslint-comments/no-unlimited-disable
       jsx(ChatBubble, _objectSpread(_objectSpread({}, row), {}, {
         helpMessage: isSending ? sendingText : row.helpMessage
       })) : null, row.type === BUBBLE_TYPES.DELIMITER ? /*#__PURE__*/jsx(MessageDelimiter, _objectSpread({}, row)) : null, row.type === BUBBLE_TYPES.SYSTEM ? /*#__PURE__*/jsx(SystemMessage, _objectSpread({}, row)) : null)
@@ -308,7 +345,7 @@ const ChatContainerMessagesList = props => {
     onKeyDown: handleListKey,
     children: /*#__PURE__*/_jsx(StyledChatContainerContentListScroll, {
       height: "".concat(totalSize, "px")
-    }, void 0, render, !isLoading && hasMoreItems ? /*#__PURE__*/_jsx(StyledLoadMoreContainer, {
+    }, void 0, !isLoading && hasMoreItems ? /*#__PURE__*/_jsx(StyledLoadMoreContainer, {
       hasMoreItems: hasMoreItems
     }, void 0, /*#__PURE__*/_jsx(DSButton, {
       labelText: "Load More",
@@ -316,7 +353,7 @@ const ChatContainerMessagesList = props => {
       onClick: getMoreMessages,
       "data-testid": "ds-chat-load-more-btn",
       innerRef: loadMoreRef
-    })) : null)
+    })) : null, render)
   }));
 };

package/esm/parts/chat-sidebar/SideBarChat.js CHANGED Viewed

@@ -18,9 +18,9 @@ import { chatSidebarProps, defaultProps } from './props.js';
 import { useValidateProps } from './config/useValidateProps.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const FooterChat = _ref => {
   let {

package/esm/parts/sidebar-button/SidebarButton.js CHANGED Viewed

@@ -13,9 +13,9 @@ import { jsxs } from 'react/jsx-runtime';
 const _excluded = ["label", "dsId", "onClick", "Icon"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+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; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const SidebarButton = _ref => {
   let {
     label,

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-chat",
-  "version": "2.0.0",
+  "version": "2.1.0-rc.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Chat",
   "module": "./esm/index.js",
@@ -305,22 +305,22 @@
     "generateSubmodules": true
   },
   "dependencies": {
-    "@elliemae/ds-banner": "2.0.0",
-    "@elliemae/ds-button": "2.0.0",
-    "@elliemae/ds-grid": "2.0.0",
-    "@elliemae/ds-icons": "2.0.0",
-    "@elliemae/ds-indeterminate-progress-indicator": "2.0.0",
-    "@elliemae/ds-props-helpers": "2.0.0",
-    "@elliemae/ds-system": "2.0.0",
-    "@elliemae/ds-tooltip": "2.0.0",
-    "@elliemae/ds-truncated-tooltip-text": "2.0.0",
+    "@elliemae/ds-banner": "2.1.0-rc.1",
+    "@elliemae/ds-button": "2.1.0-rc.1",
+    "@elliemae/ds-grid": "2.1.0-rc.1",
+    "@elliemae/ds-icons": "2.1.0-rc.1",
+    "@elliemae/ds-indeterminate-progress-indicator": "2.1.0-rc.1",
+    "@elliemae/ds-props-helpers": "2.1.0-rc.1",
+    "@elliemae/ds-system": "2.1.0-rc.1",
+    "@elliemae/ds-tooltip": "2.1.0-rc.1",
+    "@elliemae/ds-truncated-tooltip-text": "2.1.0-rc.1",
     "prop-types": "~15.7.2",
     "react-desc": "~4.1.2",
     "react-virtual": "~2.3.2"
   },
   "devDependencies": {
     "@testing-library/dom": "~8.11.1",
-    "@testing-library/jest-dom": "~5.15.1",
+    "@testing-library/jest-dom": "~5.15.0",
     "@testing-library/react": "~12.1.2",
     "@testing-library/user-event": "~13.5.0",
     "styled-components": "~5.3.3"

package/types/parts/chat-card/ChatCard.d.ts CHANGED Viewed

@@ -6,22 +6,22 @@ declare const ChatCard: {
     propTypes: {
         title: any;
         content: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         time: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         rightAddon: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
     };
 };

package/types/parts/chat-card/props.d.ts CHANGED Viewed

@@ -3,22 +3,22 @@
 export declare const propTypes: {
     title: any;
     content: {
-        defaultValue<T = unknown>(arg: T): {
+        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
-        isRequired: import("react-desc").PropTypesDescValidator;
+        isRequired: import("react-desc").PropTypesDescValue;
     };
     time: {
-        defaultValue<T = unknown>(arg: T): {
+        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
-        isRequired: import("react-desc").PropTypesDescValidator;
+        isRequired: import("react-desc").PropTypesDescValue;
     };
     rightAddon: {
-        defaultValue<T = unknown>(arg: T): {
+        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
-        isRequired: import("react-desc").PropTypesDescValidator;
+        isRequired: import("react-desc").PropTypesDescValue;
     };
 };
 export interface CardPropTypes {

package/types/parts/chat-composer/styled.d.ts CHANGED Viewed

@@ -1,157 +1,5 @@
-/// <reference path="../../../../../../shared/typings/react-desc.d.ts" />
-/// <reference types="react" />
-export declare const StyledChatContainerContentComposer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledChatContainerContentComposer: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, object, string | number | symbol>;
 export declare const StyledComposerInput: import("styled-components").StyledComponent<"textarea", import("styled-components").DefaultTheme, any, never>;
-export declare const StyledComposerButton: import("styled-components").StyledComponent<{
-    ({ innerRef, disabled, buttonType, fluidWidth, size, labelText, icon, onBlur, onClick, onKeyPress, leftIcon, tabIndex, variant, intent, containerProps, className, as: Component, type, ...rest }: {
-        [x: string]: any;
-        innerRef: any;
-        disabled: any;
-        buttonType: any;
-        fluidWidth: any;
-        size: any;
-        labelText: any;
-        icon: any;
-        onBlur: any;
-        onClick: any;
-        onKeyPress: any;
-        leftIcon: any;
-        tabIndex: any;
-        variant: any;
-        intent: any;
-        containerProps: any;
-        className: any;
-        as: any;
-        type: any;
-    }): JSX.Element;
-    defaultProps: {
-        disabled: boolean;
-        fluidWidth: boolean;
-        labelText: string;
-        icon: null;
-        onBlur: () => null;
-        onClick: () => null;
-        onKeyPress: () => null;
-        leftIcon: null;
-        tabIndex: number;
-        variant: string;
-        containerProps: {};
-        as: string;
-        type: string;
-    };
-    propTypes: {
-        tabIndex: {
-            defaultValue<T = unknown>(arg: T): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        className: {
-            defaultValue<T_1 = unknown>(arg: T_1): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        'aria-disabled': {
-            defaultValue<T_2 = unknown>(arg: T_2): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        as: {
-            deprecated: import("react-desc").PropTypesDescValidator;
-        };
-        disabled: {
-            defaultValue<T_3 = unknown>(arg: T_3): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        fluidWidth: {
-            defaultValue<T_4 = unknown>(arg: T_4): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        labelText: {
-            defaultValue<T_5 = unknown>(arg: T_5): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        icon: {
-            defaultValue<T_6 = unknown>(arg: T_6): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        leftIcon: {
-            defaultValue<T_7 = unknown>(arg: T_7): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        buttonType: {
-            defaultValue<T_8 = unknown>(arg: T_8): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        size: {
-            defaultValue<T_9 = unknown>(arg: T_9): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        type: {
-            defaultValue<T_10 = unknown>(arg: T_10): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        variant: {
-            defaultValue<T_11 = unknown>(arg: T_11): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        innerRef: {
-            defaultValue<T_12 = unknown>(arg: T_12): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        onBlur: {
-            defaultValue<T_13 = unknown>(arg: T_13): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        intent: {
-            defaultValue<T_14 = unknown>(arg: T_14): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        containerProps: {
-            defaultValue<T_15 = unknown>(arg: T_15): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        onClick: {
-            defaultValue<T_16 = unknown>(arg: T_16): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-        onKeyPress: {
-            defaultValue<T_17 = unknown>(arg: T_17): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValidator;
-        };
-    };
-}, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledCounterArea: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledComposerButton: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, object, string | number | symbol>;
+export declare const StyledCounterArea: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, object, string | number | symbol>;
 export declare const StyledCounterErrorA11y: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;

package/types/parts/chat-container/ChatContainer.d.ts CHANGED Viewed

@@ -17,25 +17,25 @@ declare const ChatContainer: {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
         isLoading: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         hasMoreItems: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         getMoreMessages: {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
         bannerPosition: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         bannerProps: {
             deprecated: import("react-desc").PropTypesDescValidator;

package/types/parts/chat-container-messages-list/ChatContainerMessagesList.d.ts CHANGED Viewed

@@ -11,22 +11,22 @@ declare const ChatContainerMessagesList: {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
         onScrollEnds: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         isLoading: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         hasMoreItems: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         getMoreMessages: {
             deprecated: import("react-desc").PropTypesDescValidator;

package/types/parts/message-delimiter/MessageDelimiter.d.ts CHANGED Viewed

@@ -10,16 +10,16 @@ declare const MessageDelimiter: {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
         extraProps: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         verticalMargin: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
     };
 };

package/types/parts/message-delimiter/props.d.ts CHANGED Viewed

@@ -12,15 +12,15 @@ export declare const messageDelimiterProps: {
         deprecated: import("react-desc").PropTypesDescValidator;
     };
     extraProps: {
-        defaultValue<T = unknown>(arg: T): {
+        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
-        isRequired: import("react-desc").PropTypesDescValidator;
+        isRequired: import("react-desc").PropTypesDescValue;
     };
     verticalMargin: {
-        defaultValue<T = unknown>(arg: T): {
+        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
-        isRequired: import("react-desc").PropTypesDescValidator;
+        isRequired: import("react-desc").PropTypesDescValue;
     };
 };

package/types/parts/system-message/SystemMessage.d.ts CHANGED Viewed

@@ -7,10 +7,10 @@ declare const SystemMessage: {
     propTypes: {
         title: any;
         time: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
         body: any;
     };

package/types/parts/system-message/props.d.ts CHANGED Viewed

@@ -8,10 +8,10 @@ export declare const defaultProps: SystemMessageProps;
 export declare const systemMessageProps: {
     title: any;
     time: {
-        defaultValue<T = unknown>(arg: T): {
+        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
-        isRequired: import("react-desc").PropTypesDescValidator;
+        isRequired: import("react-desc").PropTypesDescValue;
     };
     body: any;
 };

package/types/parts/tile-button/TileButton.d.ts CHANGED Viewed

@@ -59,10 +59,10 @@ declare const TileButton: {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
         innerRef: {
-            defaultValue<T = unknown>(arg: T): {
+            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
                 deprecated: import("react-desc").PropTypesDescValidator;
             };
-            isRequired: import("react-desc").PropTypesDescValidator;
+            isRequired: import("react-desc").PropTypesDescValue;
         };
     };
     defaultProps: TileButtonProps;

package/types/parts/tile-button/props.d.ts CHANGED Viewed

@@ -80,9 +80,9 @@ export declare const propsTileButton: {
         deprecated: import("react-desc").PropTypesDescValidator;
     };
     innerRef: {
-        defaultValue<T = unknown>(arg: T): {
+        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
             deprecated: import("react-desc").PropTypesDescValidator;
         };
-        isRequired: import("react-desc").PropTypesDescValidator;
+        isRequired: import("react-desc").PropTypesDescValue;
     };
 };