@pega/cosmos-react-social 9.0.0-build.16.4 → 9.0.0-build.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -11,8 +11,8 @@ import TypeIndicator from './TypeIndicator';
|
|
|
11
11
|
import { StyledMessageContainer } from './Message.styles';
|
|
12
12
|
registerIcon(caretDownIcon);
|
|
13
13
|
export const NewMessageSeparatorId = 'new-message-separator';
|
|
14
|
-
const StyledMessageList = styled.
|
|
15
|
-
const StyledSession = styled.
|
|
14
|
+
const StyledMessageList = styled.div ``;
|
|
15
|
+
const StyledSession = styled.ul ``;
|
|
16
16
|
const StyledChatBody = styled.div(props => {
|
|
17
17
|
const { theme: { base: { shadow: { high: shadowHigh, focus }, colors: { white }, spacing, palette } } } = props;
|
|
18
18
|
return css `
|
|
@@ -164,7 +164,7 @@ const ChatBody = forwardRef(function ChatBody({ transcripts, liveChat, unreadMes
|
|
|
164
164
|
}), [isScrolledToLatest, scrollToLatestMessage, scrollToNewMessage]);
|
|
165
165
|
useItemIntersection(conversationRef, offset, () => {
|
|
166
166
|
loadMore?.();
|
|
167
|
-
}, ':scope >
|
|
167
|
+
}, ':scope > ul > li');
|
|
168
168
|
useEffect(() => {
|
|
169
169
|
const focusableElements = conversationRef.current?.querySelectorAll(chatFocusableSelector);
|
|
170
170
|
if (focusableElements)
|
|
@@ -184,7 +184,7 @@ const ChatBody = forwardRef(function ChatBody({ transcripts, liveChat, unreadMes
|
|
|
184
184
|
}, [verticalNav]);
|
|
185
185
|
useArrows(conversationRef, {
|
|
186
186
|
cycle: true,
|
|
187
|
-
selector: ':scope >
|
|
187
|
+
selector: ':scope > ul > li',
|
|
188
188
|
dir: 'up-down',
|
|
189
189
|
allowTabFocus: true
|
|
190
190
|
}, [transcripts, liveChat]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatBody.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatBody.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useCallback,\n useImperativeHandle,\n useLayoutEffect,\n useRef,\n useState,\n useEffect\n} from 'react';\nimport type { PropsWithoutRef, RefObject, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n debounce,\n defaultThemeProp,\n Flex,\n getFocusables,\n focusableSelector,\n Icon,\n Progress,\n registerIcon,\n StyledButton,\n useAfterInitialEffect,\n useArrows,\n useI18n,\n useItemIntersection,\n useLiveLog,\n useOuterEvent\n} from '@pega/cosmos-react-core';\nimport type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\n\nimport { isMessageListItem, isSystemMessageListItem, isTypeIndicatorListItem } from './Chat.types';\nimport type {\n ChatBodyHandleValue,\n ChatBodyListItemProps,\n ChatBodyProps,\n MessageProps\n} from './Chat.types';\nimport Message from './Message';\nimport SystemMessage, { StyledSystemMessage } from './SystemMessage';\nimport TypeIndicator from './TypeIndicator';\nimport { StyledMessageContainer } from './Message.styles';\n\nregisterIcon(caretDownIcon);\n\nexport const NewMessageSeparatorId = 'new-message-separator';\n\nconst StyledMessageList = styled.ul``;\nconst StyledSession = styled.div``;\n\nconst StyledChatBody = styled.div(props => {\n const {\n theme: {\n base: {\n shadow: { high: shadowHigh, focus },\n colors: { white },\n spacing,\n palette\n }\n }\n } = props;\n return css`\n position: relative;\n overflow-y: hidden;\n\n > ${StyledButton} {\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translate(-50%, -50%);\n box-shadow: ${shadowHigh};\n z-index: 1;\n background-color: ${white};\n }\n\n > ${StyledMessageList} {\n overflow-y: auto;\n list-style-type: none;\n height: 100%;\n\n > ${StyledSession} {\n padding-inline: 1rem;\n :not(:last-child) {\n border-block-end: 0.0625rem solid ${palette['border-line']};\n margin-block-end: ${spacing};\n padding-block-end: ${spacing};\n }\n }\n ${StyledMessageContainer}, ${StyledSystemMessage} {\n &:focus-visible {\n box-shadow: ${focus};\n outline: none;\n }\n margin-block-end: ${spacing};\n }\n }\n `;\n});\n\nStyledChatBody.defaultProps = defaultThemeProp;\n\nconst ScrollToLatest = ({\n scrollContainerRef\n}: {\n scrollContainerRef: RefObject<HTMLUListElement>;\n}) => {\n useLayoutEffect(() => {\n if (scrollContainerRef.current) {\n scrollContainerRef.current.scrollTop =\n scrollContainerRef.current.scrollHeight - scrollContainerRef.current.offsetHeight;\n }\n });\n return null;\n};\n\ninterface ChatMessageProps extends Pick<ChatBodyProps, 'renderMarkdownContent'> {\n message: ChatBodyListItemProps;\n agentSerial: RefObject<{ [agentId: string]: number }>;\n}\n\nconst ChatMessage = ({ agentSerial, message, renderMarkdownContent }: ChatMessageProps) => {\n const getAgentVariant = (\n senderId: MessageProps['senderId'],\n senderType: MessageProps['senderType'],\n direction: MessageProps['direction'] = 'in'\n ) => {\n if (agentSerial.current === null) return undefined;\n if (senderType === 'agent' && direction === 'in') {\n if (agentSerial.current[senderId] !== undefined) {\n return agentSerial.current[senderId];\n }\n\n const nextIndex = Object.entries(agentSerial.current).length;\n agentSerial.current[senderId] = nextIndex;\n return nextIndex;\n }\n return undefined;\n };\n\n if (isMessageListItem(message)) {\n const { id, senderType, direction, senderId } = message;\n const agentVariant = getAgentVariant(senderId, senderType, direction);\n return (\n <Message\n {...message}\n key={id}\n agentVariant={agentVariant}\n renderMarkdownContent={renderMarkdownContent}\n />\n );\n }\n\n if (isSystemMessageListItem(message)) {\n const extraProps: Record<string, string> = {};\n const { id } = message;\n if (id === NewMessageSeparatorId) {\n extraProps['data-new-message-separator'] = NewMessageSeparatorId;\n }\n\n return <SystemMessage {...message} key={id} {...extraProps} />;\n }\n\n if (isTypeIndicatorListItem(message)) {\n const { id, senderId, senderType } = message;\n const agentVariant = getAgentVariant(senderId, senderType);\n\n return <TypeIndicator {...message} key={id} agentVariant={agentVariant} />;\n }\n\n return null;\n};\n\nconst ChatBody: ForwardRefForwardPropsComponent<ChatBodyProps> = forwardRef(function ChatBody(\n {\n transcripts,\n liveChat,\n unreadMessageCount = 0,\n onScrollToButtonClick,\n handle,\n loading,\n offset = -1,\n loadMore,\n renderMarkdownContent,\n ...restProps\n }: PropsWithoutRef<ChatBodyProps>,\n ref: ChatBodyProps['ref']\n) {\n const t = useI18n();\n const conversationRef = useRef<HTMLUListElement>(null);\n const scrollRef = useRef(false);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const focusInMessageList = useRef(false);\n const initialMessageListFocused = useRef(false);\n const elementRef = useRef<HTMLElement | null>(null);\n const activeElementIndex = useRef(-1);\n const agentSerial = useRef<{ [agentId: string]: number }>({});\n const chatFocusableSelector = 'li[type=\"system\"],li[type=\"message\"],li[type=\"typing\"]';\n\n const [messageList, setMessageList] = useState<(HTMLLIElement | null)[]>([]);\n const [verticalNav, setVerticalNav] = useState(true);\n\n const { announcePolite } = useLiveLog();\n\n const isScrolledToLatest: ChatBodyHandleValue['isScrolledToLatest'] = useCallback(() => {\n return conversationRef.current\n ? conversationRef.current.scrollHeight -\n conversationRef.current.scrollTop -\n conversationRef.current.offsetHeight <=\n 30\n : true;\n }, [conversationRef.current]);\n\n const scrollToLatestMessage: ChatBodyHandleValue['scrollToLatestMessage'] = useCallback(() => {\n if (conversationRef.current) {\n conversationRef.current.scrollTop = conversationRef.current.scrollHeight;\n focusInMessageList.current = true;\n messageList[messageList.length - 1]?.focus();\n activeElementIndex.current = messageList.length - 1;\n }\n }, [conversationRef.current, messageList]);\n\n const [displayScrollLatest, setDisplayScrollToLatest] = useState(false);\n\n const onMessageListScroll = useCallback(() => {\n const isScrolled = isScrolledToLatest();\n if (scrollRef.current && isScrolled) {\n scrollRef.current = false;\n if (unreadMessageCount) {\n onScrollToButtonClick?.();\n }\n }\n\n if (!scrollRef.current && !isScrolled) {\n scrollRef.current = true;\n }\n\n setDisplayScrollToLatest(!isScrolled);\n }, [isScrolledToLatest(), unreadMessageCount]);\n\n const scrollToNewMessage: ChatBodyHandleValue['scrollToNewMessage'] = useCallback(() => {\n if (conversationRef.current) {\n setDisplayScrollToLatest(false);\n const newMessageIndicatorEle = conversationRef.current.querySelector<HTMLElement>(\n '[data-new-message-separator]'\n );\n if (\n newMessageIndicatorEle &&\n newMessageIndicatorEle.nextElementSibling instanceof HTMLElement\n ) {\n conversationRef.current.scrollTop = newMessageIndicatorEle.offsetTop;\n focusInMessageList.current = true;\n newMessageIndicatorEle.nextElementSibling.focus();\n activeElementIndex.current =\n messageList.findIndex(item => item?.hasAttribute('data-new-message-separator')) + 1;\n } else {\n scrollToLatestMessage();\n }\n }\n }, [conversationRef.current, messageList]);\n\n useImperativeHandle(\n handle,\n () => ({\n isScrolledToLatest,\n scrollToLatestMessage,\n scrollToNewMessage\n }),\n [isScrolledToLatest, scrollToLatestMessage, scrollToNewMessage]\n );\n\n useItemIntersection(\n conversationRef,\n offset,\n () => {\n loadMore?.();\n },\n ':scope > div > li'\n );\n\n useEffect(() => {\n const focusableElements =\n conversationRef.current?.querySelectorAll<HTMLLIElement>(chatFocusableSelector);\n\n if (focusableElements) setMessageList(Array.from(focusableElements));\n\n if (focusableElements && initialMessageListFocused.current === false) {\n activeElementIndex.current = focusableElements.length - 1;\n }\n }, [transcripts.length, liveChat.length]);\n\n useEffect(() => {\n elementRef.current = messageList[activeElementIndex.current];\n if (verticalNav) {\n elementRef.current?.focus();\n } else {\n getFocusables(elementRef)[0]?.focus();\n }\n }, [verticalNav]);\n\n useArrows(\n conversationRef,\n {\n cycle: true,\n selector: ':scope > div > li',\n dir: 'up-down',\n allowTabFocus: true\n },\n [transcripts, liveChat]\n );\n\n useArrows(\n elementRef,\n {\n cycle: true,\n selector: `li :is(${focusableSelector})`,\n dir: 'left-right',\n allowTabFocus: true\n },\n [transcripts, liveChat, verticalNav]\n );\n\n const focusSiblingElement = (currentElement: Element, isShiftKey = false) => {\n elementRef.current = currentElement as HTMLElement;\n const focusableElements = getFocusables(elementRef);\n if (focusableElements?.length > 0) {\n focusableElements?.[isShiftKey ? focusableElements.length - 1 : 0].focus();\n } else {\n const element = isShiftKey\n ? elementRef.current?.previousElementSibling\n : elementRef.current?.nextElementSibling;\n\n if (element) focusSiblingElement(element, isShiftKey);\n }\n };\n\n useOuterEvent('mousedown', [conversationRef], () => {\n focusInMessageList.current = false;\n });\n\n useAfterInitialEffect(() => {\n if (liveChat?.length > 0) {\n const unreadMessage = liveChat[liveChat.length - 1];\n if (\n isSystemMessageListItem(unreadMessage) ||\n (isMessageListItem(unreadMessage) && unreadMessage.direction === 'in')\n ) {\n announcePolite({\n message: t('new_message'),\n type: 'alert'\n });\n }\n }\n }, [liveChat]);\n\n return (\n <>\n <Flex\n {...restProps}\n as={StyledChatBody}\n item={{\n grow: 1\n }}\n container={{\n direction: 'column'\n }}\n ref={ref}\n >\n <StyledMessageList\n ref={conversationRef}\n onScroll={debounce(onMessageListScroll, 100)}\n onFocus={() => {\n if (!focusInMessageList.current) {\n initialMessageListFocused.current = true;\n elementRef.current = messageList[activeElementIndex.current];\n elementRef.current?.focus();\n focusInMessageList.current = true;\n }\n }}\n onMouseDown={(e: MouseEvent<HTMLUListElement>) => {\n focusInMessageList.current = true;\n const liElement = (e.target as HTMLElement).closest(chatFocusableSelector);\n if (liElement) {\n activeElementIndex.current = messageList.indexOf(liElement as HTMLLIElement);\n }\n }}\n onKeyDown={e => {\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n elementRef.current = messageList[activeElementIndex.current];\n if (getFocusables(elementRef).length > 0) {\n setVerticalNav(false);\n }\n } else if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n if (e.key === 'ArrowUp') {\n activeElementIndex.current =\n activeElementIndex.current === 0\n ? messageList.length - 1\n : activeElementIndex.current - 1;\n } else {\n activeElementIndex.current =\n activeElementIndex.current === messageList.length - 1\n ? 0\n : activeElementIndex.current + 1;\n }\n setVerticalNav(true);\n } else if (e.key === 'Tab') {\n e.preventDefault();\n focusInMessageList.current = false;\n if (e.shiftKey) {\n const prevElement = conversationRef?.current?.parentElement?.previousElementSibling;\n if (prevElement) focusSiblingElement(prevElement, true);\n } else if (unreadMessageCount > 0 || displayScrollLatest) {\n buttonRef?.current?.focus();\n } else {\n const nextElement = conversationRef.current?.parentElement?.nextElementSibling;\n if (nextElement) focusSiblingElement(nextElement);\n }\n }\n }}\n >\n {loading && <Progress as='li' placement='block' />}\n {transcripts.map(session => {\n return (\n <StyledSession key={session.id}>\n {session.messages.map(message => (\n <ChatMessage\n message={message}\n agentSerial={agentSerial}\n key={message.id}\n renderMarkdownContent={renderMarkdownContent}\n />\n ))}\n </StyledSession>\n );\n })}\n <StyledSession>\n {liveChat.map(message => (\n <ChatMessage\n message={message}\n agentSerial={agentSerial}\n key={message.id}\n renderMarkdownContent={renderMarkdownContent}\n />\n ))}\n </StyledSession>\n </StyledMessageList>\n {(unreadMessageCount > 0 || displayScrollLatest) && (\n <Button\n aria-label={\n unreadMessageCount > 0\n ? t('scroll_to_unread_messages')\n : t('scroll_to_latest_message')\n }\n onClick={() => {\n if (unreadMessageCount > 0) {\n scrollToNewMessage();\n } else {\n scrollToLatestMessage();\n }\n onScrollToButtonClick?.();\n }}\n icon={unreadMessageCount === 0}\n ref={buttonRef}\n >\n <Icon name='caret-down' />\n {unreadMessageCount > 0 && <> {t('new_messages')}</>}\n </Button>\n )}\n </Flex>\n {isScrolledToLatest() && <ScrollToLatest scrollContainerRef={conversationRef} />}\n </>\n );\n});\n\nexport default ChatBody;\n"]}
|
|
1
|
+
{"version":3,"file":"ChatBody.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatBody.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useCallback,\n useImperativeHandle,\n useLayoutEffect,\n useRef,\n useState,\n useEffect\n} from 'react';\nimport type { PropsWithoutRef, RefObject, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n debounce,\n defaultThemeProp,\n Flex,\n getFocusables,\n focusableSelector,\n Icon,\n Progress,\n registerIcon,\n StyledButton,\n useAfterInitialEffect,\n useArrows,\n useI18n,\n useItemIntersection,\n useLiveLog,\n useOuterEvent\n} from '@pega/cosmos-react-core';\nimport type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\n\nimport { isMessageListItem, isSystemMessageListItem, isTypeIndicatorListItem } from './Chat.types';\nimport type {\n ChatBodyHandleValue,\n ChatBodyListItemProps,\n ChatBodyProps,\n MessageProps\n} from './Chat.types';\nimport Message from './Message';\nimport SystemMessage, { StyledSystemMessage } from './SystemMessage';\nimport TypeIndicator from './TypeIndicator';\nimport { StyledMessageContainer } from './Message.styles';\n\nregisterIcon(caretDownIcon);\n\nexport const NewMessageSeparatorId = 'new-message-separator';\n\nconst StyledMessageList = styled.div``;\nconst StyledSession = styled.ul``;\n\nconst StyledChatBody = styled.div(props => {\n const {\n theme: {\n base: {\n shadow: { high: shadowHigh, focus },\n colors: { white },\n spacing,\n palette\n }\n }\n } = props;\n return css`\n position: relative;\n overflow-y: hidden;\n\n > ${StyledButton} {\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translate(-50%, -50%);\n box-shadow: ${shadowHigh};\n z-index: 1;\n background-color: ${white};\n }\n\n > ${StyledMessageList} {\n overflow-y: auto;\n list-style-type: none;\n height: 100%;\n\n > ${StyledSession} {\n padding-inline: 1rem;\n :not(:last-child) {\n border-block-end: 0.0625rem solid ${palette['border-line']};\n margin-block-end: ${spacing};\n padding-block-end: ${spacing};\n }\n }\n ${StyledMessageContainer}, ${StyledSystemMessage} {\n &:focus-visible {\n box-shadow: ${focus};\n outline: none;\n }\n margin-block-end: ${spacing};\n }\n }\n `;\n});\n\nStyledChatBody.defaultProps = defaultThemeProp;\n\nconst ScrollToLatest = ({\n scrollContainerRef\n}: {\n scrollContainerRef: RefObject<HTMLDivElement>;\n}) => {\n useLayoutEffect(() => {\n if (scrollContainerRef.current) {\n scrollContainerRef.current.scrollTop =\n scrollContainerRef.current.scrollHeight - scrollContainerRef.current.offsetHeight;\n }\n });\n return null;\n};\n\ninterface ChatMessageProps extends Pick<ChatBodyProps, 'renderMarkdownContent'> {\n message: ChatBodyListItemProps;\n agentSerial: RefObject<{ [agentId: string]: number }>;\n}\n\nconst ChatMessage = ({ agentSerial, message, renderMarkdownContent }: ChatMessageProps) => {\n const getAgentVariant = (\n senderId: MessageProps['senderId'],\n senderType: MessageProps['senderType'],\n direction: MessageProps['direction'] = 'in'\n ) => {\n if (agentSerial.current === null) return undefined;\n if (senderType === 'agent' && direction === 'in') {\n if (agentSerial.current[senderId] !== undefined) {\n return agentSerial.current[senderId];\n }\n\n const nextIndex = Object.entries(agentSerial.current).length;\n agentSerial.current[senderId] = nextIndex;\n return nextIndex;\n }\n return undefined;\n };\n\n if (isMessageListItem(message)) {\n const { id, senderType, direction, senderId } = message;\n const agentVariant = getAgentVariant(senderId, senderType, direction);\n return (\n <Message\n {...message}\n key={id}\n agentVariant={agentVariant}\n renderMarkdownContent={renderMarkdownContent}\n />\n );\n }\n\n if (isSystemMessageListItem(message)) {\n const extraProps: Record<string, string> = {};\n const { id } = message;\n if (id === NewMessageSeparatorId) {\n extraProps['data-new-message-separator'] = NewMessageSeparatorId;\n }\n\n return <SystemMessage {...message} key={id} {...extraProps} />;\n }\n\n if (isTypeIndicatorListItem(message)) {\n const { id, senderId, senderType } = message;\n const agentVariant = getAgentVariant(senderId, senderType);\n\n return <TypeIndicator {...message} key={id} agentVariant={agentVariant} />;\n }\n\n return null;\n};\n\nconst ChatBody: ForwardRefForwardPropsComponent<ChatBodyProps> = forwardRef(function ChatBody(\n {\n transcripts,\n liveChat,\n unreadMessageCount = 0,\n onScrollToButtonClick,\n handle,\n loading,\n offset = -1,\n loadMore,\n renderMarkdownContent,\n ...restProps\n }: PropsWithoutRef<ChatBodyProps>,\n ref: ChatBodyProps['ref']\n) {\n const t = useI18n();\n const conversationRef = useRef<HTMLDivElement>(null);\n const scrollRef = useRef(false);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const focusInMessageList = useRef(false);\n const initialMessageListFocused = useRef(false);\n const elementRef = useRef<HTMLElement | null>(null);\n const activeElementIndex = useRef(-1);\n const agentSerial = useRef<{ [agentId: string]: number }>({});\n const chatFocusableSelector = 'li[type=\"system\"],li[type=\"message\"],li[type=\"typing\"]';\n\n const [messageList, setMessageList] = useState<(HTMLLIElement | null)[]>([]);\n const [verticalNav, setVerticalNav] = useState(true);\n\n const { announcePolite } = useLiveLog();\n\n const isScrolledToLatest: ChatBodyHandleValue['isScrolledToLatest'] = useCallback(() => {\n return conversationRef.current\n ? conversationRef.current.scrollHeight -\n conversationRef.current.scrollTop -\n conversationRef.current.offsetHeight <=\n 30\n : true;\n }, [conversationRef.current]);\n\n const scrollToLatestMessage: ChatBodyHandleValue['scrollToLatestMessage'] = useCallback(() => {\n if (conversationRef.current) {\n conversationRef.current.scrollTop = conversationRef.current.scrollHeight;\n focusInMessageList.current = true;\n messageList[messageList.length - 1]?.focus();\n activeElementIndex.current = messageList.length - 1;\n }\n }, [conversationRef.current, messageList]);\n\n const [displayScrollLatest, setDisplayScrollToLatest] = useState(false);\n\n const onMessageListScroll = useCallback(() => {\n const isScrolled = isScrolledToLatest();\n if (scrollRef.current && isScrolled) {\n scrollRef.current = false;\n if (unreadMessageCount) {\n onScrollToButtonClick?.();\n }\n }\n\n if (!scrollRef.current && !isScrolled) {\n scrollRef.current = true;\n }\n\n setDisplayScrollToLatest(!isScrolled);\n }, [isScrolledToLatest(), unreadMessageCount]);\n\n const scrollToNewMessage: ChatBodyHandleValue['scrollToNewMessage'] = useCallback(() => {\n if (conversationRef.current) {\n setDisplayScrollToLatest(false);\n const newMessageIndicatorEle = conversationRef.current.querySelector<HTMLElement>(\n '[data-new-message-separator]'\n );\n if (\n newMessageIndicatorEle &&\n newMessageIndicatorEle.nextElementSibling instanceof HTMLElement\n ) {\n conversationRef.current.scrollTop = newMessageIndicatorEle.offsetTop;\n focusInMessageList.current = true;\n newMessageIndicatorEle.nextElementSibling.focus();\n activeElementIndex.current =\n messageList.findIndex(item => item?.hasAttribute('data-new-message-separator')) + 1;\n } else {\n scrollToLatestMessage();\n }\n }\n }, [conversationRef.current, messageList]);\n\n useImperativeHandle(\n handle,\n () => ({\n isScrolledToLatest,\n scrollToLatestMessage,\n scrollToNewMessage\n }),\n [isScrolledToLatest, scrollToLatestMessage, scrollToNewMessage]\n );\n\n useItemIntersection(\n conversationRef,\n offset,\n () => {\n loadMore?.();\n },\n ':scope > ul > li'\n );\n\n useEffect(() => {\n const focusableElements =\n conversationRef.current?.querySelectorAll<HTMLLIElement>(chatFocusableSelector);\n\n if (focusableElements) setMessageList(Array.from(focusableElements));\n\n if (focusableElements && initialMessageListFocused.current === false) {\n activeElementIndex.current = focusableElements.length - 1;\n }\n }, [transcripts.length, liveChat.length]);\n\n useEffect(() => {\n elementRef.current = messageList[activeElementIndex.current];\n if (verticalNav) {\n elementRef.current?.focus();\n } else {\n getFocusables(elementRef)[0]?.focus();\n }\n }, [verticalNav]);\n\n useArrows(\n conversationRef,\n {\n cycle: true,\n selector: ':scope > ul > li',\n dir: 'up-down',\n allowTabFocus: true\n },\n [transcripts, liveChat]\n );\n\n useArrows(\n elementRef,\n {\n cycle: true,\n selector: `li :is(${focusableSelector})`,\n dir: 'left-right',\n allowTabFocus: true\n },\n [transcripts, liveChat, verticalNav]\n );\n\n const focusSiblingElement = (currentElement: Element, isShiftKey = false) => {\n elementRef.current = currentElement as HTMLElement;\n const focusableElements = getFocusables(elementRef);\n if (focusableElements?.length > 0) {\n focusableElements?.[isShiftKey ? focusableElements.length - 1 : 0].focus();\n } else {\n const element = isShiftKey\n ? elementRef.current?.previousElementSibling\n : elementRef.current?.nextElementSibling;\n\n if (element) focusSiblingElement(element, isShiftKey);\n }\n };\n\n useOuterEvent('mousedown', [conversationRef], () => {\n focusInMessageList.current = false;\n });\n\n useAfterInitialEffect(() => {\n if (liveChat?.length > 0) {\n const unreadMessage = liveChat[liveChat.length - 1];\n if (\n isSystemMessageListItem(unreadMessage) ||\n (isMessageListItem(unreadMessage) && unreadMessage.direction === 'in')\n ) {\n announcePolite({\n message: t('new_message'),\n type: 'alert'\n });\n }\n }\n }, [liveChat]);\n\n return (\n <>\n <Flex\n {...restProps}\n as={StyledChatBody}\n item={{\n grow: 1\n }}\n container={{\n direction: 'column'\n }}\n ref={ref}\n >\n <StyledMessageList\n ref={conversationRef}\n onScroll={debounce(onMessageListScroll, 100)}\n onFocus={() => {\n if (!focusInMessageList.current) {\n initialMessageListFocused.current = true;\n elementRef.current = messageList[activeElementIndex.current];\n elementRef.current?.focus();\n focusInMessageList.current = true;\n }\n }}\n onMouseDown={(e: MouseEvent<HTMLDivElement>) => {\n focusInMessageList.current = true;\n const liElement = (e.target as HTMLElement).closest(chatFocusableSelector);\n if (liElement) {\n activeElementIndex.current = messageList.indexOf(liElement as HTMLLIElement);\n }\n }}\n onKeyDown={e => {\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n elementRef.current = messageList[activeElementIndex.current];\n if (getFocusables(elementRef).length > 0) {\n setVerticalNav(false);\n }\n } else if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n if (e.key === 'ArrowUp') {\n activeElementIndex.current =\n activeElementIndex.current === 0\n ? messageList.length - 1\n : activeElementIndex.current - 1;\n } else {\n activeElementIndex.current =\n activeElementIndex.current === messageList.length - 1\n ? 0\n : activeElementIndex.current + 1;\n }\n setVerticalNav(true);\n } else if (e.key === 'Tab') {\n e.preventDefault();\n focusInMessageList.current = false;\n if (e.shiftKey) {\n const prevElement = conversationRef?.current?.parentElement?.previousElementSibling;\n if (prevElement) focusSiblingElement(prevElement, true);\n } else if (unreadMessageCount > 0 || displayScrollLatest) {\n buttonRef?.current?.focus();\n } else {\n const nextElement = conversationRef.current?.parentElement?.nextElementSibling;\n if (nextElement) focusSiblingElement(nextElement);\n }\n }\n }}\n >\n {loading && <Progress as='li' placement='block' />}\n {transcripts.map(session => {\n return (\n <StyledSession key={session.id}>\n {session.messages.map(message => (\n <ChatMessage\n message={message}\n agentSerial={agentSerial}\n key={message.id}\n renderMarkdownContent={renderMarkdownContent}\n />\n ))}\n </StyledSession>\n );\n })}\n <StyledSession>\n {liveChat.map(message => (\n <ChatMessage\n message={message}\n agentSerial={agentSerial}\n key={message.id}\n renderMarkdownContent={renderMarkdownContent}\n />\n ))}\n </StyledSession>\n </StyledMessageList>\n {(unreadMessageCount > 0 || displayScrollLatest) && (\n <Button\n aria-label={\n unreadMessageCount > 0\n ? t('scroll_to_unread_messages')\n : t('scroll_to_latest_message')\n }\n onClick={() => {\n if (unreadMessageCount > 0) {\n scrollToNewMessage();\n } else {\n scrollToLatestMessage();\n }\n onScrollToButtonClick?.();\n }}\n icon={unreadMessageCount === 0}\n ref={buttonRef}\n >\n <Icon name='caret-down' />\n {unreadMessageCount > 0 && <> {t('new_messages')}</>}\n </Button>\n )}\n </Flex>\n {isScrolledToLatest() && <ScrollToLatest scrollContainerRef={conversationRef} />}\n </>\n );\n});\n\nexport default ChatBody;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-social",
|
|
3
|
-
"version": "9.0.0-build.
|
|
3
|
+
"version": "9.0.0-build.17.0",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE",
|
|
5
5
|
"author": "Pegasystems",
|
|
6
6
|
"sideEffects": [
|
|
@@ -17,9 +17,9 @@
|
|
|
17
17
|
"build": "tsc -b tsconfig.build.json"
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
|
-
"@pega/cosmos-react-core": "9.0.0-build.
|
|
21
|
-
"@pega/cosmos-react-rte": "9.0.0-build.
|
|
22
|
-
"@pega/cosmos-react-work": "9.0.0-build.
|
|
20
|
+
"@pega/cosmos-react-core": "9.0.0-build.17.0",
|
|
21
|
+
"@pega/cosmos-react-rte": "9.0.0-build.17.0",
|
|
22
|
+
"@pega/cosmos-react-work": "9.0.0-build.17.0",
|
|
23
23
|
"@types/parse5": "^6.0.0",
|
|
24
24
|
"@types/react": "^17.0.62 || ^18.3.3",
|
|
25
25
|
"@types/react-dom": "^17.0.20 || ^18.3.0",
|