npm - @pega/cosmos-react-social - Versions diffs - 5.0.0-dev.1.0 → 5.0.0-dev.10.1 - Mend

@pega/cosmos-react-social 5.0.0-dev.1.0 → 5.0.0-dev.10.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 (187) hide show

package/lib/components/Chat/ChatComposer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatComposer.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatComposer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n Ref,\n PropsWithoutRef,\n ReactNode,\n useState,\n useEffect,\n useCallback,\n ChangeEvent,\n useImperativeHandle,\n useRef,\n RefObject,\n KeyboardEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Flex,\n TextArea,\n Button,\n Icon,\n registerIcon,\n Popover,\n EmojiPicker,\n EmojiPickerProps,\n hasProp,\n useI18n,\n useElement,\n defaultThemeProp,\n PropsWithDefaults,\n ForwardProps,\n Tooltip,\n useOuterEvent,\n VisuallyHiddenText,\n FileUploadItem,\n FileUploadItemProps,\n Grid\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as faceHappyIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/face-happy.icon';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\n\nregisterIcon(timesIcon, faceHappyIcon, paperClipIcon);\n\nexport type SpecialKeysConfig = {\n /** Collection of specialKeys /\n keys: string[];\n /* onSpecialKey is fired when a special key is typed in Textarea /\n onSpecialKey: (e: KeyboardEvent<HTMLTextAreaElement>, key: string) => void;\n};\n\nexport interface ChatComposerProps {\n /* Place holder /\n placeholder?: string;\n /* Default message to populate on load /\n defaultMessage?: string;\n /* Max character limit /\n maxLength?: number;\n /* Callback when send button is clicked /\n onSend: (message: string) => void;\n /* Enter / Return key sends message /\n enterKeySendsMessage?: boolean;\n /* Max number of attachments to be allowed in chat composer.\n * If zero is passed, add attachments icon will be hidden. same rule applies if prop is not passed.\n * If attachments added are >= maxAttachments, add attachments icon will be disabled.\n /\n maxAttachments?: number;\n /* show/hide emoji /\n showEmoji?: boolean;\n /* Attachments list /\n attachments?: FileUploadItemProps[];\n /* Callback when attachment icon is clicked /\n onAddAttachment?: () => void;\n /* Special Keys configuration /\n specialKeysConfig?: SpecialKeysConfig;\n /* Disables the composer area /\n disabled?: boolean;\n /* Children /\n children?: ReactNode;\n /* Ref to the Imperative handle /\n ref?: Ref<ChatComposerImperativeHandleProps>;\n}\n\nconst StyledAttachmentItem = styled(FileUploadItem)``;\n\ninterface DisableAttachmentProps {\n disabled?: boolean;\n}\nconst StyledAttachmentElementContainer = styled.div<DisableAttachmentProps>(\n ({ disabled, theme }) => {\n return (\n disabled &&\n css`\n &:focus {\n box-shadow: ${theme.base.shadow.focus};\n border-radius: 50%;\n outline: none;\n }\n `\n );\n }\n);\nconst StyledPreviewButton = styled(BareButton)``;\nconst StyledDeleteButton = styled(BareButton)``;\n\nconst StyledChatComposer = styled.footer<PropsWithDefaults<ChatComposerProps, 'disabled'>>(\n ({\n theme,\n disabled,\n theme: {\n base: { 'disabled-opacity': transparentBg, spacing }\n }\n }) => {\n return css`\n padding: calc(2 ${spacing});\n background-color: ${theme.base.palette['secondary-background']};\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n textarea {\n border-radius: ${theme.base['border-radius']};\n height: 5rem;\n border: 0.0625rem solid ${theme.base.colors.gray['extra-light']};\n max-width: 100%;\n }\n ${StyledAttachmentItem} {\n ${disabled &&\n css`\n pointer-events: none;\n opacity: ${transparentBg};\n `}\n }\n\n ${StyledAttachmentElementContainer} {\n ${disabled &&\n css`\n pointer-events: none;\n `}\n }\n\n ${StyledPreviewButton} {\n color: ${theme.base.palette.interactive};\n font-weight: bold;\n &:hover {\n text-decoration: underline;\n }\n }\n\n ${StyledDeleteButton} {\n color: ${theme.base.palette.interactive};\n }\n `;\n }\n);\n\nStyledChatComposer.defaultProps = defaultThemeProp;\nStyledAttachmentElementContainer.defaultProps = defaultThemeProp;\n\nexport const StyledAttachmentsListContainer = styled.div(({ theme }) => {\n return css`\n max-height: 5rem;\n overflow-y: auto;\n\n &:focus-within {\n box-shadow: ${theme.base.shadow['focus-group']};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n }\n `;\n});\n\nexport interface ChatComposerImperativeHandleProps {\n /** Function to append a message /\n appendToMessage: (\n appendMessage: string,\n position?: 'cursor' \| 'start' \| 'end' \| 'specialKey'\n ) => void;\n /* Actual ref to Chat composer component */\n chatComposerRef: RefObject<HTMLDivElement \| undefined>;\n textAreaRef: RefObject<HTMLTextAreaElement \| undefined>;\n}\n\nconst ChatComposer: FunctionComponent<ChatComposerProps & ForwardProps> = forwardRef(\n function ChatComposer(props: PropsWithoutRef<ChatComposerProps>, ref: ChatComposerProps['ref']) {\n const {\n children,\n attachments = [],\n maxAttachments = 0,\n onAddAttachment,\n maxLength,\n placeholder: defaultPlaceHolder,\n defaultMessage = '',\n onSend,\n specialKeysConfig,\n disabled = false,\n enterKeySendsMessage = true,\n showEmoji,\n ...restProps\n } = props;\n const [message, setMessage] = useState(defaultMessage);\n useEffect(() => {\n setMessage(defaultMessage);\n }, [defaultMessage]);\n\n const t = useI18n();\n\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n const [showEmojiPicker, setShowEmojiPicker] = useState(false);\n const [emojiBtnEl, setEmojiBtnEl] = useElement();\n const [attachmentsBtnEl, setAttachmentsBtnEl] = useElement();\n const [announcement, setAnnouncement] = useState('');\n\n const lastEnteredSpecialKey = useRef<string \| null>(null);\n\n const appendToMessage = useCallback(\n (\n appendMessage: string,\n position?: 'cursor' \| 'start' \| 'end' \| 'specialKey',\n selectText: boolean = true\n ) => {\n let selectionStart;\n let selectionEnd;\n if (textAreaRef.current) {\n if (position === 'start') {\n textAreaRef.current.value = appendMessage + textAreaRef.current.value;\n selectionStart = 0;\n selectionEnd = appendMessage.length;\n } else if (position === 'end') {\n const initialEnd = textAreaRef.current.value.length;\n textAreaRef.current.value += appendMessage;\n selectionStart = initialEnd;\n selectionEnd = initialEnd + appendMessage.length;\n } else if (position === 'specialKey' && lastEnteredSpecialKey.current) {\n const replaceChars = lastEnteredSpecialKey.current.length;\n const currentSelectionStart = textAreaRef.current.selectionStart;\n textAreaRef.current.value =\n textAreaRef.current.value.substring(\n 0,\n textAreaRef.current.selectionStart - replaceChars\n ) +\n appendMessage +\n textAreaRef.current.value.substring(\n textAreaRef.current.selectionStart,\n textAreaRef.current.value.length\n );\n selectionStart = currentSelectionStart - replaceChars;\n selectionEnd = currentSelectionStart + appendMessage.length - replaceChars;\n lastEnteredSpecialKey.current = null;\n } else {\n const currentSelectionStart = textAreaRef.current.selectionStart;\n textAreaRef.current.value =\n textAreaRef.current.value.substring(0, textAreaRef.current.selectionStart) +\n appendMessage +\n textAreaRef.current.value.substring(\n textAreaRef.current.selectionStart,\n textAreaRef.current.value.length\n );\n selectionStart = currentSelectionStart;\n selectionEnd = currentSelectionStart + appendMessage.length;\n }\n textAreaRef.current.selectionStart = selectText ? selectionStart : selectionEnd;\n textAreaRef.current.selectionEnd = selectionEnd;\n textAreaRef.current.focus();\n setMessage(textAreaRef.current.value);\n }\n },\n [setMessage, textAreaRef.current]\n );\n\n const chatComposerRef = useRef<HTMLDivElement>(null);\n\n useImperativeHandle(ref, () => ({ appendToMessage, chatComposerRef, textAreaRef }), [\n appendToMessage,\n chatComposerRef.current,\n textAreaRef.current\n ]);\n\n const sendMessage = useCallback(\n (newMessage: string) => {\n if (onSend) {\n onSend(newMessage);\n setMessage('');\n }\n },\n [onSend]\n );\n\n const handleEnterKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (enterKeySendsMessage && e.keyCode === 13 && !e.shiftKey) {\n if (!maxLength \|\| message.length <= maxLength) {\n sendMessage(message);\n setAnnouncement(t('message_sent'));\n }\n e.preventDefault();\n e.stopPropagation();\n }\n },\n [onSend, message, maxLength]\n );\n\n const handleTextAreaChange = useCallback(\n (e: ChangeEvent<HTMLTextAreaElement>) => {\n setMessage(e.currentTarget.value);\n setAnnouncement('');\n },\n [setMessage]\n );\n\n const handleSpecialKey = useCallback(\n (e: KeyboardEvent<HTMLTextAreaElement>) => {\n if (!specialKeysConfig) return;\n const { keys, onSpecialKey } = specialKeysConfig;\n if (specialKeysConfig && keys.length > 0) {\n const composerValue = e.currentTarget.value.substring(0, e.currentTarget.selectionStart);\n const specialKey = keys.find(key => composerValue.endsWith(key));\n if (specialKey) {\n lastEnteredSpecialKey.current = specialKey;\n onSpecialKey(e, specialKey);\n }\n }\n },\n [specialKeysConfig]\n );\n\n const toggleEmoji = () => {\n setShowEmojiPicker(!showEmojiPicker);\n };\n const onEmojiSelect: EmojiPickerProps['onSelect'] = emojiElem => {\n // Check that it is not a custom emoji\n if (hasProp(emojiElem, 'native')) {\n appendToMessage(emojiElem.native, 'cursor', false);\n }\n setShowEmojiPicker(false);\n };\n\n const EmojiPickerRef = useRef<HTMLDivElement>(null);\n\n useOuterEvent('mousedown', [emojiBtnEl, EmojiPickerRef], () => {\n setShowEmojiPicker(false);\n });\n\n return (\n <>\n <Flex\n as={StyledChatComposer}\n disabled={disabled}\n container={{\n direction: 'column',\n gap: 2\n }}\n item={{\n shrink: 0\n }}\n {...restProps}\n ref={chatComposerRef}\n >\n <Flex\n container={{\n direction: 'column',\n gap: 0.5\n }}\n >\n <Grid\n container={{\n cols: 'repeat(auto-fill, minmax(12rem, 1fr))',\n gap: 1\n }}\n role='group'\n aria-label={`${t('attachments')}`}\n as={StyledAttachmentsListContainer}\n >\n {attachments.map((attachment, idx) => {\n if (disabled) {\n const attachmentProps = {\n ...attachment,\n onDelete: undefined,\n onDownload: undefined,\n onPreview: undefined,\n onEdit: undefined,\n onCancel: undefined\n };\n return <StyledAttachmentItem {...attachmentProps} key={attachmentProps.name} />;\n }\n return (\n <div\n aria-label={`${t('attachments_x_of_y', [idx + 1, attachments.length])}`}\n key={attachment.name}\n >\n <StyledAttachmentItem {...attachment} />\n </div>\n );\n })}\n </Grid>\n <TextArea\n ref={textAreaRef}\n maxLength={maxLength}\n displayCharCount={maxLength !== undefined}\n hardStop={false}\n placeholder={defaultPlaceHolder}\n value={message}\n disabled={disabled}\n onKeyUp={handleSpecialKey}\n onKeyDown={handleEnterKeyDown}\n onChange={handleTextAreaChange}\n onFocus={handleTextAreaChange}\n aria-label={t('enter_message')}\n autoResize={false}\n />\n </Flex>\n <Flex container={{ gap: 0.5 }}>\n {showEmoji && (\n <Button\n ref={setEmojiBtnEl}\n onClick={toggleEmoji}\n variant='simple'\n disabled={disabled}\n icon\n aria-label={t('add_emoji')}\n >\n <Icon name='face-happy' />\n </Button>\n )}\n {maxAttachments > 0 && (\n <StyledAttachmentElementContainer\n disabled={attachments.length >= maxAttachments}\n ref={setAttachmentsBtnEl}\n tabIndex={attachments.length >= maxAttachments ? 0 : undefined}\n role='button'\n >\n <Button\n onClick={onAddAttachment}\n variant='simple'\n disabled={!!(disabled \|\| attachments.length >= maxAttachments)}\n icon\n aria-label={\n attachments.length >= maxAttachments\n ? t('email_disable_attachment', [maxAttachments])\n : t('email_add_attachment', [maxAttachments])\n }\n >\n <Icon name='paper-clip' />\n </Button>\n {attachments.length >= maxAttachments && (\n <Tooltip\n target={attachmentsBtnEl}\n showDelay='none'\n hideDelay='none'\n {...restProps}\n >\n {t('email_disable_attachment', [maxAttachments])}\n </Tooltip>\n )}\n </StyledAttachmentElementContainer>\n )}\n <Flex item={{ grow: 1 }}>{children}</Flex>\n <Button\n variant='primary'\n disabled={disabled \|\| (!!maxLength && message.length > maxLength)}\n onClick={() => {\n sendMessage(message);\n setAnnouncement(t('message_sent'));\n }}\n >\n {t('send')}\n </Button>\n {announcement && (\n <VisuallyHiddenText aria-live='assertive'>{announcement}</VisuallyHiddenText>\n )}\n </Flex>\n </Flex>\n <Popover\n show={showEmojiPicker}\n target={emojiBtnEl}\n placement='top-start'\n modifiers={[\n {\n name: 'flip',\n enabled: true\n }\n ]}\n >\n <EmojiPicker ref={EmojiPickerRef} onSelect={onEmojiSelect} />\n </Popover>\n </>\n );\n }\n);\n\nexport default ChatComposer;\n"]}
1	+ {"version":3,"file":"ChatComposer.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatComposer.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAUlG,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,WAAW,EACX,OAAO,EACP,OAAO,EACP,UAAU,EACV,gBAAgB,EAChB,OAAO,EACP,aAAa,EACb,kBAAkB,EAClB,cAAc,EACd,IAAI,EACJ,QAAQ,EACT,MAAM,yBAAyB,CAAC;AAOjC,OAAO,UAAU,MAAM,0DAA0D,CAAC;AAClF,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAC1F,OAAO,KAAK,aAAa,MAAM,mEAAmE,CAAC;AACnG,OAAO,KAAK,aAAa,MAAM,mEAAmE,CAAC;AAEnG,YAAY,CAAC,SAAS,EAAE,aAAa,EAAE,aAAa,CAAC,CAAC;AAgDtD,MAAM,oBAAoB,GAAG,MAAM,CAAC,cAAc,CAAC,CAAA,EAAE,CAAC;AAKtD,MAAM,gCAAgC,GAAG,MAAM,CAAC,GAAG,CACjD,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE;IACtB,OAAO,CACL,QAAQ;QACR,GAAG,CAAA;;wBAEe,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;;;OAIxC,CACF,CAAC;AACJ,CAAC,CACF,CAAC;AACF,MAAM,mBAAmB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA,EAAE,CAAC;AACjD,MAAM,kBAAkB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA,EAAE,CAAC;AAEhD,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CACtC,CAAC,EACC,KAAK,EACL,QAAQ,EACR,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,kBAAkB,EAAE,aAAa,EAAE,OAAO,EAAE,EACrD,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;0BACY,OAAO;0BACP,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,sBAAsB,CAAC;;;;yBAI3C,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;kCAElB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC;;;QAG/D,oBAAoB;UAClB,QAAQ;QACV,GAAG,CAAA;;qBAEU,aAAa;SACzB;;;QAGD,gCAAgC;UAC9B,QAAQ;QACV,GAAG,CAAA;;SAEF;;;QAGD,mBAAmB;iBACV,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW;;;;;;;QAOvC,kBAAkB;iBACT,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW;;KAE1C,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AACnD,gCAAgC,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjE,MAAM,CAAC,MAAM,8BAA8B,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACrE,OAAO,GAAG,CAAA;;;;;oBAKQ,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;kCAClB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;GAE1D,CAAC;AACJ,CAAC,CAAC,CAAC;AAaH,MAAM,YAAY,GAAwD,UAAU,CAClF,SAAS,YAAY,CAAC,KAAyC,EAAE,GAA6B;IAC5F,MAAM,EACJ,QAAQ,EACR,WAAW,GAAG,EAAE,EAChB,cAAc,GAAG,CAAC,EAClB,eAAe,EACf,SAAS,EACT,WAAW,EAAE,kBAAkB,EAC/B,cAAc,GAAG,EAAE,EACnB,MAAM,EACN,iBAAiB,EACjB,QAAQ,GAAG,KAAK,EAChB,oBAAoB,GAAG,IAAI,EAC3B,SAAS,EACT,mBAAmB,EACnB,mBAAmB,GAAG,KAAK,EAC3B,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,cAAc,CAAC,CAAC;IACvD,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,cAAc,CAAC,CAAC;IAC7B,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,WAAW,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IACtD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,UAAU,EAAE,CAAC;IACjD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,UAAU,EAAE,CAAC;IAC7D,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAErD,MAAM,qBAAqB,GAAG,MAAM,CAAgB,IAAI,CAAC,CAAC;IAE1D,MAAM,eAAe,GAAG,WAAW,CACjC,CACE,aAAqB,EACrB,QAAoD,EACpD,aAAsB,IAAI,EAC1B,EAAE;QACF,IAAI,cAAc,CAAC;QACnB,IAAI,YAAY,CAAC;QACjB,IAAI,WAAW,CAAC,OAAO,EAAE;YACvB,IAAI,QAAQ,KAAK,OAAO,EAAE;gBACxB,WAAW,CAAC,OAAO,CAAC,KAAK,GAAG,aAAa,GAAG,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC;gBACtE,cAAc,GAAG,CAAC,CAAC;gBACnB,YAAY,GAAG,aAAa,CAAC,MAAM,CAAC;aACrC;iBAAM,IAAI,QAAQ,KAAK,KAAK,EAAE;gBAC7B,MAAM,UAAU,GAAG,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC;gBACpD,WAAW,CAAC,OAAO,CAAC,KAAK,IAAI,aAAa,CAAC;gBAC3C,cAAc,GAAG,UAAU,CAAC;gBAC5B,YAAY,GAAG,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC;aAClD;iBAAM,IAAI,QAAQ,KAAK,YAAY,IAAI,qBAAqB,CAAC,OAAO,EAAE;gBACrE,MAAM,YAAY,GAAG,qBAAqB,CAAC,OAAO,CAAC,MAAM,CAAC;gBAC1D,MAAM,qBAAqB,GAAG,WAAW,CAAC,OAAO,CAAC,cAAc,CAAC;gBACjE,WAAW,CAAC,OAAO,CAAC,KAAK;oBACvB,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CACjC,CAAC,EACD,WAAW,CAAC,OAAO,CAAC,cAAc,GAAG,YAAY,CAClD;wBACD,aAAa;wBACb,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CACjC,WAAW,CAAC,OAAO,CAAC,cAAc,EAClC,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CACjC,CAAC;gBACJ,cAAc,GAAG,qBAAqB,GAAG,YAAY,CAAC;gBACtD,YAAY,GAAG,qBAAqB,GAAG,aAAa,CAAC,MAAM,GAAG,YAAY,CAAC;gBAC3E,qBAAqB,CAAC,OAAO,GAAG,IAAI,CAAC;aACtC;iBAAM;gBACL,MAAM,qBAAqB,GAAG,WAAW,CAAC,OAAO,CAAC,cAAc,CAAC;gBACjE,WAAW,CAAC,OAAO,CAAC,KAAK;oBACvB,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,cAAc,CAAC;wBAC1E,aAAa;wBACb,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CACjC,WAAW,CAAC,OAAO,CAAC,cAAc,EAClC,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CACjC,CAAC;gBACJ,cAAc,GAAG,qBAAqB,CAAC;gBACvC,YAAY,GAAG,qBAAqB,GAAG,aAAa,CAAC,MAAM,CAAC;aAC7D;YACD,WAAW,CAAC,OAAO,CAAC,cAAc,GAAG,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC;YAChF,WAAW,CAAC,OAAO,CAAC,YAAY,GAAG,YAAY,CAAC;YAChD,WAAW,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;YAC5B,UAAU,CAAC,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;SACvC;IACH,CAAC,EACD,CAAC,UAAU,EAAE,WAAW,CAAC,OAAO,CAAC,CAClC,CAAC;IAEF,MAAM,eAAe,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAErD,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,eAAe,EAAE,eAAe,EAAE,WAAW,EAAE,CAAC,EAAE;QAClF,eAAe;QACf,eAAe,CAAC,OAAO;QACvB,WAAW,CAAC,OAAO;KACpB,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,WAAW,CAC7B,CAAC,UAAkB,EAAE,EAAE;QACrB,IAAI,MAAM,EAAE;YACV,MAAM,CAAC,UAAU,CAAC,CAAC;YACnB,UAAU,CAAC,EAAE,CAAC,CAAC;SAChB;IACH,CAAC,EACD,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,MAAM,kBAAkB,GAAG,WAAW,CACpC,CAAC,CAAgB,EAAE,EAAE;QACnB,IAAI,oBAAoB,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,CAAC,QAAQ,EAAE;YAC5D,IAAI,CAAC,SAAS,IAAI,OAAO,CAAC,MAAM,IAAI,SAAS,EAAE;gBAC7C,WAAW,CAAC,OAAO,CAAC,CAAC;gBACrB,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC;aACpC;YACD,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAC;SACrB;IACH,CAAC,EACD,CAAC,MAAM,EAAE,OAAO,EAAE,SAAS,CAAC,CAC7B,CAAC;IAEF,MAAM,oBAAoB,GAAG,WAAW,CACtC,CAAC,CAAmC,EAAE,EAAE;QACtC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAClC,eAAe,CAAC,EAAE,CAAC,CAAC;IACtB,CAAC,EACD,CAAC,UAAU,CAAC,CACb,CAAC;IAEF,MAAM,gBAAgB,GAAG,WAAW,CAClC,CAAC,CAAqC,EAAE,EAAE;QACxC,IAAI,CAAC,iBAAiB;YAAE,OAAO;QAC/B,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,GAAG,iBAAiB,CAAC;QACjD,IAAI,iBAAiB,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;YACxC,MAAM,aAAa,GAAG,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;YACzF,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;YACjE,IAAI,UAAU,EAAE;gBACd,qBAAqB,CAAC,OAAO,GAAG,UAAU,CAAC;gBAC3C,YAAY,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC;aAC7B;SACF;IACH,CAAC,EACD,CAAC,iBAAiB,CAAC,CACpB,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,kBAAkB,CAAC,CAAC,eAAe,CAAC,CAAC;IACvC,CAAC,CAAC;IACF,MAAM,aAAa,GAAiC,SAAS,CAAC,EAAE;QAC9D,sCAAsC;QACtC,IAAI,OAAO,CAAC,SAAS,EAAE,QAAQ,CAAC,EAAE;YAChC,eAAe,CAAC,SAAS,CAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;SACpD;QACD,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEpD,aAAa,CAAC,WAAW,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC,EAAE,GAAG,EAAE;QAC5D,kBAAkB,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC,CAAC,CAAC;IAEH,OAAO,CACL,8BACE,MAAC,IAAI,IACH,EAAE,EAAE,kBAAkB,EACtB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE;oBACT,SAAS,EAAE,QAAQ;oBACnB,GAAG,EAAE,CAAC;iBACP,EACD,IAAI,EAAE;oBACJ,MAAM,EAAE,CAAC;iBACV,KACG,SAAS,EACb,GAAG,EAAE,eAAe,aAEpB,MAAC,IAAI,IACH,SAAS,EAAE;4BACT,SAAS,EAAE,QAAQ;4BACnB,GAAG,EAAE,GAAG;yBACT,aAED,KAAC,IAAI,IACH,SAAS,EAAE;oCACT,IAAI,EAAE,uCAAuC;oCAC7C,GAAG,EAAE,CAAC;iCACP,EACD,IAAI,EAAC,OAAO,gBACA,GAAG,CAAC,CAAC,aAAa,CAAC,EAAE,EACjC,EAAE,EAAE,8BAA8B,YAEjC,WAAW,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,GAAG,EAAE,EAAE;oCACnC,IAAI,QAAQ,EAAE;wCACZ,MAAM,eAAe,GAAG;4CACtB,GAAG,UAAU;4CACb,QAAQ,EAAE,SAAS;4CACnB,UAAU,EAAE,SAAS;4CACrB,SAAS,EAAE,SAAS;4CACpB,MAAM,EAAE,SAAS;4CACjB,QAAQ,EAAE,SAAS;yCACpB,CAAC;wCACF,OAAO,eAAC,oBAAoB,OAAK,eAAe,EAAE,GAAG,EAAE,eAAe,CAAC,IAAI,GAAI,CAAC;qCACjF;oCACD,OAAO,CACL,4BACc,GAAG,CAAC,CAAC,oBAAoB,EAAE,CAAC,GAAG,GAAG,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC,EAAE,YAGvE,KAAC,oBAAoB,OAAK,UAAU,GAAI,IAFnC,UAAU,CAAC,IAAI,CAGhB,CACP,CAAC;gCACJ,CAAC,CAAC,GACG,EACP,KAAC,QAAQ,IACP,GAAG,EAAE,WAAW,EAChB,SAAS,EAAE,SAAS,EACpB,gBAAgB,EAAE,SAAS,KAAK,SAAS,EACzC,QAAQ,EAAE,KAAK,EACf,WAAW,EAAE,kBAAkB,EAC/B,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,gBAAgB,EACzB,SAAS,EAAE,kBAAkB,EAC7B,QAAQ,EAAE,oBAAoB,EAC9B,OAAO,EAAE,oBAAoB,gBACjB,CAAC,CAAC,eAAe,CAAC,EAC9B,UAAU,EAAE,KAAK,GACjB,IACG,EACP,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,aAC1B,SAAS,IAAI,CACZ,KAAC,MAAM,IACL,GAAG,EAAE,aAAa,EAClB,OAAO,EAAE,WAAW,EACpB,OAAO,EAAC,QAAQ,EAChB,QAAQ,EAAE,QAAQ,EAClB,IAAI,sBACQ,CAAC,CAAC,WAAW,CAAC,YAE1B,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,GACnB,CACV,EACA,cAAc,GAAG,CAAC,IAAI,CACrB,MAAC,gCAAgC,IAC/B,QAAQ,EAAE,WAAW,CAAC,MAAM,IAAI,cAAc,EAC9C,GAAG,EAAE,mBAAmB,EACxB,QAAQ,EAAE,WAAW,CAAC,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EAC9D,IAAI,EAAC,QAAQ,aAEb,KAAC,MAAM,IACL,OAAO,EAAE,eAAe,EACxB,OAAO,EAAC,QAAQ,EAChB,QAAQ,EAAE,CAAC,CAAC,CAAC,QAAQ,IAAI,WAAW,CAAC,MAAM,IAAI,cAAc,CAAC,EAC9D,IAAI,sBAEF,WAAW,CAAC,MAAM,IAAI,cAAc;4CAClC,CAAC,CAAC,CAAC,CAAC,0BAA0B,EAAE,CAAC,cAAc,CAAC,CAAC;4CACjD,CAAC,CAAC,CAAC,CAAC,sBAAsB,EAAE,CAAC,cAAc,CAAC,CAAC,YAGjD,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,GACnB,EACR,WAAW,CAAC,MAAM,IAAI,cAAc,IAAI,CACvC,KAAC,OAAO,IACN,MAAM,EAAE,gBAAgB,EACxB,SAAS,EAAC,MAAM,EAChB,SAAS,EAAC,MAAM,KACZ,SAAS,YAEZ,CAAC,CAAC,0BAA0B,EAAE,CAAC,cAAc,CAAC,CAAC,GACxC,CACX,IACgC,CACpC,EACD,MAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,aAC3C,QAAQ,EACR,mBAAmB,IAAI,CACtB,KAAC,QAAQ,IACP,KAAK,EAAE,CAAC,CAAC,eAAe,CAAC,EACzB,QAAQ,EAAE,QAAQ,IAAI,mBAAmB,EACzC,OAAO,EAAE,mBAAmB,GAC5B,CACH,IACI,EAEP,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,QAAQ,EAAE,QAAQ,IAAI,CAAC,CAAC,CAAC,SAAS,IAAI,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,EACjE,OAAO,EAAE,GAAG,EAAE;oCACZ,WAAW,CAAC,OAAO,CAAC,CAAC;oCACrB,eAAe,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC;gCACrC,CAAC,YAEA,CAAC,CAAC,MAAM,CAAC,GACH,EACR,YAAY,IAAI,CACf,KAAC,kBAAkB,iBAAW,WAAW,YAAE,YAAY,GAAsB,CAC9E,IACI,IACF,EACP,KAAC,OAAO,IACN,IAAI,EAAE,eAAe,EACrB,MAAM,EAAE,UAAU,EAClB,SAAS,EAAC,WAAW,EACrB,SAAS,EAAE;oBACT;wBACE,IAAI,EAAE,MAAM;wBACZ,OAAO,EAAE,IAAI;qBACd;iBACF,YAED,KAAC,WAAW,IAAC,GAAG,EAAE,cAAc,EAAE,QAAQ,EAAE,aAAa,GAAI,GACrD,IACT,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { forwardRef, useState, useEffect, useCallback, useImperativeHandle, useRef } from 'react';\nimport type {\n FunctionComponent,\n Ref,\n PropsWithoutRef,\n ReactNode,\n ChangeEvent,\n RefObject,\n KeyboardEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Flex,\n TextArea,\n Button,\n Icon,\n registerIcon,\n Popover,\n EmojiPicker,\n hasProp,\n useI18n,\n useElement,\n defaultThemeProp,\n Tooltip,\n useOuterEvent,\n VisuallyHiddenText,\n FileUploadItem,\n Grid,\n AIButton\n} from '@pega/cosmos-react-core';\nimport type {\n EmojiPickerProps,\n PropsWithDefaults,\n ForwardProps,\n FileUploadItemProps\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as faceHappyIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/face-happy.icon';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\n\nregisterIcon(timesIcon, faceHappyIcon, paperClipIcon);\n\nexport type SpecialKeysConfig = {\n /** Collection of specialKeys /\n keys: string[];\n /* onSpecialKey is fired when a special key is typed in Textarea /\n onSpecialKey: (e: KeyboardEvent<HTMLTextAreaElement>, key: string) => void;\n};\n\nexport interface ChatComposerProps {\n /* Place holder /\n placeholder?: string;\n /* Default message to populate on load /\n defaultMessage?: string;\n /* Max character limit /\n maxLength?: number;\n /* Callback when send button is clicked /\n onSend: (message: string) => void;\n /* Enter / Return key sends message /\n enterKeySendsMessage?: boolean;\n /* Max number of attachments to be allowed in chat composer.\n * If zero is passed, add attachments icon will be hidden. same rule applies if prop is not passed.\n * If attachments added are >= maxAttachments, add attachments icon will be disabled.\n /\n maxAttachments?: number;\n /* show/hide emoji /\n showEmoji?: boolean;\n /* Attachments list /\n attachments?: FileUploadItemProps[];\n /* Callback when attachment icon is clicked /\n onAddAttachment?: () => void;\n /* Special Keys configuration /\n specialKeysConfig?: SpecialKeysConfig;\n /* Disables the composer area /\n disabled?: boolean;\n /* Children /\n children?: ReactNode;\n /* On suggest reply click /\n onSuggestReplyClick?: () => void;\n /\n Disable suggest reply button\n * @default false\n /\n disableSuggestReply?: boolean;\n /* Ref to the Imperative handle /\n ref?: Ref<ChatComposerImperativeHandleProps>;\n}\n\nconst StyledAttachmentItem = styled(FileUploadItem)``;\n\ninterface DisableAttachmentProps {\n disabled?: boolean;\n}\nconst StyledAttachmentElementContainer = styled.div<DisableAttachmentProps>(\n ({ disabled, theme }) => {\n return (\n disabled &&\n css`\n &:focus {\n box-shadow: ${theme.base.shadow.focus};\n border-radius: 50%;\n outline: none;\n }\n `\n );\n }\n);\nconst StyledPreviewButton = styled(BareButton)``;\nconst StyledDeleteButton = styled(BareButton)``;\n\nconst StyledChatComposer = styled.footer<PropsWithDefaults<ChatComposerProps, 'disabled'>>(\n ({\n theme,\n disabled,\n theme: {\n base: { 'disabled-opacity': transparentBg, spacing }\n }\n }) => {\n return css`\n padding: calc(2 ${spacing});\n background-color: ${theme.base.palette['secondary-background']};\n border-end-start-radius: inherit;\n border-end-end-radius: inherit;\n textarea {\n border-radius: ${theme.base['border-radius']};\n height: 5rem;\n border: 0.0625rem solid ${theme.base.colors.gray['extra-light']};\n max-width: 100%;\n }\n ${StyledAttachmentItem} {\n ${disabled &&\n css`\n pointer-events: none;\n opacity: ${transparentBg};\n `}\n }\n\n ${StyledAttachmentElementContainer} {\n ${disabled &&\n css`\n pointer-events: none;\n `}\n }\n\n ${StyledPreviewButton} {\n color: ${theme.base.palette.interactive};\n font-weight: bold;\n &:hover {\n text-decoration: underline;\n }\n }\n\n ${StyledDeleteButton} {\n color: ${theme.base.palette.interactive};\n }\n `;\n }\n);\n\nStyledChatComposer.defaultProps = defaultThemeProp;\nStyledAttachmentElementContainer.defaultProps = defaultThemeProp;\n\nexport const StyledAttachmentsListContainer = styled.div(({ theme }) => {\n return css`\n max-height: 5rem;\n overflow-y: auto;\n\n &:focus-within {\n box-shadow: ${theme.base.shadow['focus-group']};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n }\n `;\n});\n\nexport interface ChatComposerImperativeHandleProps {\n /** Function to append a message /\n appendToMessage: (\n appendMessage: string,\n position?: 'cursor' \| 'start' \| 'end' \| 'specialKey'\n ) => void;\n /* Actual ref to Chat composer component */\n chatComposerRef: RefObject<HTMLDivElement \| undefined>;\n textAreaRef: RefObject<HTMLTextAreaElement \| undefined>;\n}\n\nconst ChatComposer: FunctionComponent<ChatComposerProps & ForwardProps> = forwardRef(\n function ChatComposer(props: PropsWithoutRef<ChatComposerProps>, ref: ChatComposerProps['ref']) {\n const {\n children,\n attachments = [],\n maxAttachments = 0,\n onAddAttachment,\n maxLength,\n placeholder: defaultPlaceHolder,\n defaultMessage = '',\n onSend,\n specialKeysConfig,\n disabled = false,\n enterKeySendsMessage = true,\n showEmoji,\n onSuggestReplyClick,\n disableSuggestReply = false,\n ...restProps\n } = props;\n const [message, setMessage] = useState(defaultMessage);\n useEffect(() => {\n setMessage(defaultMessage);\n }, [defaultMessage]);\n\n const t = useI18n();\n\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n const [showEmojiPicker, setShowEmojiPicker] = useState(false);\n const [emojiBtnEl, setEmojiBtnEl] = useElement();\n const [attachmentsBtnEl, setAttachmentsBtnEl] = useElement();\n const [announcement, setAnnouncement] = useState('');\n\n const lastEnteredSpecialKey = useRef<string \| null>(null);\n\n const appendToMessage = useCallback(\n (\n appendMessage: string,\n position?: 'cursor' \| 'start' \| 'end' \| 'specialKey',\n selectText: boolean = true\n ) => {\n let selectionStart;\n let selectionEnd;\n if (textAreaRef.current) {\n if (position === 'start') {\n textAreaRef.current.value = appendMessage + textAreaRef.current.value;\n selectionStart = 0;\n selectionEnd = appendMessage.length;\n } else if (position === 'end') {\n const initialEnd = textAreaRef.current.value.length;\n textAreaRef.current.value += appendMessage;\n selectionStart = initialEnd;\n selectionEnd = initialEnd + appendMessage.length;\n } else if (position === 'specialKey' && lastEnteredSpecialKey.current) {\n const replaceChars = lastEnteredSpecialKey.current.length;\n const currentSelectionStart = textAreaRef.current.selectionStart;\n textAreaRef.current.value =\n textAreaRef.current.value.substring(\n 0,\n textAreaRef.current.selectionStart - replaceChars\n ) +\n appendMessage +\n textAreaRef.current.value.substring(\n textAreaRef.current.selectionStart,\n textAreaRef.current.value.length\n );\n selectionStart = currentSelectionStart - replaceChars;\n selectionEnd = currentSelectionStart + appendMessage.length - replaceChars;\n lastEnteredSpecialKey.current = null;\n } else {\n const currentSelectionStart = textAreaRef.current.selectionStart;\n textAreaRef.current.value =\n textAreaRef.current.value.substring(0, textAreaRef.current.selectionStart) +\n appendMessage +\n textAreaRef.current.value.substring(\n textAreaRef.current.selectionStart,\n textAreaRef.current.value.length\n );\n selectionStart = currentSelectionStart;\n selectionEnd = currentSelectionStart + appendMessage.length;\n }\n textAreaRef.current.selectionStart = selectText ? selectionStart : selectionEnd;\n textAreaRef.current.selectionEnd = selectionEnd;\n textAreaRef.current.focus();\n setMessage(textAreaRef.current.value);\n }\n },\n [setMessage, textAreaRef.current]\n );\n\n const chatComposerRef = useRef<HTMLDivElement>(null);\n\n useImperativeHandle(ref, () => ({ appendToMessage, chatComposerRef, textAreaRef }), [\n appendToMessage,\n chatComposerRef.current,\n textAreaRef.current\n ]);\n\n const sendMessage = useCallback(\n (newMessage: string) => {\n if (onSend) {\n onSend(newMessage);\n setMessage('');\n }\n },\n [onSend]\n );\n\n const handleEnterKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (enterKeySendsMessage && e.key === 'Enter' && !e.shiftKey) {\n if (!maxLength \|\| message.length <= maxLength) {\n sendMessage(message);\n setAnnouncement(t('message_sent'));\n }\n e.preventDefault();\n e.stopPropagation();\n }\n },\n [onSend, message, maxLength]\n );\n\n const handleTextAreaChange = useCallback(\n (e: ChangeEvent<HTMLTextAreaElement>) => {\n setMessage(e.currentTarget.value);\n setAnnouncement('');\n },\n [setMessage]\n );\n\n const handleSpecialKey = useCallback(\n (e: KeyboardEvent<HTMLTextAreaElement>) => {\n if (!specialKeysConfig) return;\n const { keys, onSpecialKey } = specialKeysConfig;\n if (specialKeysConfig && keys.length > 0) {\n const composerValue = e.currentTarget.value.substring(0, e.currentTarget.selectionStart);\n const specialKey = keys.find(key => composerValue.endsWith(key));\n if (specialKey) {\n lastEnteredSpecialKey.current = specialKey;\n onSpecialKey(e, specialKey);\n }\n }\n },\n [specialKeysConfig]\n );\n\n const toggleEmoji = () => {\n setShowEmojiPicker(!showEmojiPicker);\n };\n const onEmojiSelect: EmojiPickerProps['onSelect'] = emojiElem => {\n // Check that it is not a custom emoji\n if (hasProp(emojiElem, 'native')) {\n appendToMessage(emojiElem.native, 'cursor', false);\n }\n setShowEmojiPicker(false);\n };\n\n const EmojiPickerRef = useRef<HTMLDivElement>(null);\n\n useOuterEvent('mousedown', [emojiBtnEl, EmojiPickerRef], () => {\n setShowEmojiPicker(false);\n });\n\n return (\n <>\n <Flex\n as={StyledChatComposer}\n disabled={disabled}\n container={{\n direction: 'column',\n gap: 2\n }}\n item={{\n shrink: 0\n }}\n {...restProps}\n ref={chatComposerRef}\n >\n <Flex\n container={{\n direction: 'column',\n gap: 0.5\n }}\n >\n <Grid\n container={{\n cols: 'repeat(auto-fill, minmax(12rem, 1fr))',\n gap: 1\n }}\n role='group'\n aria-label={`${t('attachments')}`}\n as={StyledAttachmentsListContainer}\n >\n {attachments.map((attachment, idx) => {\n if (disabled) {\n const attachmentProps = {\n ...attachment,\n onDelete: undefined,\n onDownload: undefined,\n onPreview: undefined,\n onEdit: undefined,\n onCancel: undefined\n };\n return <StyledAttachmentItem {...attachmentProps} key={attachmentProps.name} />;\n }\n return (\n <div\n aria-label={`${t('attachments_x_of_y', [idx + 1, attachments.length])}`}\n key={attachment.name}\n >\n <StyledAttachmentItem {...attachment} />\n </div>\n );\n })}\n </Grid>\n <TextArea\n ref={textAreaRef}\n maxLength={maxLength}\n displayCharCount={maxLength !== undefined}\n hardStop={false}\n placeholder={defaultPlaceHolder}\n value={message}\n disabled={disabled}\n onKeyUp={handleSpecialKey}\n onKeyDown={handleEnterKeyDown}\n onChange={handleTextAreaChange}\n onFocus={handleTextAreaChange}\n aria-label={t('enter_message')}\n autoResize={false}\n />\n </Flex>\n <Flex container={{ gap: 0.5 }}>\n {showEmoji && (\n <Button\n ref={setEmojiBtnEl}\n onClick={toggleEmoji}\n variant='simple'\n disabled={disabled}\n icon\n aria-label={t('add_emoji')}\n >\n <Icon name='face-happy' />\n </Button>\n )}\n {maxAttachments > 0 && (\n <StyledAttachmentElementContainer\n disabled={attachments.length >= maxAttachments}\n ref={setAttachmentsBtnEl}\n tabIndex={attachments.length >= maxAttachments ? 0 : undefined}\n role='button'\n >\n <Button\n onClick={onAddAttachment}\n variant='simple'\n disabled={!!(disabled \|\| attachments.length >= maxAttachments)}\n icon\n aria-label={\n attachments.length >= maxAttachments\n ? t('email_disable_attachment', [maxAttachments])\n : t('email_add_attachment', [maxAttachments])\n }\n >\n <Icon name='paper-clip' />\n </Button>\n {attachments.length >= maxAttachments && (\n <Tooltip\n target={attachmentsBtnEl}\n showDelay='none'\n hideDelay='none'\n {...restProps}\n >\n {t('email_disable_attachment', [maxAttachments])}\n </Tooltip>\n )}\n </StyledAttachmentElementContainer>\n )}\n <Flex item={{ grow: 1 }} container={{ gap: 1 }}>\n {children}\n {onSuggestReplyClick && (\n <AIButton\n label={t('suggest_reply')}\n disabled={disabled \|\| disableSuggestReply}\n onClick={onSuggestReplyClick}\n />\n )}\n </Flex>\n\n <Button\n variant='primary'\n disabled={disabled \|\| (!!maxLength && message.length > maxLength)}\n onClick={() => {\n sendMessage(message);\n setAnnouncement(t('message_sent'));\n }}\n >\n {t('send')}\n </Button>\n {announcement && (\n <VisuallyHiddenText aria-live='assertive'>{announcement}</VisuallyHiddenText>\n )}\n </Flex>\n </Flex>\n <Popover\n show={showEmojiPicker}\n target={emojiBtnEl}\n placement='top-start'\n modifiers={[\n {\n name: 'flip',\n enabled: true\n }\n ]}\n >\n <EmojiPicker ref={EmojiPickerRef} onSelect={onEmojiSelect} />\n </Popover>\n </>\n );\n }\n);\n\nexport default ChatComposer;\n"]}

package/lib/components/Chat/ChatHeader.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { FunctionComponent, Ref, MouseEvent } from 'react';
-import { ForwardProps, NoChildrenProp, SentimentProps, FieldValueListItemProps, MenuItemProps } from '@pega/cosmos-react-core';
+import type { FunctionComponent, Ref, MouseEvent } from 'react';
+import type { ForwardProps, NoChildrenProp, SentimentProps, FieldValueListItemProps, MenuItemProps } from '@pega/cosmos-react-core';
 export interface ChatHeaderProps extends NoChildrenProp {
     /** ref to the element */
     ref?: Ref<HTMLElement>;

package/lib/components/Chat/ChatHeader.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatHeader.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/ChatHeader.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,~~EAAc~~,iBAAiB,EAAE,GAAG,EAAmB,UAAU,EAAE,MAAM,OAAO,CAAC;~~AAGxF~~,OAAO,~~EAKL~~,YAAY,EACZ,cAAc,EACd,cAAc,~~EAEd~~,uBAAuB,~~EAQvB~~,aAAa,EACd,MAAM,yBAAyB,CAAC;AAMjC,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACrD,yBAAyB;IACzB,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACvB,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,iGAAiG;IACjG,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gBAAgB;IAChB,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,6BAA6B;IAC7B,OAAO,CAAC,EAAE;QACR,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;QACrD,KAAK,EAAE,uBAAuB,EAAE,CAAC;KAClC,CAAC;IACF,yDAAyD;IACzD,OAAO,CAAC,EAAE,aAAa,EAAE,CAAC;CAC3B;AA2BD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAgGjE,CAAC;AAEF,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"ChatHeader.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/ChatHeader.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAAmB,UAAU,EAAE,MAAM,OAAO,CAAC;AAiBjF,OAAO,KAAK,EACV,YAAY,EACZ,cAAc,EACd,cAAc,EACd,uBAAuB,EACvB,aAAa,EACd,MAAM,yBAAyB,CAAC;AAMjC,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACrD,yBAAyB;IACzB,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACvB,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,iGAAiG;IACjG,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gBAAgB;IAChB,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,6BAA6B;IAC7B,OAAO,CAAC,EAAE;QACR,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;QACrD,KAAK,EAAE,uBAAuB,EAAE,CAAC;KAClC,CAAC;IACF,yDAAyD;IACzD,OAAO,CAAC,EAAE,aAAa,EAAE,CAAC;CAC3B;AA2BD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAgGjE,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/Chat/ChatHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatHeader.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,~~EAAuD~~,MAAM,OAAO,CAAC;~~AACxF~~,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,gBAAgB,~~EAIhB~~,SAAS,~~EAET~~,MAAM,EACN,UAAU,EACV,UAAU,EACV,cAAc,EACd,OAAO,EACP,YAAY,EACZ,UAAU,~~EAEX~~,MAAM,yBAAyB,CAAC;~~AACjC~~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","sourcesContent":["import { forwardRef, FunctionComponent, Ref, PropsWithoutRef, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Text,\n Flex,\n Icon,\n defaultThemeProp,\n ~~ForwardProps~~,\n ~~NoChildrenProp~~,\n ~~SentimentProps~~,\n ~~Sentiment~~,\n ~~FieldValueListItemProps~~,\n ~~Button~~,\n ~~useElement~~,\n ~~InfoDialog,\~~n ~~FieldValueList~~,\n ~~useI18n~~,\n ~~registerIcon~~,\n ~~MenuButton~~,\n MenuItemProps\n} from '@pega/cosmos-react-core';\nimport * as userCheckIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/user-check.icon';\nimport * as userQuestionMarkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/user-question-mark.icon';\n\nregisterIcon(userCheckIcon, userQuestionMarkIcon);\n\nexport interface ChatHeaderProps extends NoChildrenProp {\n /** ref to the element /\n ref?: Ref<HTMLElement>;\n /* Title: Used to show channel \|\| group name /\n title: string;\n /* Icon: Used to show the channel icons, pass the icon name from the cosmos library to render /\n icon?: string;\n /* Used to show customer name \|\| handle /\n customer: string;\n /* Authentication status of the customer\n * @default false\n /\n authenticated?: boolean;\n /* Sentiment /\n sentiment?: SentimentProps;\n /* Contextual information /\n context?: {\n loading?: boolean;\n onClick?: (e: MouseEvent<HTMLButtonElement>) => void;\n items: FieldValueListItemProps[];\n };\n /* Used to show frequent user actions to be performed */\n actions?: MenuItemProps[];\n}\n\nconst StyledChatHeader = styled.header(\n ({\n theme: {\n base: {\n spacing,\n palette: { 'border-line': borderLine }\n }\n }\n }) => {\n return css`\n padding: ${spacing};\n border-block-end: 0.0625rem solid ${borderLine};\n `;\n }\n);\nStyledChatHeader.defaultProps = defaultThemeProp;\n\nconst StyledContextContainer = styled.div`\n min-height: 2rem;\n`;\n\nconst StyledInfoDialog = styled(InfoDialog)`\n min-width: 50ch;\n`;\n\nconst ChatHeader: FunctionComponent<ChatHeaderProps & ForwardProps> = forwardRef(\n function ChatHeader(props: PropsWithoutRef<ChatHeaderProps>, ref: ChatHeaderProps['ref']) {\n const {\n title,\n actions = [],\n icon,\n customer,\n authenticated = false,\n sentiment,\n context,\n ...restProps\n } = props;\n\n const t = useI18n();\n const [target, setTarget] = useElement<HTMLButtonElement>(null);\n\n return (\n <Flex\n {...restProps}\n ref={ref}\n as={StyledChatHeader}\n container={{ alignItems: 'start' }}\n item={{\n shrink: 0\n }}\n >\n <Flex\n item={{\n grow: 1\n }}\n container={{\n gap: 0.5,\n alignItems: 'start',\n direction: 'column'\n }}\n >\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n {icon && <Icon name={icon} />}\n <Text variant='h2'>{title}</Text>\n </Flex>\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Icon\n role='img'\n name={authenticated ? 'user-check' : 'user-question-mark'}\n aria-label={authenticated ? t('authenticated') : t('not_authenticated')}\n />\n <Text variant='secondary'>{customer}</Text>\n {sentiment && <Sentiment {...sentiment} labelHidden />}\n </Flex>\n </Flex>\n\n <Flex\n item={{\n grow: 1\n }}\n container={{\n alignItems: 'center',\n justify: 'end'\n }}\n >\n {context && (\n <Button\n variant='simple'\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n context.onClick?.(e);\n setTarget(e.currentTarget);\n }}\n >\n {t('context')}\n </Button>\n )}\n\n <MenuButton\n text={t('actions')}\n iconOnly\n icon='more'\n variant='simple'\n menu={{ items: actions }}\n />\n </Flex>\n {target && context && (\n <StyledInfoDialog\n heading={t('chat_context')}\n target={target}\n onDismiss={() => setTarget(null)}\n placement='bottom-end'\n progress={context.loading}\n >\n <Flex as={StyledContextContainer} container>\n <FieldValueList fields={context.items} />\n </Flex>\n </StyledInfoDialog>\n )}\n </Flex>\n );\n }\n);\n\nexport default ChatHeader;\n"]}
1	+ {"version":3,"file":"ChatHeader.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Text,\n Flex,\n Icon,\n defaultThemeProp,\n Sentiment,\n Button,\n useElement,\n InfoDialog,\n FieldValueList,\n useI18n,\n registerIcon,\n MenuButton\n} from '@pega/cosmos-react-core';\nimport type {\n ForwardProps,\n NoChildrenProp,\n SentimentProps,\n FieldValueListItemProps,\n MenuItemProps\n} from '@pega/cosmos-react-core';\nimport * as userCheckIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/user-check.icon';\nimport * as userQuestionMarkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/user-question-mark.icon';\n\nregisterIcon(userCheckIcon, userQuestionMarkIcon);\n\nexport interface ChatHeaderProps extends NoChildrenProp {\n /** ref to the element /\n ref?: Ref<HTMLElement>;\n /* Title: Used to show channel \|\| group name /\n title: string;\n /* Icon: Used to show the channel icons, pass the icon name from the cosmos library to render /\n icon?: string;\n /* Used to show customer name \|\| handle /\n customer: string;\n /* Authentication status of the customer\n * @default false\n /\n authenticated?: boolean;\n /* Sentiment /\n sentiment?: SentimentProps;\n /* Contextual information /\n context?: {\n loading?: boolean;\n onClick?: (e: MouseEvent<HTMLButtonElement>) => void;\n items: FieldValueListItemProps[];\n };\n /* Used to show frequent user actions to be performed */\n actions?: MenuItemProps[];\n}\n\nconst StyledChatHeader = styled.header(\n ({\n theme: {\n base: {\n spacing,\n palette: { 'border-line': borderLine }\n }\n }\n }) => {\n return css`\n padding: ${spacing};\n border-block-end: 0.0625rem solid ${borderLine};\n `;\n }\n);\nStyledChatHeader.defaultProps = defaultThemeProp;\n\nconst StyledContextContainer = styled.div`\n min-height: 2rem;\n`;\n\nconst StyledInfoDialog = styled(InfoDialog)`\n min-width: 50ch;\n`;\n\nconst ChatHeader: FunctionComponent<ChatHeaderProps & ForwardProps> = forwardRef(\n function ChatHeader(props: PropsWithoutRef<ChatHeaderProps>, ref: ChatHeaderProps['ref']) {\n const {\n title,\n actions = [],\n icon,\n customer,\n authenticated = false,\n sentiment,\n context,\n ...restProps\n } = props;\n\n const t = useI18n();\n const [target, setTarget] = useElement<HTMLButtonElement>(null);\n\n return (\n <Flex\n {...restProps}\n ref={ref}\n as={StyledChatHeader}\n container={{ alignItems: 'start' }}\n item={{\n shrink: 0\n }}\n >\n <Flex\n item={{\n grow: 1\n }}\n container={{\n gap: 0.5,\n alignItems: 'start',\n direction: 'column'\n }}\n >\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n {icon && <Icon name={icon} />}\n <Text variant='h2'>{title}</Text>\n </Flex>\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Icon\n role='img'\n name={authenticated ? 'user-check' : 'user-question-mark'}\n aria-label={authenticated ? t('authenticated') : t('not_authenticated')}\n />\n <Text variant='secondary'>{customer}</Text>\n {sentiment && <Sentiment {...sentiment} labelHidden />}\n </Flex>\n </Flex>\n\n <Flex\n item={{\n grow: 1\n }}\n container={{\n alignItems: 'center',\n justify: 'end'\n }}\n >\n {context && (\n <Button\n variant='simple'\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n context.onClick?.(e);\n setTarget(e.currentTarget);\n }}\n >\n {t('context')}\n </Button>\n )}\n\n <MenuButton\n text={t('actions')}\n iconOnly\n icon='more'\n variant='simple'\n menu={{ items: actions }}\n />\n </Flex>\n {target && context && (\n <StyledInfoDialog\n heading={t('chat_context')}\n target={target}\n onDismiss={() => setTarget(null)}\n placement='bottom-end'\n progress={context.loading}\n >\n <Flex as={StyledContextContainer} container>\n <FieldValueList fields={context.items} />\n </Flex>\n </StyledInfoDialog>\n )}\n </Flex>\n );\n }\n);\n\nexport default ChatHeader;\n"]}

package/lib/components/Chat/ChatSettingsPanel.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps, OmitStrict } from '@pega/cosmos-react-core';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps, OmitStrict } from '@pega/cosmos-react-core';
 import type { ChatSettingsPanelProps } from './Chat.types';
 export declare const ChatControlPanelIcon: FunctionComponent<OmitStrict<ChatSettingsPanelProps, 'onClick'> & ForwardProps>;
 declare const ChatSettingsPanel: FunctionComponent<ChatSettingsPanelProps & ForwardProps>;

package/lib/components/Chat/ChatSettingsPanel.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatSettingsPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/ChatSettingsPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;~~AAE1C~~,OAAO,~~EACL~~,YAAY,~~EAEZ~~,UAAU,~~EAKX~~,MAAM,yBAAyB,CAAC;~~AAIjC~~,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAS3D,eAAO,MAAM,oBAAoB,EAAE,iBAAiB,CAClD,UAAU,CAAC,sBAAsB,EAAE,SAAS,CAAC,GAAG,YAAY,CAa7D,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CAc/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"ChatSettingsPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/ChatSettingsPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAS/C,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAIxE,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAS3D,eAAO,MAAM,oBAAoB,EAAE,iBAAiB,CAClD,UAAU,CAAC,sBAAsB,EAAE,SAAS,CAAC,GAAG,YAAY,CAa7D,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CAc/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/Chat/ChatSettingsPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatSettingsPanel.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatSettingsPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,~~EAEL~~,IAAI,~~EAEJ~~,YAAY,EACZ,YAAY,EACZ,OAAO,EACP,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;~~AACjC~~,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,EAAE,kBAAkB,EAAE,MAAM,gEAAgE,CAAC;AAGpG,OAAO,EACL,0BAA0B,EAC1B,oBAAoB,EACpB,qBAAqB,EACtB,MAAM,4BAA4B,CAAC;AAEpC,YAAY,CAAC,QAAQ,CAAC,CAAC;AAEvB,MAAM,CAAC,MAAM,oBAAoB,GAE7B,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE;IACtC,OAAO,CACL,MAAC,0BAA0B,IAAC,EAAE,EAAE,YAAY,KAAM,SAAS,EAAE,IAAI,EAAC,GAAG,EAAC,UAAU,EAAE,MAAM,aACtF,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,EACnB,MAAM,IAAI,qBAAqB,CAAC,MAAM,CAAC,CAAC,IAAI,IAAI,CAC/C,KAAC,oBAAoB,IAAC,UAAU,EAAE,MAAM,YACtC,KAAC,IAAI,IAAC,IAAI,EAAE,qBAAqB,CAAC,MAAM,CAAC,CAAC,IAAK,GAAI,GAC9B,CACxB,EACD,KAAC,kBAAkB,cAAE,KAAK,GAAsB,IACrB,CAC9B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAA6D,CAAC,EACnF,MAAM,EACN,KAAK,EACL,OAAO,EACP,GAAG,SAAS,EACb,EAAE,EAAE;IACH,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,KAAC,kBAAkB,IACjB,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EACnD,MAAM,EAAE,KAAC,oBAAoB,IAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,KAAM,SAAS,GAAI,EAC7E,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\n\nimport {\n ~~ForwardProps,\n~~ Icon,\n ~~OmitStrict,\n~~ registerIcon,\n StyledAvatar,\n useI18n,\n VisuallyHiddenText\n} from '@pega/cosmos-react-core';\nimport * as chatIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chat.icon';\nimport { NavigationListItem } from '@pega/cosmos-react-core/lib/components/AppShell/NavigationList';\n\nimport type { ChatSettingsPanelProps } from './Chat.types';\nimport {\n StyledChatControlPanelIcon,\n StyledUserStatusIcon,\n userAvailabilityTheme\n} from './ChatSettingsPanel.styles';\n\nregisterIcon(chatIcon);\n\nexport const ChatControlPanelIcon: FunctionComponent<\n OmitStrict<ChatSettingsPanelProps, 'onClick'> & ForwardProps\n> = ({ status, label, ...restProps }) => {\n return (\n <StyledChatControlPanelIcon as={StyledAvatar} {...restProps} size='m' userStatus={status}>\n <Icon name='chat' />\n {status && userAvailabilityTheme[status].icon && (\n <StyledUserStatusIcon userStatus={status}>\n <Icon name={userAvailabilityTheme[status].icon!} />\n </StyledUserStatusIcon>\n )}\n <VisuallyHiddenText>{label}</VisuallyHiddenText>\n </StyledChatControlPanelIcon>\n );\n};\n\nconst ChatSettingsPanel: FunctionComponent<ChatSettingsPanelProps & ForwardProps> = ({\n status,\n label,\n onClick,\n ...restProps\n}) => {\n const t = useI18n();\n return (\n <NavigationListItem\n primary={status ? `${label} (${t(status)})` : label}\n visual={<ChatControlPanelIcon status={status} label={label} {...restProps} />}\n onClick={onClick}\n />\n );\n};\n\nexport default ChatSettingsPanel;\n"]}
1	+ {"version":3,"file":"ChatSettingsPanel.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatSettingsPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,EACL,IAAI,EACJ,YAAY,EACZ,YAAY,EACZ,OAAO,EACP,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,EAAE,kBAAkB,EAAE,MAAM,gEAAgE,CAAC;AAGpG,OAAO,EACL,0BAA0B,EAC1B,oBAAoB,EACpB,qBAAqB,EACtB,MAAM,4BAA4B,CAAC;AAEpC,YAAY,CAAC,QAAQ,CAAC,CAAC;AAEvB,MAAM,CAAC,MAAM,oBAAoB,GAE7B,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE;IACtC,OAAO,CACL,MAAC,0BAA0B,IAAC,EAAE,EAAE,YAAY,KAAM,SAAS,EAAE,IAAI,EAAC,GAAG,EAAC,UAAU,EAAE,MAAM,aACtF,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,EACnB,MAAM,IAAI,qBAAqB,CAAC,MAAM,CAAC,CAAC,IAAI,IAAI,CAC/C,KAAC,oBAAoB,IAAC,UAAU,EAAE,MAAM,YACtC,KAAC,IAAI,IAAC,IAAI,EAAE,qBAAqB,CAAC,MAAM,CAAC,CAAC,IAAK,GAAI,GAC9B,CACxB,EACD,KAAC,kBAAkB,cAAE,KAAK,GAAsB,IACrB,CAC9B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAA6D,CAAC,EACnF,MAAM,EACN,KAAK,EACL,OAAO,EACP,GAAG,SAAS,EACb,EAAE,EAAE;IACH,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,KAAC,kBAAkB,IACjB,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,KAAK,KAAK,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EACnD,MAAM,EAAE,KAAC,oBAAoB,IAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,KAAM,SAAS,GAAI,EAC7E,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import type { FunctionComponent } from 'react';\n\nimport {\n Icon,\n registerIcon,\n StyledAvatar,\n useI18n,\n VisuallyHiddenText\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, OmitStrict } from '@pega/cosmos-react-core';\nimport * as chatIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chat.icon';\nimport { NavigationListItem } from '@pega/cosmos-react-core/lib/components/AppShell/NavigationList';\n\nimport type { ChatSettingsPanelProps } from './Chat.types';\nimport {\n StyledChatControlPanelIcon,\n StyledUserStatusIcon,\n userAvailabilityTheme\n} from './ChatSettingsPanel.styles';\n\nregisterIcon(chatIcon);\n\nexport const ChatControlPanelIcon: FunctionComponent<\n OmitStrict<ChatSettingsPanelProps, 'onClick'> & ForwardProps\n> = ({ status, label, ...restProps }) => {\n return (\n <StyledChatControlPanelIcon as={StyledAvatar} {...restProps} size='m' userStatus={status}>\n <Icon name='chat' />\n {status && userAvailabilityTheme[status].icon && (\n <StyledUserStatusIcon userStatus={status}>\n <Icon name={userAvailabilityTheme[status].icon!} />\n </StyledUserStatusIcon>\n )}\n <VisuallyHiddenText>{label}</VisuallyHiddenText>\n </StyledChatControlPanelIcon>\n );\n};\n\nconst ChatSettingsPanel: FunctionComponent<ChatSettingsPanelProps & ForwardProps> = ({\n status,\n label,\n onClick,\n ...restProps\n}) => {\n const t = useI18n();\n return (\n <NavigationListItem\n primary={status ? `${label} (${t(status)})` : label}\n visual={<ChatControlPanelIcon status={status} label={label} {...restProps} />}\n onClick={onClick}\n />\n );\n};\n\nexport default ChatSettingsPanel;\n"]}

package/lib/components/Chat/ChatSettingsPanel.styles.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { IconName } from '@pega/cosmos-react-core';
-import { ColorTheme, UserAvailability } from './Chat.types';
+import type { IconName } from '@pega/cosmos-react-core';
+import type { ColorTheme, UserAvailability } from './Chat.types';
 export declare const userAvailabilityTheme: Record<UserAvailability, {
     icon?: IconName;
     color: ColorTheme;

package/lib/components/Chat/ChatSettingsPanel.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatSettingsPanel.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/ChatSettingsPanel.styles.ts"],"names":[],"mappings":"~~AAGA~~,OAAO,~~EAAoB~~,QAAQ,~~EAA4B~~,MAAM,yBAAyB,CAAC;~~AAI/F~~,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;~~AAI5D~~,eAAO,MAAM,qBAAqB,EAAE,MAAM,CACxC,gBAAgB,EAChB;IAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,EAAE,UAAU,CAAA;CAAE,CAKvC,CAAC;AAEF,eAAO,MAAM,gBAAgB;gBACf,gBAAgB;SAkB7B,CAAC;AAIF,eAAO,MAAM,oBAAoB;gBAtBnB,gBAAgB;SAiC5B,CAAC;AAIH,eAAO,MAAM,0BAA0B;gBArCzB,gBAAgB;SA8C7B,CAAC"}
1	+ {"version":3,"file":"ChatSettingsPanel.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/ChatSettingsPanel.styles.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAIxD,OAAO,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAIjE,eAAO,MAAM,qBAAqB,EAAE,MAAM,CACxC,gBAAgB,EAChB;IAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,EAAE,UAAU,CAAA;CAAE,CAKvC,CAAC;AAEF,eAAO,MAAM,gBAAgB;gBACf,gBAAgB;SAkB7B,CAAC;AAIF,eAAO,MAAM,oBAAoB;gBAtBnB,gBAAgB;SAiC5B,CAAC;AAIH,eAAO,MAAM,0BAA0B;gBArCzB,gBAAgB;SA8C7B,CAAC"}

package/lib/components/Chat/ChatSettingsPanel.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatSettingsPanel.styles.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatSettingsPanel.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,OAAO,EAAE,gBAAgB,~~EAAY~~,YAAY,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;~~AAC/F~~,OAAO,KAAK,KAAK,MAAM,8DAA8D,CAAC;AACtF,OAAO,KAAK,KAAK,MAAM,8DAA8D,CAAC;AAItF,YAAY,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;AAE3B,MAAM,CAAC,MAAM,qBAAqB,GAG9B;IACF,SAAS,EAAE,EAAE,KAAK,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,EAAE;IACxC,WAAW,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE;IACxD,sBAAsB,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC,EAAE;CACtE,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAGxC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,MAAM,EAAE,EACjB,EACD,UAAU,EACX,EAAE,EAAE;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAe,UAAU;QACtD,CAAC,CAAC,qBAAqB,CAAC,UAAU,CAAC,CAAC,KAAK;QACzC,CAAC,CAAC,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACvB,MAAM,OAAO,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD,MAAM,OAAO,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC;IACvC,OAAO,GAAG,CAAA;0BACY,OAAO;eAClB,OAAO;KACjB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACzE,OAAO,GAAG,CAAA;;8BAEkB,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAkB,CAAC;;MAE7E,UAAU;;;;;GAKb,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAA;IAC9D,oBAAoB;;;;;;;;CAQvB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport { defaultThemeProp, ~~IconName,~~ registerIcon, StyledIcon } from '@pega/cosmos-react-core';\nimport * as minus from '@pega/cosmos-react-core/lib/components/Icon/icons/minus.icon';\nimport * as clock from '@pega/cosmos-react-core/lib/components/Icon/icons/clock.icon';\n\nimport { ColorTheme, UserAvailability } from './Chat.types';\n\nregisterIcon(minus, clock);\n\nexport const userAvailabilityTheme: Record<\n UserAvailability,\n { icon?: IconName; color: ColorTheme }\n> = {\n available: { color: ['green', 'light'] },\n unavailable: { icon: 'minus', color: ['red', 'medium'] },\n temporarilyUnavailable: { icon: 'clock', color: ['orange', 'light'] }\n};\n\nexport const StyledStatusIcon = styled.div<{\n userStatus: UserAvailability;\n}>(\n ({\n theme: {\n base: { colors }\n },\n userStatus\n }) => {\n const [colorName, colorVariant]: ColorTheme = userStatus\n ? userAvailabilityTheme[userStatus].color\n : ['slate', 'light'];\n const bgColor = colors[colorName][colorVariant];\n const fgColor = readableColor(bgColor);\n return css`\n background-color: ${bgColor};\n color: ${fgColor};\n `;\n }\n);\n\nStyledStatusIcon.defaultProps = defaultThemeProp;\n\nexport const StyledUserStatusIcon = styled(StyledStatusIcon)(({ theme }) => {\n return css`\n border-radius: 50%;\n border: 0.0625rem solid ${theme.components['app-shell'].nav['background-color']};\n\n ${StyledIcon} {\n display: block;\n width: 100%;\n margin: 0 auto;\n }\n `;\n});\n\nStyledUserStatusIcon.defaultProps = defaultThemeProp;\n\nexport const StyledChatControlPanelIcon = styled(StyledStatusIcon)`\n ${StyledUserStatusIcon} {\n position: absolute;\n width: 0.875rem;\n height: 0.875rem;\n z-index: 1;\n inset-block-start: -0.25rem;\n inset-inline-end: -0.25rem;\n }\n`;\n"]}
1	+ {"version":3,"file":"ChatSettingsPanel.styles.js","sourceRoot":"","sources":["../../../src/components/Chat/ChatSettingsPanel.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErF,OAAO,KAAK,KAAK,MAAM,8DAA8D,CAAC;AACtF,OAAO,KAAK,KAAK,MAAM,8DAA8D,CAAC;AAItF,YAAY,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;AAE3B,MAAM,CAAC,MAAM,qBAAqB,GAG9B;IACF,SAAS,EAAE,EAAE,KAAK,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,EAAE;IACxC,WAAW,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE;IACxD,sBAAsB,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC,EAAE;CACtE,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAGxC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,MAAM,EAAE,EACjB,EACD,UAAU,EACX,EAAE,EAAE;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAe,UAAU;QACtD,CAAC,CAAC,qBAAqB,CAAC,UAAU,CAAC,CAAC,KAAK;QACzC,CAAC,CAAC,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACvB,MAAM,OAAO,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD,MAAM,OAAO,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC;IACvC,OAAO,GAAG,CAAA;0BACY,OAAO;eAClB,OAAO;KACjB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACzE,OAAO,GAAG,CAAA;;8BAEkB,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAkB,CAAC;;MAE7E,UAAU;;;;;GAKb,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAA;IAC9D,oBAAoB;;;;;;;;CAQvB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport { defaultThemeProp, registerIcon, StyledIcon } from '@pega/cosmos-react-core';\nimport type { IconName } from '@pega/cosmos-react-core';\nimport * as minus from '@pega/cosmos-react-core/lib/components/Icon/icons/minus.icon';\nimport * as clock from '@pega/cosmos-react-core/lib/components/Icon/icons/clock.icon';\n\nimport type { ColorTheme, UserAvailability } from './Chat.types';\n\nregisterIcon(minus, clock);\n\nexport const userAvailabilityTheme: Record<\n UserAvailability,\n { icon?: IconName; color: ColorTheme }\n> = {\n available: { color: ['green', 'light'] },\n unavailable: { icon: 'minus', color: ['red', 'medium'] },\n temporarilyUnavailable: { icon: 'clock', color: ['orange', 'light'] }\n};\n\nexport const StyledStatusIcon = styled.div<{\n userStatus: UserAvailability;\n}>(\n ({\n theme: {\n base: { colors }\n },\n userStatus\n }) => {\n const [colorName, colorVariant]: ColorTheme = userStatus\n ? userAvailabilityTheme[userStatus].color\n : ['slate', 'light'];\n const bgColor = colors[colorName][colorVariant];\n const fgColor = readableColor(bgColor);\n return css`\n background-color: ${bgColor};\n color: ${fgColor};\n `;\n }\n);\n\nStyledStatusIcon.defaultProps = defaultThemeProp;\n\nexport const StyledUserStatusIcon = styled(StyledStatusIcon)(({ theme }) => {\n return css`\n border-radius: 50%;\n border: 0.0625rem solid ${theme.components['app-shell'].nav['background-color']};\n\n ${StyledIcon} {\n display: block;\n width: 100%;\n margin: 0 auto;\n }\n `;\n});\n\nStyledUserStatusIcon.defaultProps = defaultThemeProp;\n\nexport const StyledChatControlPanelIcon = styled(StyledStatusIcon)`\n ${StyledUserStatusIcon} {\n position: absolute;\n width: 0.875rem;\n height: 0.875rem;\n z-index: 1;\n inset-block-start: -0.25rem;\n inset-inline-end: -0.25rem;\n }\n`;\n"]}

package/lib/components/Chat/Message.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { MessageProps } from './Chat.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { MessageProps } from './Chat.types';
 declare const Message: FunctionComponent<MessageProps & ForwardProps>;
 export default Message;
 //# sourceMappingURL=Message.d.ts.map

package/lib/components/Chat/Message.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/Message.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,~~EACL~~,iBAAiB,~~EAOlB~~,MAAM,OAAO,CAAC;~~AAEf~~,OAAO,~~EAUL~~,YAAY,~~EAKb~~,MAAM,yBAAyB,CAAC;~~AAKjC~~,OAAO,EAAE,YAAY,~~EAAE~~,MAAM,cAAc,CAAC;~~AA4F5C~~,QAAA,MAAM,OAAO,EAAE,iBAAiB,CAAC,YAAY,GAAG,YAAY,CAyN1D,CAAC;AAEH,eAAe,OAAO,CAAC"}
1	+ {"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/Message.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAgB5E,OAAO,KAAK,EAAsB,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAKhF,OAAO,KAAK,EAAE,YAAY,EAAuB,MAAM,cAAc,CAAC;AA2FtE,QAAA,MAAM,OAAO,EAAE,iBAAiB,CAAC,YAAY,GAAG,YAAY,CAyN1D,CAAC;AAEH,eAAe,OAAO,CAAC"}

package/lib/components/Chat/Message.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Message.js","sourceRoot":"","sources":["../../../src/components/Chat/Message.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n forwardRef,\n PropsWithoutRef,\n MouseEvent,\n useEffect,\n useMemo,\n useRef\n} from 'react';\n\nimport {\n Avatar,\n Flex,\n Icon,\n registerIcon,\n SummaryItem,\n Image,\n FlexContainerProps,\n EmojiDisplay,\n useI18n,\n ForwardProps,\n Actions,\n Tooltip,\n useTheme,\n useElement\n} from '@pega/cosmos-react-core';\nimport * as documentDocIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/document-doc.icon';\nimport * as chainUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chain-up.icon';\nimport * as flagWaveSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/flag-wave-solid.icon';\n\nimport { MessageProps } from './Chat.types';\nimport {\n StyledMessageContainer,\n StyledMessageMain,\n StyledMessageBubble,\n StyledMessageBubbleContent,\n StyledMediaList,\n StyledMediaListItem,\n StyledMediaThumbNail,\n StyledSummaryItem,\n StyledMediaLink,\n StyledMetaInfoContainer,\n StyledMetaInfo,\n StyledBlinkingDot,\n StyledMediaButton,\n StyledMessageHeader,\n StyledMessageHeaderContent,\n StyledMessageHeaderMeta,\n StyledUndeliveredIcon,\n StyledStatusInfo,\n StyledHeadset,\n getMessageColors,\n StyledFlagIcon,\n StyledHeadsetIconBackground\n} from './Message.styles';\nimport type { AttachmentItemProps } from './Chat.types';\n\nregisterIcon(documentDocIcon, chainUpIcon, flagWaveSolidIcon);\n\nconst Attachment = (props: AttachmentItemProps) => {\n const { id, icon, name, meta, actions = [], onPreview, thumbnail } = props;\n const actionRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n const listener = (e: KeyboardEvent) => {\n if (\n (e.target as HTMLButtonElement)?.getAttribute('aria-expanded') === 'true' &&\n ['ArrowLeft', 'ArrowRight', 'ArrowDown', 'ArrowUp'].includes(e.key)\n ) {\n e.stopPropagation();\n }\n };\n\n actionRef.current?.addEventListener('keydown', listener);\n\n return () => {\n actionRef.current?.removeEventListener('keydown', listener);\n };\n }, [actions]);\n\n return (\n <Flex\n key={id}\n as={StyledMediaListItem}\n container={{\n direction: 'column'\n }}\n >\n {thumbnail && (\n <Image\n as={StyledMediaThumbNail}\n src={thumbnail}\n onClick={(e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onPreview?.(id);\n }}\n alt={name}\n />\n )}\n\n <SummaryItem\n as={StyledSummaryItem}\n primary={\n <StyledMediaButton\n onClick={(e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onPreview?.(id);\n }}\n >\n {name}\n </StyledMediaButton>\n }\n secondary={meta}\n visual={<Icon name={icon \|\| 'document-doc'} />}\n actions={<Actions ref={actionRef} items={actions} iconOnly />}\n />\n </Flex>\n );\n};\n\nconst Message: FunctionComponent<MessageProps & ForwardProps> = forwardRef(function Message(\n props: PropsWithoutRef<MessageProps>,\n ref: MessageProps['ref']\n) {\n const {\n message,\n direction,\n avatarInfo,\n timestamp,\n attachments = [],\n mediaPageLinks = [],\n status,\n typing,\n messageHeader,\n senderType,\n senderId,\n agentVariant,\n ...restProps\n } = props;\n\n const t = useI18n();\n const theme = useTheme();\n const [avatarRef, setAvatarRef] = useElement();\n const { content: messageBubbleBackgroundColor } = useMemo(\n () => getMessageColors(theme, direction, senderType, agentVariant),\n [theme, direction, senderType, agentVariant]\n );\n\n let messageMetaJustify: FlexContainerProps['justify'] = 'between';\n if (timestamp && !status) {\n messageMetaJustify = 'start';\n } else if (!timestamp && status) {\n messageMetaJustify = 'end';\n }\n\n const renderAvatar = useMemo(() => {\n if (direction !== 'in' \|\| (senderType !== 'bot' && !avatarInfo)) {\n return null;\n }\n\n if (senderType === 'agent') {\n return (\n <>\n <StyledHeadset>\n <Avatar\n name={avatarInfo!.name}\n size='m'\n shape='circle'\n imageSrc={avatarInfo!.imageSrc}\n ref={setAvatarRef}\n backgroundColor={messageBubbleBackgroundColor}\n />\n <StyledHeadsetIconBackground>\n <Icon name='headset' />\n </StyledHeadsetIconBackground>\n </StyledHeadset>\n <Tooltip target={avatarRef} showDelay='none' hideDelay='none'>\n {avatarInfo!.name}\n </Tooltip>\n </>\n );\n }\n\n return (\n <>\n <Avatar\n name={avatarInfo ? avatarInfo.name : t('bot')}\n size='m'\n shape='circle'\n icon={!avatarInfo?.imageSrc && senderType === 'bot' ? 'robot-solid' : undefined}\n imageSrc={avatarInfo?.imageSrc}\n ref={setAvatarRef}\n backgroundColor={messageBubbleBackgroundColor}\n />\n <Tooltip target={avatarRef} showDelay='none' hideDelay='none'>\n {avatarInfo ? avatarInfo.name : t('bot')}\n </Tooltip>\n </>\n );\n }, [avatarInfo, senderType, direction, avatarRef]);\n\n let ariaLabel: string \| undefined;\n const sender = avatarInfo ? avatarInfo.name : senderType;\n\n ariaLabel = t('sender_replied_message', [sender, message \|\| '']);\n if (attachments.length > 0) ariaLabel = t('chat_attachments', [ariaLabel, attachments.length]);\n if (mediaPageLinks.length > 0) ariaLabel = t('chat_links', [ariaLabel, mediaPageLinks.length]);\n if (timestamp) ariaLabel = t('chat_message_at_timestamp', [ariaLabel, timestamp]);\n if (status && direction === 'out') ariaLabel += ` ${t('chat_message_status', [status])}`;\n\n return (\n <Flex\n as={StyledMessageContainer}\n ref={ref}\n container={{\n gap: 1.5,\n direction: direction === 'in' ? 'row' : 'row-reverse'\n }}\n item={{\n shrink: 0\n }}\n hasMessage={!!message}\n direction={direction}\n senderType={senderType}\n typing={typing}\n messageHeader={messageHeader}\n status={status}\n agentVariant={agentVariant}\n aria-label={ariaLabel}\n {...restProps}\n >\n {renderAvatar}\n <Flex\n container={{\n direction: 'column',\n alignItems: direction === 'in' ? 'start' : 'end',\n justify: 'center'\n }}\n as={StyledMessageMain}\n >\n <Flex\n container={{\n direction: direction === 'in' ? 'row' : 'row-reverse',\n alignItems: 'center',\n gap: 0.5\n }}\n >\n <StyledMessageBubble>\n {messageHeader && (\n <Flex container={{ gap: 0.5, justify: 'between' }} as={StyledMessageHeader}>\n <Flex container={{ gap: 0.5 }}>\n <StyledFlagIcon name='flag-wave-solid' />\n <StyledMessageHeaderContent>{messageHeader.content}</StyledMessageHeaderContent>\n </Flex>\n\n <StyledMessageHeaderMeta>{messageHeader.meta}</StyledMessageHeaderMeta>\n </Flex>\n )}\n\n {message && (\n <StyledMessageBubbleContent>\n <EmojiDisplay content={message} size={20} />\n </StyledMessageBubbleContent>\n )}\n\n {(attachments.length > 0 \|\| mediaPageLinks.length > 0) && (\n <StyledMediaList>\n {attachments.map(attachment => {\n return <Attachment {...attachment} key={attachment.id} />;\n })}\n\n {mediaPageLinks.map(pagePushLink => {\n const { id, href, title, thumbnail } = pagePushLink;\n return (\n <Flex\n as={StyledMediaListItem}\n key={id}\n container={{\n direction: 'column'\n }}\n >\n {thumbnail && (\n <Image as={StyledMediaThumbNail} src={thumbnail} alt={title \|\| href} />\n )}\n <SummaryItem\n as={StyledSummaryItem}\n primary={\n <StyledMediaLink\n aria-label={title}\n href={href}\n target='_blank'\n rel='noreferrer'\n >\n {href}\n </StyledMediaLink>\n }\n visual={<Icon name='chain-up' />}\n />\n </Flex>\n );\n })}\n </StyledMediaList>\n )}\n </StyledMessageBubble>\n\n {status === 'undeliverable' && message && direction === 'out' && (\n <StyledUndeliveredIcon name='warn-solid' />\n )}\n </Flex>\n\n {!typing && (\n <Flex\n as={StyledMetaInfoContainer}\n container={{\n justify: messageMetaJustify,\n gap: 1.5\n }}\n >\n {timestamp && <StyledMetaInfo>{timestamp}</StyledMetaInfo>}\n {status && direction === 'out' && <StyledStatusInfo>{t(status)}</StyledStatusInfo>}\n </Flex>\n )}\n\n {typing && (\n <Flex\n container={{\n gap: 0.25\n }}\n >\n <StyledBlinkingDot delay={0} />\n <StyledBlinkingDot delay={0.25} />\n <StyledBlinkingDot delay={0.5} />\n </Flex>\n )}\n </Flex>\n </Flex>\n );\n});\n\nexport default Message;\n"]}
1	+ {"version":3,"file":"Message.js","sourceRoot":"","sources":["../../../src/components/Chat/Message.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAG/D,OAAO,EACL,MAAM,EACN,IAAI,EACJ,IAAI,EACJ,YAAY,EACZ,WAAW,EACX,KAAK,EACL,YAAY,EACZ,OAAO,EACP,OAAO,EACP,OAAO,EACP,QAAQ,EACR,UAAU,EACX,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,eAAe,MAAM,qEAAqE,CAAC;AACvG,OAAO,KAAK,WAAW,MAAM,iEAAiE,CAAC;AAC/F,OAAO,KAAK,iBAAiB,MAAM,wEAAwE,CAAC;AAG5G,OAAO,EACL,sBAAsB,EACtB,iBAAiB,EACjB,mBAAmB,EACnB,0BAA0B,EAC1B,eAAe,EACf,mBAAmB,EACnB,oBAAoB,EACpB,iBAAiB,EACjB,eAAe,EACf,uBAAuB,EACvB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,mBAAmB,EACnB,0BAA0B,EAC1B,uBAAuB,EACvB,qBAAqB,EACrB,gBAAgB,EAChB,aAAa,EACb,gBAAgB,EAChB,cAAc,EACd,2BAA2B,EAC5B,MAAM,kBAAkB,CAAC;AAE1B,YAAY,CAAC,eAAe,EAAE,WAAW,EAAE,iBAAiB,CAAC,CAAC;AAE9D,MAAM,UAAU,GAAG,CAAC,KAA0B,EAAE,EAAE;IAChD,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,GAAG,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC3E,MAAM,SAAS,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAElD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,CAAC,CAAgB,EAAE,EAAE;YACpC,IACG,CAAC,CAAC,MAA4B,EAAE,YAAY,CAAC,eAAe,CAAC,KAAK,MAAM;gBACzE,CAAC,WAAW,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,EACnE;gBACA,CAAC,CAAC,eAAe,EAAE,CAAC;aACrB;QACH,CAAC,CAAC;QAEF,SAAS,CAAC,OAAO,EAAE,gBAAgB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;QAEzD,OAAO,GAAG,EAAE;YACV,SAAS,CAAC,OAAO,EAAE,mBAAmB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;QAC9D,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,CACL,MAAC,IAAI,IAEH,EAAE,EAAE,mBAAmB,EACvB,SAAS,EAAE;YACT,SAAS,EAAE,QAAQ;SACpB,aAEA,SAAS,IAAI,CACZ,KAAC,KAAK,IACJ,EAAE,EAAE,oBAAoB,EACxB,GAAG,EAAE,SAAS,EACd,OAAO,EAAE,CAAC,CAAa,EAAE,EAAE;oBACzB,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;oBACpB,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;gBAClB,CAAC,EACD,GAAG,EAAE,IAAI,GACT,CACH,EAED,KAAC,WAAW,IACV,EAAE,EAAE,iBAAiB,EACrB,OAAO,EACL,KAAC,iBAAiB,IAChB,OAAO,EAAE,CAAC,CAAa,EAAE,EAAE;wBACzB,CAAC,CAAC,cAAc,EAAE,CAAC;wBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;wBACpB,SAAS,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,CAAC,YAEA,IAAI,GACa,EAEtB,SAAS,EAAE,IAAI,EACf,MAAM,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,IAAI,cAAc,GAAI,EAC9C,OAAO,EAAE,KAAC,OAAO,IAAC,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,SAAG,GAC7D,KAnCG,EAAE,CAoCF,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,OAAO,GAAmD,UAAU,CAAC,SAAS,OAAO,CACzF,KAAoC,EACpC,GAAwB;IAExB,MAAM,EACJ,OAAO,EACP,SAAS,EACT,UAAU,EACV,SAAS,EACT,WAAW,GAAG,EAAE,EAChB,cAAc,GAAG,EAAE,EACnB,MAAM,EACN,MAAM,EACN,aAAa,EACb,UAAU,EACV,QAAQ,EACR,YAAY,EACZ,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAE,CAAC;IAC/C,MAAM,EAAE,OAAO,EAAE,4BAA4B,EAAE,GAAG,OAAO,CACvD,GAAG,EAAE,CAAC,gBAAgB,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,CAAC,EAClE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,CAAC,CAC7C,CAAC;IAEF,IAAI,kBAAkB,GAAkC,SAAS,CAAC;IAClE,IAAI,SAAS,IAAI,CAAC,MAAM,EAAE;QACxB,kBAAkB,GAAG,OAAO,CAAC;KAC9B;SAAM,IAAI,CAAC,SAAS,IAAI,MAAM,EAAE;QAC/B,kBAAkB,GAAG,KAAK,CAAC;KAC5B;IAED,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE;QAChC,IAAI,SAAS,KAAK,IAAI,IAAI,CAAC,UAAU,KAAK,KAAK,IAAI,CAAC,UAAU,CAAC,EAAE;YAC/D,OAAO,IAAI,CAAC;SACb;QAED,IAAI,UAAU,KAAK,OAAO,EAAE;YAC1B,OAAO,CACL,8BACE,MAAC,aAAa,eACZ,KAAC,MAAM,IACL,IAAI,EAAE,UAAW,CAAC,IAAI,EACtB,IAAI,EAAC,GAAG,EACR,KAAK,EAAC,QAAQ,EACd,QAAQ,EAAE,UAAW,CAAC,QAAQ,EAC9B,GAAG,EAAE,YAAY,EACjB,eAAe,EAAE,4BAA4B,GAC7C,EACF,KAAC,2BAA2B,cAC1B,KAAC,IAAI,IAAC,IAAI,EAAC,SAAS,GAAG,GACK,IAChB,EAChB,KAAC,OAAO,IAAC,MAAM,EAAE,SAAS,EAAE,SAAS,EAAC,MAAM,EAAC,SAAS,EAAC,MAAM,YAC1D,UAAW,CAAC,IAAI,GACT,IACT,CACJ,CAAC;SACH;QAED,OAAO,CACL,8BACE,KAAC,MAAM,IACL,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAC7C,IAAI,EAAC,GAAG,EACR,KAAK,EAAC,QAAQ,EACd,IAAI,EAAE,CAAC,UAAU,EAAE,QAAQ,IAAI,UAAU,KAAK,KAAK,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,EAC/E,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAC9B,GAAG,EAAE,YAAY,EACjB,eAAe,EAAE,4BAA4B,GAC7C,EACF,KAAC,OAAO,IAAC,MAAM,EAAE,SAAS,EAAE,SAAS,EAAC,MAAM,EAAC,SAAS,EAAC,MAAM,YAC1D,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAChC,IACT,CACJ,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC;IAEnD,IAAI,SAA6B,CAAC;IAClC,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC;IAEzD,SAAS,GAAG,CAAC,CAAC,wBAAwB,EAAE,CAAC,MAAM,EAAE,OAAO,IAAI,EAAE,CAAC,CAAC,CAAC;IACjE,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC;QAAE,SAAS,GAAG,CAAC,CAAC,kBAAkB,EAAE,CAAC,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC;IAC/F,IAAI,cAAc,CAAC,MAAM,GAAG,CAAC;QAAE,SAAS,GAAG,CAAC,CAAC,YAAY,EAAE,CAAC,SAAS,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAC/F,IAAI,SAAS;QAAE,SAAS,GAAG,CAAC,CAAC,2BAA2B,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC;IAClF,IAAI,MAAM,IAAI,SAAS,KAAK,KAAK;QAAE,SAAS,IAAI,IAAI,CAAC,CAAC,qBAAqB,EAAE,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC;IAEzF,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,sBAAsB,EAC1B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE;YACT,GAAG,EAAE,GAAG;YACR,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa;SACtD,EACD,IAAI,EAAE;YACJ,MAAM,EAAE,CAAC;SACV,EACD,UAAU,EAAE,CAAC,CAAC,OAAO,EACrB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,aAAa,EAC5B,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,YAAY,gBACd,SAAS,KACjB,SAAS,aAEZ,YAAY,EACb,MAAC,IAAI,IACH,SAAS,EAAE;oBACT,SAAS,EAAE,QAAQ;oBACnB,UAAU,EAAE,SAAS,KAAK,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK;oBAChD,OAAO,EAAE,QAAQ;iBAClB,EACD,EAAE,EAAE,iBAAiB,aAErB,MAAC,IAAI,IACH,SAAS,EAAE;4BACT,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,aAAa;4BACrD,UAAU,EAAE,QAAQ;4BACpB,GAAG,EAAE,GAAG;yBACT,aAED,MAAC,mBAAmB,eACjB,aAAa,IAAI,CAChB,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE,EAAE,mBAAmB,aACxE,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,aAC3B,KAAC,cAAc,IAAC,IAAI,EAAC,iBAAiB,GAAG,EACzC,KAAC,0BAA0B,cAAE,aAAa,CAAC,OAAO,GAA8B,IAC3E,EAEP,KAAC,uBAAuB,cAAE,aAAa,CAAC,IAAI,GAA2B,IAClE,CACR,EAEA,OAAO,IAAI,CACV,KAAC,0BAA0B,cACzB,KAAC,YAAY,IAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,GAAI,GACjB,CAC9B,EAEA,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,IAAI,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,CACxD,MAAC,eAAe,eACb,WAAW,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;gDAC5B,OAAO,eAAC,UAAU,OAAK,UAAU,EAAE,GAAG,EAAE,UAAU,CAAC,EAAE,GAAI,CAAC;4CAC5D,CAAC,CAAC,EAED,cAAc,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE;gDACjC,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,YAAY,CAAC;gDACpD,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,mBAAmB,EAEvB,SAAS,EAAE;wDACT,SAAS,EAAE,QAAQ;qDACpB,aAEA,SAAS,IAAI,CACZ,KAAC,KAAK,IAAC,EAAE,EAAE,oBAAoB,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,KAAK,IAAI,IAAI,GAAI,CACxE,EACD,KAAC,WAAW,IACV,EAAE,EAAE,iBAAiB,EACrB,OAAO,EACL,KAAC,eAAe,kBACF,KAAK,EACjB,IAAI,EAAE,IAAI,EACV,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,YAAY,YAEf,IAAI,GACW,EAEpB,MAAM,EAAE,KAAC,IAAI,IAAC,IAAI,EAAC,UAAU,GAAG,GAChC,KArBG,EAAE,CAsBF,CACR,CAAC;4CACJ,CAAC,CAAC,IACc,CACnB,IACmB,EAErB,MAAM,KAAK,eAAe,IAAI,OAAO,IAAI,SAAS,KAAK,KAAK,IAAI,CAC/D,KAAC,qBAAqB,IAAC,IAAI,EAAC,YAAY,GAAG,CAC5C,IACI,EAEN,CAAC,MAAM,IAAI,CACV,MAAC,IAAI,IACH,EAAE,EAAE,uBAAuB,EAC3B,SAAS,EAAE;4BACT,OAAO,EAAE,kBAAkB;4BAC3B,GAAG,EAAE,GAAG;yBACT,aAEA,SAAS,IAAI,KAAC,cAAc,cAAE,SAAS,GAAkB,EACzD,MAAM,IAAI,SAAS,KAAK,KAAK,IAAI,KAAC,gBAAgB,cAAE,CAAC,CAAC,MAAM,CAAC,GAAoB,IAC7E,CACR,EAEA,MAAM,IAAI,CACT,MAAC,IAAI,IACH,SAAS,EAAE;4BACT,GAAG,EAAE,IAAI;yBACV,aAED,KAAC,iBAAiB,IAAC,KAAK,EAAE,CAAC,GAAI,EAC/B,KAAC,iBAAiB,IAAC,KAAK,EAAE,IAAI,GAAI,EAClC,KAAC,iBAAiB,IAAC,KAAK,EAAE,GAAG,GAAI,IAC5B,CACR,IACI,IACF,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,OAAO,CAAC","sourcesContent":["import { forwardRef, useEffect, useMemo, useRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, MouseEvent } from 'react';\n\nimport {\n Avatar,\n Flex,\n Icon,\n registerIcon,\n SummaryItem,\n Image,\n EmojiDisplay,\n useI18n,\n Actions,\n Tooltip,\n useTheme,\n useElement\n} from '@pega/cosmos-react-core';\nimport type { FlexContainerProps, ForwardProps } from '@pega/cosmos-react-core';\nimport * as documentDocIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/document-doc.icon';\nimport * as chainUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chain-up.icon';\nimport * as flagWaveSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/flag-wave-solid.icon';\n\nimport type { MessageProps, AttachmentItemProps } from './Chat.types';\nimport {\n StyledMessageContainer,\n StyledMessageMain,\n StyledMessageBubble,\n StyledMessageBubbleContent,\n StyledMediaList,\n StyledMediaListItem,\n StyledMediaThumbNail,\n StyledSummaryItem,\n StyledMediaLink,\n StyledMetaInfoContainer,\n StyledMetaInfo,\n StyledBlinkingDot,\n StyledMediaButton,\n StyledMessageHeader,\n StyledMessageHeaderContent,\n StyledMessageHeaderMeta,\n StyledUndeliveredIcon,\n StyledStatusInfo,\n StyledHeadset,\n getMessageColors,\n StyledFlagIcon,\n StyledHeadsetIconBackground\n} from './Message.styles';\n\nregisterIcon(documentDocIcon, chainUpIcon, flagWaveSolidIcon);\n\nconst Attachment = (props: AttachmentItemProps) => {\n const { id, icon, name, meta, actions = [], onPreview, thumbnail } = props;\n const actionRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n const listener = (e: KeyboardEvent) => {\n if (\n (e.target as HTMLButtonElement)?.getAttribute('aria-expanded') === 'true' &&\n ['ArrowLeft', 'ArrowRight', 'ArrowDown', 'ArrowUp'].includes(e.key)\n ) {\n e.stopPropagation();\n }\n };\n\n actionRef.current?.addEventListener('keydown', listener);\n\n return () => {\n actionRef.current?.removeEventListener('keydown', listener);\n };\n }, [actions]);\n\n return (\n <Flex\n key={id}\n as={StyledMediaListItem}\n container={{\n direction: 'column'\n }}\n >\n {thumbnail && (\n <Image\n as={StyledMediaThumbNail}\n src={thumbnail}\n onClick={(e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onPreview?.(id);\n }}\n alt={name}\n />\n )}\n\n <SummaryItem\n as={StyledSummaryItem}\n primary={\n <StyledMediaButton\n onClick={(e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onPreview?.(id);\n }}\n >\n {name}\n </StyledMediaButton>\n }\n secondary={meta}\n visual={<Icon name={icon \|\| 'document-doc'} />}\n actions={<Actions ref={actionRef} items={actions} iconOnly />}\n />\n </Flex>\n );\n};\n\nconst Message: FunctionComponent<MessageProps & ForwardProps> = forwardRef(function Message(\n props: PropsWithoutRef<MessageProps>,\n ref: MessageProps['ref']\n) {\n const {\n message,\n direction,\n avatarInfo,\n timestamp,\n attachments = [],\n mediaPageLinks = [],\n status,\n typing,\n messageHeader,\n senderType,\n senderId,\n agentVariant,\n ...restProps\n } = props;\n\n const t = useI18n();\n const theme = useTheme();\n const [avatarRef, setAvatarRef] = useElement();\n const { content: messageBubbleBackgroundColor } = useMemo(\n () => getMessageColors(theme, direction, senderType, agentVariant),\n [theme, direction, senderType, agentVariant]\n );\n\n let messageMetaJustify: FlexContainerProps['justify'] = 'between';\n if (timestamp && !status) {\n messageMetaJustify = 'start';\n } else if (!timestamp && status) {\n messageMetaJustify = 'end';\n }\n\n const renderAvatar = useMemo(() => {\n if (direction !== 'in' \|\| (senderType !== 'bot' && !avatarInfo)) {\n return null;\n }\n\n if (senderType === 'agent') {\n return (\n <>\n <StyledHeadset>\n <Avatar\n name={avatarInfo!.name}\n size='m'\n shape='circle'\n imageSrc={avatarInfo!.imageSrc}\n ref={setAvatarRef}\n backgroundColor={messageBubbleBackgroundColor}\n />\n <StyledHeadsetIconBackground>\n <Icon name='headset' />\n </StyledHeadsetIconBackground>\n </StyledHeadset>\n <Tooltip target={avatarRef} showDelay='none' hideDelay='none'>\n {avatarInfo!.name}\n </Tooltip>\n </>\n );\n }\n\n return (\n <>\n <Avatar\n name={avatarInfo ? avatarInfo.name : t('bot')}\n size='m'\n shape='circle'\n icon={!avatarInfo?.imageSrc && senderType === 'bot' ? 'robot-solid' : undefined}\n imageSrc={avatarInfo?.imageSrc}\n ref={setAvatarRef}\n backgroundColor={messageBubbleBackgroundColor}\n />\n <Tooltip target={avatarRef} showDelay='none' hideDelay='none'>\n {avatarInfo ? avatarInfo.name : t('bot')}\n </Tooltip>\n </>\n );\n }, [avatarInfo, senderType, direction, avatarRef]);\n\n let ariaLabel: string \| undefined;\n const sender = avatarInfo ? avatarInfo.name : senderType;\n\n ariaLabel = t('sender_replied_message', [sender, message \|\| '']);\n if (attachments.length > 0) ariaLabel = t('chat_attachments', [ariaLabel, attachments.length]);\n if (mediaPageLinks.length > 0) ariaLabel = t('chat_links', [ariaLabel, mediaPageLinks.length]);\n if (timestamp) ariaLabel = t('chat_message_at_timestamp', [ariaLabel, timestamp]);\n if (status && direction === 'out') ariaLabel += ` ${t('chat_message_status', [status])}`;\n\n return (\n <Flex\n as={StyledMessageContainer}\n ref={ref}\n container={{\n gap: 1.5,\n direction: direction === 'in' ? 'row' : 'row-reverse'\n }}\n item={{\n shrink: 0\n }}\n hasMessage={!!message}\n direction={direction}\n senderType={senderType}\n typing={typing}\n messageHeader={messageHeader}\n status={status}\n agentVariant={agentVariant}\n aria-label={ariaLabel}\n {...restProps}\n >\n {renderAvatar}\n <Flex\n container={{\n direction: 'column',\n alignItems: direction === 'in' ? 'start' : 'end',\n justify: 'center'\n }}\n as={StyledMessageMain}\n >\n <Flex\n container={{\n direction: direction === 'in' ? 'row' : 'row-reverse',\n alignItems: 'center',\n gap: 0.5\n }}\n >\n <StyledMessageBubble>\n {messageHeader && (\n <Flex container={{ gap: 0.5, justify: 'between' }} as={StyledMessageHeader}>\n <Flex container={{ gap: 0.5 }}>\n <StyledFlagIcon name='flag-wave-solid' />\n <StyledMessageHeaderContent>{messageHeader.content}</StyledMessageHeaderContent>\n </Flex>\n\n <StyledMessageHeaderMeta>{messageHeader.meta}</StyledMessageHeaderMeta>\n </Flex>\n )}\n\n {message && (\n <StyledMessageBubbleContent>\n <EmojiDisplay content={message} size={20} />\n </StyledMessageBubbleContent>\n )}\n\n {(attachments.length > 0 \|\| mediaPageLinks.length > 0) && (\n <StyledMediaList>\n {attachments.map(attachment => {\n return <Attachment {...attachment} key={attachment.id} />;\n })}\n\n {mediaPageLinks.map(pagePushLink => {\n const { id, href, title, thumbnail } = pagePushLink;\n return (\n <Flex\n as={StyledMediaListItem}\n key={id}\n container={{\n direction: 'column'\n }}\n >\n {thumbnail && (\n <Image as={StyledMediaThumbNail} src={thumbnail} alt={title \|\| href} />\n )}\n <SummaryItem\n as={StyledSummaryItem}\n primary={\n <StyledMediaLink\n aria-label={title}\n href={href}\n target='_blank'\n rel='noreferrer'\n >\n {href}\n </StyledMediaLink>\n }\n visual={<Icon name='chain-up' />}\n />\n </Flex>\n );\n })}\n </StyledMediaList>\n )}\n </StyledMessageBubble>\n\n {status === 'undeliverable' && message && direction === 'out' && (\n <StyledUndeliveredIcon name='warn-solid' />\n )}\n </Flex>\n\n {!typing && (\n <Flex\n as={StyledMetaInfoContainer}\n container={{\n justify: messageMetaJustify,\n gap: 1.5\n }}\n >\n {timestamp && <StyledMetaInfo>{timestamp}</StyledMetaInfo>}\n {status && direction === 'out' && <StyledStatusInfo>{t(status)}</StyledStatusInfo>}\n </Flex>\n )}\n\n {typing && (\n <Flex\n container={{\n gap: 0.25\n }}\n >\n <StyledBlinkingDot delay={0} />\n <StyledBlinkingDot delay={0.25} />\n <StyledBlinkingDot delay={0.5} />\n </Flex>\n )}\n </Flex>\n </Flex>\n );\n});\n\nexport default Message;\n"]}

package/lib/components/Chat/Message.styles.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { DefaultTheme } from 'styled-components';
-import { MessageProps } from './Chat.types';
+import type { DefaultTheme } from 'styled-components';
+import type { MessageProps } from './Chat.types';
 export declare const StyledMessageBubbleContent: import("styled-components").StyledComponent<"div", DefaultTheme, {}, never>;
 export declare const StyledMediaList: import("styled-components").StyledComponent<"ul", DefaultTheme, {}, never>;
 export declare const StyledMediaListItem: import("styled-components").StyledComponent<"li", DefaultTheme, {}, never>;
@@ -37,7 +37,7 @@ interface StyledBlinkingDotProps {
     delay?: number;
 }
 export declare const StyledBlinkingDot: import("styled-components").StyledComponent<"div", DefaultTheme, StyledBlinkingDotProps, never>;
-export declare const StyledUndeliveredIcon: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").IconProps & import("@pega/cosmos-react-core").ForwardProps>, DefaultTheme, {}, never>;
-export declare const StyledFlagIcon: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").IconProps & import("@pega/cosmos-react-core").ForwardProps>, DefaultTheme, {}, never>;
+export declare const StyledUndeliveredIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, DefaultTheme, {}, never>;
+export declare const StyledFlagIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, DefaultTheme, {}, never>;
 export {};
 //# sourceMappingURL=Message.styles.d.ts.map

package/lib/components/Chat/Message.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Message.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/Message.styles.ts"],"names":[],"mappings":";~~AAAA~~,~~OAAe~~,~~EAAO~~,YAAY,EAAE,MAAM,mBAAmB,CAAC;~~AAa9D~~,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;~~AAE5C~~,eAAO,MAAM,0BAA0B,6EAAe,CAAC;AAEvD,eAAO,MAAM,eAAe,4EAAc,CAAC;AAE3C,eAAO,MAAM,mBAAmB,4EAAc,CAAC;AAE/C,eAAO,MAAM,iBAAiB,6EAAe,CAAC;AAE9C,eAAO,MAAM,oBAAoB,6EAAe,CAAC;AAEjD,eAAO,MAAM,eAAe,2EAAa,CAAC;AAE1C,eAAO,MAAM,iBAAiB,8OAAuB,CAAC;AAEtD,eAAO,MAAM,iBAAiB,6EAAe,CAAC;AAE9C,eAAO,MAAM,mBAAmB,6EAAe,CAAC;AAEhD,eAAO,MAAM,uBAAuB,6EAAe,CAAC;AAEpD,eAAO,MAAM,cAAc,8EAAgB,CAAC;AAE5C,eAAO,MAAM,gBAAgB,8EAAgB,CAAC;AAE9C,eAAO,MAAM,qBAAqB,6EAAe,CAAC;AAElD,eAAO,MAAM,mBAAmB,gFAAkB,CAAC;AACnD,eAAO,MAAM,0BAA0B,6EAAe,CAAC;AACvD,eAAO,MAAM,uBAAuB,6EAAe,CAAC;AAEpD,eAAO,MAAM,2BAA2B,6EAAe,CAAC;AACxD,UAAU,2BAA2B;IACnC,UAAU,EAAE,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IACzC,SAAS,EAAE,IAAI,GAAG,KAAK,CAAC;IACxB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,6EAwBxB,CAAC;AAIH,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,gBAAgB,EAAE,CAC7B,KAAK,EAAE,YAAY,EACnB,SAAS,EAAE,YAAY,CAAC,WAAW,CAAC,EACpC,UAAU,EAAE,YAAY,CAAC,YAAY,CAAC,EACtC,YAAY,EAAE,YAAY,CAAC,cAAc,CAAC,KACvC,kBA+BJ,CAAC;AAEF,eAAO,MAAM,sBAAsB,qGAmLlC,CAAC;AAEF,UAAU,sBAAsB;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,iBAAiB,iGAiB5B,CAAC;AAGH,eAAO,MAAM,qBAAqB,~~uMAYjC~~,CAAC;AAIF,eAAO,MAAM,cAAc,~~uMAKzB~~,CAAC"}
1	+ {"version":3,"file":"Message.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/Message.styles.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAatD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAEjD,eAAO,MAAM,0BAA0B,6EAAe,CAAC;AAEvD,eAAO,MAAM,eAAe,4EAAc,CAAC;AAE3C,eAAO,MAAM,mBAAmB,4EAAc,CAAC;AAE/C,eAAO,MAAM,iBAAiB,6EAAe,CAAC;AAE9C,eAAO,MAAM,oBAAoB,6EAAe,CAAC;AAEjD,eAAO,MAAM,eAAe,2EAAa,CAAC;AAE1C,eAAO,MAAM,iBAAiB,8OAAuB,CAAC;AAEtD,eAAO,MAAM,iBAAiB,6EAAe,CAAC;AAE9C,eAAO,MAAM,mBAAmB,6EAAe,CAAC;AAEhD,eAAO,MAAM,uBAAuB,6EAAe,CAAC;AAEpD,eAAO,MAAM,cAAc,8EAAgB,CAAC;AAE5C,eAAO,MAAM,gBAAgB,8EAAgB,CAAC;AAE9C,eAAO,MAAM,qBAAqB,6EAAe,CAAC;AAElD,eAAO,MAAM,mBAAmB,gFAAkB,CAAC;AACnD,eAAO,MAAM,0BAA0B,6EAAe,CAAC;AACvD,eAAO,MAAM,uBAAuB,6EAAe,CAAC;AAEpD,eAAO,MAAM,2BAA2B,6EAAe,CAAC;AACxD,UAAU,2BAA2B;IACnC,UAAU,EAAE,UAAU,GAAG,OAAO,GAAG,KAAK,CAAC;IACzC,SAAS,EAAE,IAAI,GAAG,KAAK,CAAC;IACxB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,6EAwBxB,CAAC;AAIH,MAAM,WAAW,kBAAkB;IACjC,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,gBAAgB,EAAE,CAC7B,KAAK,EAAE,YAAY,EACnB,SAAS,EAAE,YAAY,CAAC,WAAW,CAAC,EACpC,UAAU,EAAE,YAAY,CAAC,YAAY,CAAC,EACtC,YAAY,EAAE,YAAY,CAAC,cAAc,CAAC,KACvC,kBA+BJ,CAAC;AAEF,eAAO,MAAM,sBAAsB,qGAmLlC,CAAC;AAEF,UAAU,sBAAsB;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,iBAAiB,iGAiB5B,CAAC;AAGH,eAAO,MAAM,qBAAqB,8JAYjC,CAAC;AAIF,eAAO,MAAM,cAAc,8JAKzB,CAAC"}

package/lib/components/Chat/Message.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Message.styles.js","sourceRoot":"","sources":["../../../src/components/Chat/Message.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css, DefaultTheme } from 'styled-components';\nimport { readableColor, rgba, transparentize } from 'polished';\n\nimport {\n defaultThemeProp,\n tryCatch,\n Icon,\n StyledIcon,\n StyledText,\n calculateFontSize\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nimport { MessageProps } from './Chat.types';\n\nexport const StyledMessageBubbleContent = styled.div``;\n\nexport const StyledMediaList = styled.ul``;\n\nexport const StyledMediaListItem = styled.li``;\n\nexport const StyledSummaryItem = styled.div``;\n\nexport const StyledMediaThumbNail = styled.img``;\n\nexport const StyledMediaLink = styled.a``;\n\nexport const StyledMediaButton = styled(BareButton)``;\n\nexport const StyledMessageMain = styled.div``;\n\nexport const StyledMessageBubble = styled.div``;\n\nexport const StyledMetaInfoContainer = styled.div``;\n\nexport const StyledMetaInfo = styled.span``;\n\nexport const StyledStatusInfo = styled.span``;\n\nexport const StyledTypingIndicator = styled.div``;\n\nexport const StyledMessageHeader = styled.header``;\nexport const StyledMessageHeaderContent = styled.div``;\nexport const StyledMessageHeaderMeta = styled.div``;\n\nexport const StyledHeadsetIconBackground = styled.div``;\ninterface StyledMessageContainerProps {\n senderType: 'customer' \| 'agent' \| 'bot';\n direction: 'in' \| 'out';\n typing: boolean;\n hasMessage: boolean;\n status: string;\n agentVariant: number;\n}\n\nexport const StyledHeadset = styled.div(({ theme }) => {\n return css`\n position: relative;\n\n ${StyledHeadsetIconBackground} {\n position: relative;\n inset-block-start: calc(-5.25 * ${theme.base.spacing});\n inset-inline-start: calc(2 * ${theme.base.spacing});\n height: 1.375rem;\n width: 1.375rem;\n background: ${theme.base.palette['primary-background']};\n border-radius: calc(\n (${theme.base['border-radius']}) * (${theme.components.button['border-radius']})\n );\n\n ${StyledIcon} {\n position: absolute;\n width: 2.875rem;\n height: 0.875rem;\n inset-inline-start: calc(-1.5 * ${theme.base.spacing});\n inset-block-start: calc(0.5 * ${theme.base.spacing});\n }\n }\n `;\n});\n\nStyledHeadset.defaultProps = defaultThemeProp;\n\nexport interface MessageBubbleColor {\n header: string;\n content: string;\n}\n\nexport const getMessageColors: (\n theme: DefaultTheme,\n direction: MessageProps['direction'],\n senderType: MessageProps['senderType'],\n agentVariant: MessageProps['agentVariant']\n) => MessageBubbleColor = (theme, direction, senderType, agentVariant = 0) => {\n const { slate, blue, purple, orange, green, black } = theme.base.colors;\n const agentMessageColors = [\n purple['extra-light'],\n orange['extra-light'],\n '#C5D1DD',\n green['extra-light'],\n '#BBEAEA'\n ];\n const outMessageColor = blue.medium;\n const customerMessageColor = '#E6EEFA';\n const botMessageColor = slate['extra-dark'];\n\n if (direction === 'in') {\n const messageColors: MessageBubbleColor = {\n header: orange.medium,\n content: ''\n };\n if (senderType === 'agent') {\n messageColors.content = agentMessageColors[agentVariant % agentMessageColors.length];\n } else if (senderType === 'bot') {\n messageColors.content = botMessageColor;\n } else if (senderType === 'customer') {\n messageColors.content = customerMessageColor;\n }\n return messageColors;\n }\n return {\n header: black,\n content: outMessageColor\n };\n};\n\nexport const StyledMessageContainer = styled.li<StyledMessageContainerProps>(\n ({\n direction,\n senderType,\n hasMessage,\n typing,\n status,\n agentVariant,\n theme,\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n 'border-radius': borderRadius,\n spacing,\n palette: {\n 'foreground-color': foregroundColor,\n 'secondary-background': secondaryBackground,\n urgent\n },\n transparency: { 'transparent-2': foregroundAlpha }\n }\n }\n }) => {\n const { header, content } = getMessageColors(theme, direction, senderType, agentVariant);\n const metaForegroundColor = tryCatch(() => rgba(foregroundColor, foregroundAlpha));\n const statusForegroundColor = status === 'undeliverable' ? urgent : metaForegroundColor;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n const contrastContentColor = readableColor(content);\n const contrastHeaderColor = readableColor(header);\n return css`\n ${direction === 'out'\n ? css`\n padding-inline-start: calc(4 * ${spacing});\n `\n : css`\n padding-inline-end: calc(4 * ${spacing});\n `}\n margin-block-end: ${typing ? spacing : '0'};\n\n :first-child {\n margin-block-start: ${spacing};\n }\n\n ${StyledMessageMain} {\n max-width: 90%;\n }\n ${StyledMessageBubble} {\n background: ${content};\n border-radius: calc(3 * ${borderRadius}) ${borderRadius} calc(3 * ${borderRadius})\n calc(3 * ${borderRadius});\n overflow: hidden;\n color: ${contrastContentColor};\n display: inline-block;\n width: auto;\n margin-block-end: calc(0.5 * ${spacing});\n\n label {\n color: inherit;\n }\n\n ${direction === 'in' &&\n css`\n border-radius: ${borderRadius} calc(3 * ${borderRadius}) calc(3 * ${borderRadius});\n `}\n\n > ${StyledMessageBubbleContent} {\n padding: ${spacing} calc(2 * ${spacing});\n word-break: break-word;\n white-space: pre-wrap;\n position: relative;\n }\n\n > ${StyledMediaList} {\n color: ${contrastContentColor};\n max-width: 100%;\n\n > ${StyledMediaListItem} {\n position: relative;\n ${StyledMediaThumbNail} {\n max-height: 12rem;\n width: 100%;\n object-fit: contain;\n background-color: ${secondaryBackground};\n }\n ${StyledSummaryItem} {\n padding: ${spacing} calc(3 * ${spacing});\n font-size: ${fontSizes.xxs};\n margin-block-start: calc(0.5 * ${spacing});\n }\n ${StyledSummaryItem}::before {\n content: '';\n padding: ${spacing} 0;\n border-top: 0.0625rem solid ${contrastContentColor};\n position: absolute;\n width: calc(100% - 2rem);\n left: 1rem;\n top: 0;\n }\n ${StyledMediaThumbNail} + ${StyledSummaryItem}::before {\n content: none;\n }\n svg {\n font-size: 1.6rem;\n }\n ${StyledText} {\n color: ${foregroundColor};\n }\n }\n\n ${!hasMessage &&\n css`\n > ${StyledMediaListItem}:first-child {\n > ${StyledSummaryItem}::before {\n border-top: none;\n }\n }\n `}\n }\n\n ${StyledMessageHeader} {\n padding: ${spacing} calc(2 * ${spacing});\n color: ${contrastHeaderColor};\n border-block-end: 0.0625rem solid ${transparentize(0.5, theme.base.colors.white)};\n }\n\n ${StyledMessageHeaderContent} {\n color: ${contrastHeaderColor};\n margin-inline-end: ${spacing};\n }\n ${StyledMessageHeaderMeta} {\n > a {\n color: ${contrastHeaderColor};\n }\n }\n\n ${StyledMediaLink}, ${StyledMediaButton} {\n color: ${contrastContentColor};\n font-size: inherit;\n text-decoration: none;\n font-weight: 700;\n overflow-x: hidden;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n max-width: 100%;\n &:hover {\n color: ${contrastContentColor};\n text-decoration: underline;\n }\n &:visited {\n color: ${contrastContentColor};\n }\n &:focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n }\n }\n\n ${StyledMetaInfoContainer} {\n width: 100%;\n padding: 0 ${spacing};\n ${StyledMetaInfo}, ${StyledStatusInfo} {\n margin-block-end: ${spacing};\n font-size: 0.7rem;\n color: ${metaForegroundColor};\n }\n ${StyledStatusInfo} {\n color: ${statusForegroundColor};\n }\n }\n ${StyledTypingIndicator} {\n width: 4.5rem;\n position: relative;\n height: 2rem;\n }\n `;\n }\n);\nStyledMessageContainer.defaultProps = defaultThemeProp;\ninterface StyledBlinkingDotProps {\n delay?: number;\n}\n\nexport const StyledBlinkingDot = styled.div<StyledBlinkingDotProps>(({ delay = 0, theme }) => {\n return css`\n @keyframes Blinking {\n 0% {\n background: ${theme.base.colors.gray.medium};\n }\n 100% {\n background: ${theme.base.colors.gray['extra-light']};\n }\n }\n animation: Blinking calc(4 * ${theme.base.animation.speed}) infinite;\n background: ${theme.base.colors.gray['extra-light']};\n border-radius: 50%;\n animation-delay: ${delay}s;\n height: 0.4rem;\n width: 0.4rem;\n `;\n});\nStyledBlinkingDot.defaultProps = defaultThemeProp;\n\nexport const StyledUndeliveredIcon = styled(Icon)(\n ({\n theme: {\n base: {\n palette: { urgent }\n }\n }\n }) => {\n return css`\n color: ${urgent};\n `;\n }\n);\n\nStyledUndeliveredIcon.defaultProps = defaultThemeProp;\n\nexport const StyledFlagIcon = styled(Icon)(({ theme }) => {\n return css`\n position: relative;\n inset-block-start: calc(0.5 * ${theme.base.spacing});\n `;\n});\n\nStyledFlagIcon.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"Message.styles.js","sourceRoot":"","sources":["../../../src/components/Chat/Message.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport type { DefaultTheme } from 'styled-components';\nimport { readableColor, rgba, transparentize } from 'polished';\n\nimport {\n defaultThemeProp,\n tryCatch,\n Icon,\n StyledIcon,\n StyledText,\n calculateFontSize\n} from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nimport type { MessageProps } from './Chat.types';\n\nexport const StyledMessageBubbleContent = styled.div``;\n\nexport const StyledMediaList = styled.ul``;\n\nexport const StyledMediaListItem = styled.li``;\n\nexport const StyledSummaryItem = styled.div``;\n\nexport const StyledMediaThumbNail = styled.img``;\n\nexport const StyledMediaLink = styled.a``;\n\nexport const StyledMediaButton = styled(BareButton)``;\n\nexport const StyledMessageMain = styled.div``;\n\nexport const StyledMessageBubble = styled.div``;\n\nexport const StyledMetaInfoContainer = styled.div``;\n\nexport const StyledMetaInfo = styled.span``;\n\nexport const StyledStatusInfo = styled.span``;\n\nexport const StyledTypingIndicator = styled.div``;\n\nexport const StyledMessageHeader = styled.header``;\nexport const StyledMessageHeaderContent = styled.div``;\nexport const StyledMessageHeaderMeta = styled.div``;\n\nexport const StyledHeadsetIconBackground = styled.div``;\ninterface StyledMessageContainerProps {\n senderType: 'customer' \| 'agent' \| 'bot';\n direction: 'in' \| 'out';\n typing: boolean;\n hasMessage: boolean;\n status: string;\n agentVariant: number;\n}\n\nexport const StyledHeadset = styled.div(({ theme }) => {\n return css`\n position: relative;\n\n ${StyledHeadsetIconBackground} {\n position: relative;\n inset-block-start: calc(-5.25 * ${theme.base.spacing});\n inset-inline-start: calc(2 * ${theme.base.spacing});\n height: 1.375rem;\n width: 1.375rem;\n background: ${theme.base.palette['primary-background']};\n border-radius: calc(\n (${theme.base['border-radius']}) * (${theme.components.button['border-radius']})\n );\n\n ${StyledIcon} {\n position: absolute;\n width: 2.875rem;\n height: 0.875rem;\n inset-inline-start: calc(-1.5 * ${theme.base.spacing});\n inset-block-start: calc(0.5 * ${theme.base.spacing});\n }\n }\n `;\n});\n\nStyledHeadset.defaultProps = defaultThemeProp;\n\nexport interface MessageBubbleColor {\n header: string;\n content: string;\n}\n\nexport const getMessageColors: (\n theme: DefaultTheme,\n direction: MessageProps['direction'],\n senderType: MessageProps['senderType'],\n agentVariant: MessageProps['agentVariant']\n) => MessageBubbleColor = (theme, direction, senderType, agentVariant = 0) => {\n const { slate, blue, purple, orange, green, black } = theme.base.colors;\n const agentMessageColors = [\n purple['extra-light'],\n orange['extra-light'],\n '#C5D1DD',\n green['extra-light'],\n '#BBEAEA'\n ];\n const outMessageColor = blue.medium;\n const customerMessageColor = '#E6EEFA';\n const botMessageColor = slate['extra-dark'];\n\n if (direction === 'in') {\n const messageColors: MessageBubbleColor = {\n header: orange.medium,\n content: ''\n };\n if (senderType === 'agent') {\n messageColors.content = agentMessageColors[agentVariant % agentMessageColors.length];\n } else if (senderType === 'bot') {\n messageColors.content = botMessageColor;\n } else if (senderType === 'customer') {\n messageColors.content = customerMessageColor;\n }\n return messageColors;\n }\n return {\n header: black,\n content: outMessageColor\n };\n};\n\nexport const StyledMessageContainer = styled.li<StyledMessageContainerProps>(\n ({\n direction,\n senderType,\n hasMessage,\n typing,\n status,\n agentVariant,\n theme,\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n 'border-radius': borderRadius,\n spacing,\n palette: {\n 'foreground-color': foregroundColor,\n 'secondary-background': secondaryBackground,\n urgent\n },\n transparency: { 'transparent-2': foregroundAlpha }\n }\n }\n }) => {\n const { header, content } = getMessageColors(theme, direction, senderType, agentVariant);\n const metaForegroundColor = tryCatch(() => rgba(foregroundColor, foregroundAlpha));\n const statusForegroundColor = status === 'undeliverable' ? urgent : metaForegroundColor;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n const contrastContentColor = readableColor(content);\n const contrastHeaderColor = readableColor(header);\n return css`\n ${direction === 'out'\n ? css`\n padding-inline-start: calc(4 * ${spacing});\n `\n : css`\n padding-inline-end: calc(4 * ${spacing});\n `}\n margin-block-end: ${typing ? spacing : '0'};\n\n :first-child {\n margin-block-start: ${spacing};\n }\n\n ${StyledMessageMain} {\n max-width: 90%;\n }\n ${StyledMessageBubble} {\n background: ${content};\n border-radius: calc(3 * ${borderRadius}) ${borderRadius} calc(3 * ${borderRadius})\n calc(3 * ${borderRadius});\n overflow: hidden;\n color: ${contrastContentColor};\n display: inline-block;\n width: auto;\n margin-block-end: calc(0.5 * ${spacing});\n\n label {\n color: inherit;\n }\n\n ${direction === 'in' &&\n css`\n border-radius: ${borderRadius} calc(3 * ${borderRadius}) calc(3 * ${borderRadius});\n `}\n\n > ${StyledMessageBubbleContent} {\n padding: ${spacing} calc(2 * ${spacing});\n word-break: break-word;\n white-space: pre-wrap;\n position: relative;\n }\n\n > ${StyledMediaList} {\n color: ${contrastContentColor};\n max-width: 100%;\n\n > ${StyledMediaListItem} {\n position: relative;\n ${StyledMediaThumbNail} {\n max-height: 12rem;\n width: 100%;\n object-fit: contain;\n background-color: ${secondaryBackground};\n }\n ${StyledSummaryItem} {\n padding: ${spacing} calc(3 * ${spacing});\n font-size: ${fontSizes.xxs};\n margin-block-start: calc(0.5 * ${spacing});\n }\n ${StyledSummaryItem}::before {\n content: '';\n padding: ${spacing} 0;\n border-top: 0.0625rem solid ${contrastContentColor};\n position: absolute;\n width: calc(100% - 2rem);\n left: 1rem;\n top: 0;\n }\n ${StyledMediaThumbNail} + ${StyledSummaryItem}::before {\n content: none;\n }\n svg {\n font-size: 1.6rem;\n }\n ${StyledText} {\n color: ${foregroundColor};\n }\n }\n\n ${!hasMessage &&\n css`\n > ${StyledMediaListItem}:first-child {\n > ${StyledSummaryItem}::before {\n border-top: none;\n }\n }\n `}\n }\n\n ${StyledMessageHeader} {\n padding: ${spacing} calc(2 * ${spacing});\n color: ${contrastHeaderColor};\n border-block-end: 0.0625rem solid ${transparentize(0.5, theme.base.colors.white)};\n }\n\n ${StyledMessageHeaderContent} {\n color: ${contrastHeaderColor};\n margin-inline-end: ${spacing};\n }\n ${StyledMessageHeaderMeta} {\n > a {\n color: ${contrastHeaderColor};\n }\n }\n\n ${StyledMediaLink}, ${StyledMediaButton} {\n color: ${contrastContentColor};\n font-size: inherit;\n text-decoration: none;\n font-weight: 700;\n overflow-x: hidden;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n max-width: 100%;\n &:hover {\n color: ${contrastContentColor};\n text-decoration: underline;\n }\n &:visited {\n color: ${contrastContentColor};\n }\n &:focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n }\n }\n\n ${StyledMetaInfoContainer} {\n width: 100%;\n padding: 0 ${spacing};\n ${StyledMetaInfo}, ${StyledStatusInfo} {\n margin-block-end: ${spacing};\n font-size: 0.7rem;\n color: ${metaForegroundColor};\n }\n ${StyledStatusInfo} {\n color: ${statusForegroundColor};\n }\n }\n ${StyledTypingIndicator} {\n width: 4.5rem;\n position: relative;\n height: 2rem;\n }\n `;\n }\n);\nStyledMessageContainer.defaultProps = defaultThemeProp;\ninterface StyledBlinkingDotProps {\n delay?: number;\n}\n\nexport const StyledBlinkingDot = styled.div<StyledBlinkingDotProps>(({ delay = 0, theme }) => {\n return css`\n @keyframes Blinking {\n 0% {\n background: ${theme.base.colors.gray.medium};\n }\n 100% {\n background: ${theme.base.colors.gray['extra-light']};\n }\n }\n animation: Blinking calc(4 * ${theme.base.animation.speed}) infinite;\n background: ${theme.base.colors.gray['extra-light']};\n border-radius: 50%;\n animation-delay: ${delay}s;\n height: 0.4rem;\n width: 0.4rem;\n `;\n});\nStyledBlinkingDot.defaultProps = defaultThemeProp;\n\nexport const StyledUndeliveredIcon = styled(Icon)(\n ({\n theme: {\n base: {\n palette: { urgent }\n }\n }\n }) => {\n return css`\n color: ${urgent};\n `;\n }\n);\n\nStyledUndeliveredIcon.defaultProps = defaultThemeProp;\n\nexport const StyledFlagIcon = styled(Icon)(({ theme }) => {\n return css`\n position: relative;\n inset-block-start: calc(0.5 * ${theme.base.spacing});\n `;\n});\n\nStyledFlagIcon.defaultProps = defaultThemeProp;\n"]}

package/lib/components/Chat/SuggestedReplyPicker.d.ts CHANGED Viewed

@@ -1,23 +1,34 @@
-import { FunctionComponent, Ref } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { ChatComposerProps } from './ChatComposer';
+import type { FunctionComponent, Ref } from 'react';
+import type { ForwardProps, OmitStrict } from '@pega/cosmos-react-core';
+import type { ChatComposerProps } from './ChatComposer';
 export declare const StyledSuggestedReplyHeader: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledSuggestedReplyContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledReply: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledRepliesAction: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledNotification: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledSuggestedReplyIcon: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {
+export declare const StyledSuggestedReplyIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, import("styled-components").DefaultTheme, {
     suggestedReplyCollapsed?: boolean | undefined;
 }, never>;
-export interface SuggestedReply {
+export interface SuggestedReplyItem {
     /** Id for this suggested reply */
     id: string;
     /** Suggested reply message */
     message: string;
-    /** Confidence of this suggested reply */
-    confidence: number;
+    /** type of this suggested reply */
+    type: 'dialogue' | 'genAIReply';
 }
-export interface SuggestedReplyPickerProps extends Pick<ChatComposerProps, 'onSend' | 'maxLength'> {
+interface ReplyLoadingState extends OmitStrict<SuggestedReplyItem, 'message'> {
+    /** loading until reply is retrieved */
+    loading: boolean;
+}
+interface ReplyErrorState extends SuggestedReplyItem {
+    /** If there are no suggestions from GenAI or if there is an error */
+    errorType: 'noSuggestions' | 'error';
+}
+export type SuggestedReply = SuggestedReplyItem | ReplyLoadingState | ReplyErrorState;
+export declare const isReplyLoadingState: (reply: SuggestedReply) => reply is ReplyLoadingState;
+export declare const isReplyErrorState: (reply: SuggestedReply) => reply is ReplyErrorState;
+export interface SuggestedReplyPickerProps extends Pick<ChatComposerProps, 'onSend' | 'maxLength' | 'disabled'> {
     /** ref to the element */
     ref?: Ref<HTMLDivElement>;
     /** Suggested replies */

package/lib/components/Chat/SuggestedReplyPicker.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SuggestedReplyPicker.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/SuggestedReplyPicker.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,~~EAAc~~,iBAAiB,EAAmB,GAAG,~~EAAa~~,MAAM,OAAO,CAAC;~~AAGvF~~,OAAO,~~EAQL~~,YAAY,~~EAMb~~,MAAM,yBAAyB,CAAC;~~AAMjC~~,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;~~AAInD~~,eAAO,MAAM,0BAA0B,yGAAe,CAAC;AACvD,eAAO,MAAM,2BAA2B,yGAAe,CAAC;AACxD,eAAO,MAAM,WAAW,yGAAe,CAAC;AACxC,eAAO,MAAM,mBAAmB,yGAAe,CAAC;AAChD,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAI/C,eAAO,MAAM,wBAAwB;;SAqBpC,CAAC;AAoCF,MAAM,WAAW,~~cAAc~~;~~IAC7B~~,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,8BAA8B;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,~~yCAAyC~~;~~IACzC~~,UAAU,EAAE,~~MAAM~~,CAAC;~~CACpB~~;AAED,MAAM,WAAW,~~yBAA0B~~,SAAQ,IAAI,CAAC,iBAAiB,EAAE,QAAQ,GAAG,WAAW,CAAC;~~IAChG~~,yBAAyB;IACzB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,wBAAwB;IACxB,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,8BAA8B;IAC9B,cAAc,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,CAAC;IACtC;;OAEG;IACH,aAAa,EAAE,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAClD,iCAAiC;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,4CAA4C;IAC5C,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,gEAAgE;IAChE,QAAQ,EAAE,CAAC,cAAc,EAAE,cAAc,KAAK,IAAI,CAAC;IACnD,yCAAyC;IACzC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;~~AAED~~,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,GAAG,YAAY,~~CAqNlF~~,CAAC;AAEL,eAAe,oBAAoB,CAAC"}
1	+ {"version":3,"file":"SuggestedReplyPicker.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/SuggestedReplyPicker.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAoBrE,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAMxE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAIxD,eAAO,MAAM,0BAA0B,yGAAe,CAAC;AACvD,eAAO,MAAM,2BAA2B,yGAAe,CAAC;AACxD,eAAO,MAAM,WAAW,yGAAe,CAAC;AACxC,eAAO,MAAM,mBAAmB,yGAAe,CAAC;AAChD,eAAO,MAAM,kBAAkB,yGAAe,CAAC;AAI/C,eAAO,MAAM,wBAAwB;;SAqBpC,CAAC;AAoCF,MAAM,WAAW,kBAAkB;IACjC,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,8BAA8B;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,mCAAmC;IACnC,IAAI,EAAE,UAAU,GAAG,YAAY,CAAC;CACjC;AAED,UAAU,iBAAkB,SAAQ,UAAU,CAAC,kBAAkB,EAAE,SAAS,CAAC;IAC3E,uCAAuC;IACvC,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,eAAgB,SAAQ,kBAAkB;IAClD,qEAAqE;IACrE,SAAS,EAAE,eAAe,GAAG,OAAO,CAAC;CACtC;AAED,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,eAAe,CAAC;AAEtF,eAAO,MAAM,mBAAmB,UAAW,cAAc,+BAExD,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAW,cAAc,6BAEtD,CAAC;AAEF,MAAM,WAAW,yBACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,QAAQ,GAAG,WAAW,GAAG,UAAU,CAAC;IACpE,yBAAyB;IACzB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,wBAAwB;IACxB,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B,8BAA8B;IAC9B,cAAc,CAAC,EAAE,cAAc,CAAC,IAAI,CAAC,CAAC;IACtC;;OAEG;IACH,aAAa,EAAE,CAAC,EAAE,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAClD,iCAAiC;IACjC,SAAS,EAAE,OAAO,CAAC;IACnB,4CAA4C;IAC5C,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,gEAAgE;IAChE,QAAQ,EAAE,CAAC,cAAc,EAAE,cAAc,KAAK,IAAI,CAAC;IACnD,yCAAyC;IACzC,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAUD,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,GAAG,YAAY,CA8RlF,CAAC;AAEL,eAAe,oBAAoB,CAAC"}