@pega/cosmos-react-social 3.0.0-dev.4.2 → 3.0.0-dev.7.0

package/lib/components/Email/Email.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Email.types.js","sourceRoot":"","sources":["../../../src/components/Email/Email.types.ts"],"names":[],"mappings":"","sourcesContent":["import { MouseEventHandler, ReactNode, Ref } from 'react';\n\nimport {\n  BaseProps,\n  AvatarProps,\n  SentimentProps,\n  FileDisplayProps,\n  FileUploadItemProps,\n  OmitStrict,\n  MenuProps,\n  MenuItemProps,\n  TooltipProps,\n  NoChildrenProp,\n  EmptyStateProps,\n  ProgressProps\n} from '@pega/cosmos-react-core';\nimport { RichTextEditorProps } from '@pega/cosmos-react-rte';\n\nexport interface EmailTemplate {\n  /** Template title */\n  title: string;\n  /** Template id */\n  id: string;\n}\n\nexport interface EmailUser {\n  /** Short name of the User */\n  shortName: string;\n  /** Full name of the User */\n  fullName: string;\n  /** Email of the User */\n  emailAddress: string;\n  /** Avatar props of the User */\n  avatarProps?: Partial<AvatarProps>;\n}\n\nexport interface EntityHighlightMapping {\n  value: string;\n  type: string;\n  name: string;\n  variant: number;\n  description?: TooltipProps['children'];\n  icon?: string;\n}\n\nexport interface ContextMenuProps\n  extends OmitStrict<MenuProps, 'onItemClick' | 'header' | 'items'> {\n  onItemClick: (selectedValue: { fieldName: string; fieldValue: string }) => void;\n  heading: string;\n  items: MenuItemProps[];\n}\nexport interface EmailProps extends BaseProps, NoChildrenProp {\n  /** Ref to the element */\n  ref?: Ref<HTMLDivElement>;\n  /** Unique ID for this email record */\n  id: string;\n  /** Timestamp of this email as ISO8601 string, timestamp or native Date object. */\n  timeStamp: Date | number | string;\n  /** From email */\n  from: EmailUser;\n  /** To email */\n  to: EmailUser[];\n  /** Carbon copy of email users list */\n  cc?: EmailUser[];\n  /** Blind carbon copy of email users list */\n  bcc?: EmailUser[];\n  /** Sentiment */\n  sentiment?: SentimentProps;\n  /** Subject of the email */\n  subject?: string;\n  /** Body */\n  body?: string;\n  /** Forwarded content */\n  forwardedContent?: string;\n  /**\n   * Entity highlight mapping\n   * This requires body to be passed as a string with html tags\n   */\n  entityHighlightMapping?: EntityHighlightMapping[];\n  /** onReply callback */\n  onReply: (id: EmailProps['id']) => void;\n  /** onForward Callback */\n  onForward: (id: EmailProps['id']) => void;\n  /** onReply callback */\n  onReplyAll?: (id: EmailProps['id']) => void;\n  /** List of suggestions */\n  suggestions?: EmailTemplate[];\n  /** Callback that triggers on click of tag */\n  onSuggestionClick?: (id: EmailProps['id'], suggestionId: EmailTemplate['id']) => void;\n  /** Actions region */\n  actions?: ReactNode;\n  /** Flag that indicates if email is unread\n   * @default false\n   */\n  unRead?: boolean;\n  /** Attachments list */\n  attachments?: FileDisplayProps[];\n  /** Items list in Popover */\n  contextMenu?: ContextMenuProps;\n}\n\nexport interface EmailConversationProps extends BaseProps {\n  /** ref to the element */\n  ref?: Ref<HTMLLIElement>;\n  /** Unique ID for this email conversation record */\n  id: string;\n  /** List of mails */\n  emails: EmailProps[];\n  /** Sender(s) of this email conversation */\n  from: EmailUser;\n  /** Recipient(s) of this email conversation */\n  to: EmailUser[];\n  /** Count of unread emails */\n  unReadEmailCount?: number;\n  /** Timestamp of this conversation as ISO8601 string, timestamp or native Date object. */\n  timeStamp: Date | string | number;\n  /** Flag that indicates if email conversation is expanded */\n  isCollapsed?: boolean;\n  /** Flag to set if conversation is spun off from forwarded email */\n  isForwarded?: boolean;\n  /** Callback when email conversation is collapsed */\n  onCollapse?: () => void;\n  /** Callback when email conversation is expanded */\n  onExpand?: () => void;\n}\n\nexport interface EmailComposerData\n  extends Pick<\n    EmailComposerProps,\n    'cc' | 'bcc' | 'subject' | 'bodyContent' | 'attachments' | 'responseType'\n  > {\n  /** Array to hold the initial participants that should be default initialized in To address. */\n  to: EmailUser['emailAddress'][];\n}\n\nexport type EmailResponseType = 'reply' | 'replyAll' | 'forward';\n\nexport interface EmailDirectRecipients {\n  /** To address/addresses in case of reply response type on email. */\n  reply: EmailUser['emailAddress'][];\n  /** To address/addresses in case of replyAll response type on email. */\n  replyAll: EmailUser['emailAddress'][];\n  /** To address/addresses in case of forward response type on email. */\n  forward?: EmailUser['emailAddress'][];\n}\n\nexport interface EmailComposerProps\n  extends Pick<EmailProps, 'attachments' | 'suggestions' | 'onSuggestionClick'>,\n    BaseProps,\n    NoChildrenProp {\n  /** Show loader until the background process completes */\n  progress?: boolean | Pick<ProgressProps, 'message'>;\n  /** Object containing full list of email participants. */\n  participants: EmailUser[];\n  /** Object to hold initial to address/addresses based on different action types. */\n  to?: EmailDirectRecipients;\n  /** Array to hold the initial participants that should be default initialized in Cc address. */\n  cc?: EmailUser['emailAddress'][];\n  /** Array to hold the initial participants that should be default initialized in Bcc address. */\n  bcc?: EmailUser['emailAddress'][];\n  /** Object containing the props to render the subject input */\n  subject: string;\n  /** Body content of the email */\n  bodyContent: string;\n  /** Template id to select the initial template */\n  defaultTemplateId?: EmailTemplate['id'];\n  /** Callback when email needs to be sent */\n  onSend: (data: EmailComposerData) => void;\n  /** Callback when image is added */\n  onImageAdded?: RichTextEditorProps['onImageAdded'];\n  /** List of attachments */\n  attachments?: FileUploadItemProps[];\n  /** Region to show more actions in footer */\n  footerMoreActions?: ReactNode;\n  /** Templates for drafting email */\n  templates?: Pick<EmailTemplate, 'id' | 'title'>[];\n  /** Template change callback */\n  onTemplateChange?: (id: EmailTemplate['id']) => string;\n  /** Callback when cancel composing */\n  onCancel: () => void;\n  /**\n   * Callback to handle external entry validation\n   * If returned true considers the entry to be a valid entry\n   */\n  externalValidator?: (value: string) => boolean;\n  /** Ref to the element */\n  ref?: Ref<HTMLDivElement>;\n  /** Email action types */\n  responseType?: EmailResponseType;\n}\nexport interface EmailShellProps extends BaseProps {\n  /** ref to the element */\n  ref?: Ref<HTMLDivElement>;\n  /** Region for header */\n  headerProps?: {\n    /** Region for actions */\n    actions?: ReactNode;\n    /** Subject of the email conversations list */\n    subject?: string;\n  };\n  /** Email conversations */\n  conversations?: EmailConversationProps[];\n  /** Shows only one conversation at a time */\n  autoCollapse?: boolean;\n}\n\nexport interface EmailSummaryItemProps extends BaseProps {\n  /** Id of each summary item */\n  id: string;\n  /** List of from participant names of the conversations */\n  activeParticipants: EmailUser[];\n  /** Email body of last email in the email */\n  message: string;\n  /** Timestamp of the latest email */\n  timeStamp: Date | string | number;\n  /** Top topic of an email */\n  topic?: string;\n  /** Sentiment */\n  sentiment?: SentimentProps;\n  /** Urgency of an email */\n  urgency?: number;\n  /** Total number of unread emails in the email */\n  unreadEmailCount?: number;\n  /** Is the email currently active */\n  active?: boolean;\n  /** On click of email item */\n  onClick: MouseEventHandler;\n  /** ref to the element */\n  ref?: Ref<HTMLButtonElement>;\n}\n\nexport interface Filter {\n  /** Sets DOM id for the control and associates label element via 'for' attribute. */\n  id: string;\n  /** Pass a string or a fragment with an Icon and string for the filter label. */\n  label: ReactNode;\n  /**\n   * Disables the filter.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Sets on prop via onFilterChange.\n   * @default false\n   */\n  on?: boolean;\n}\n\nexport interface EmailSummaryListProps extends BaseProps {\n  /** List of email categories */\n  categories: MenuProps['items'];\n  /** Handles category change */\n  onCategoryClick?: MenuItemProps['onClick'];\n  /** List of EmailItems items */\n  items: OmitStrict<EmailSummaryItemProps, 'onClick' | 'active'>[];\n  /** Total number of unread email count */\n  unreadEmailCount?: number;\n  /** A set of filters to apply to the email inbox. */\n  filters?: Filter[];\n  /** A callback that runs when a filter is clicked. */\n  onFilterChange?: (filterId: Filter['id'], on: boolean) => void;\n  /** onClick of list item */\n  onItemClick: (id: EmailSummaryItemProps['id']) => void;\n  /** Indicates if the data is being currently loading */\n  loading?: boolean;\n  /** Callback to fetch more rows */\n  onLoadMore?: () => void;\n  /** ref to the element */\n  ref?: Ref<HTMLDivElement>;\n  /** Empty message when there are no email summary items  */\n  emptyMessage?: EmptyStateProps['message'];\n}\n\nexport interface EmailEntityProps extends BaseProps {\n  entity: EntityHighlightMapping;\n  ref?: Ref<HTMLElement>;\n}\n\nexport interface TargetProps {\n  cursorPosition: { x: number; y: number };\n  targetNode: Node | null;\n}\n\nexport interface ContextMenuPopoverProps extends BaseProps, TargetProps {\n  contextMenu: ContextMenuProps;\n}\n\nexport interface EntityListProps extends BaseProps {\n  content: {\n    name: string;\n    value?: {\n      id: string;\n      entity: EntityHighlightMapping;\n    }[];\n  }[];\n\n  header: {\n    icon: string;\n    text: string;\n  };\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport interface StyledContextMenuFieldSelectorProps extends BaseProps {\n  selected?: boolean;\n}\n"]}
+{"version":3,"file":"Email.types.js","sourceRoot":"","sources":["../../../src/components/Email/Email.types.ts"],"names":[],"mappings":"","sourcesContent":["import { MouseEventHandler, ReactNode, Ref } from 'react';\n\nimport {\n  BaseProps,\n  AvatarProps,\n  SentimentProps,\n  FileDisplayProps,\n  FileUploadItemProps,\n  OmitStrict,\n  MenuProps,\n  MenuItemProps,\n  TooltipProps,\n  NoChildrenProp,\n  EmptyStateProps,\n  ProgressProps\n} from '@pega/cosmos-react-core';\nimport { RichTextEditorProps } from '@pega/cosmos-react-rte';\n\nexport interface EmailTemplate {\n  /** Template title */\n  title: string;\n  /** Template id */\n  id: string;\n}\n\nexport interface EmailUser {\n  /** Short name of the User */\n  shortName: string;\n  /** Full name of the User */\n  fullName: string;\n  /** Email of the User */\n  emailAddress: string;\n  /** Avatar props of the User */\n  avatarProps?: Partial<AvatarProps>;\n}\n\nexport interface EntityHighlightMapping {\n  value: string;\n  type: string;\n  name: string;\n  variant: number;\n  description?: TooltipProps['children'];\n  icon?: string;\n}\n\nexport interface ContextMenuProps\n  extends OmitStrict<MenuProps, 'onItemClick' | 'header' | 'items'> {\n  onItemClick: (selectedValue: { fieldName: string; fieldValue: string }) => void;\n  heading: string;\n  items: MenuItemProps[];\n}\nexport interface EmailProps extends BaseProps, NoChildrenProp {\n  /** Ref to the element */\n  ref?: Ref<HTMLDivElement>;\n  /** Unique ID for this email record */\n  id: string;\n  /** Timestamp of this email as ISO8601 string, timestamp or native Date object. */\n  timeStamp: Date | number | string;\n  /** From email */\n  from: EmailUser;\n  /** To email */\n  to: EmailUser[];\n  /** Carbon copy of email users list */\n  cc?: EmailUser[];\n  /** Blind carbon copy of email users list */\n  bcc?: EmailUser[];\n  /** Sentiment */\n  sentiment?: SentimentProps;\n  /** Subject of the email */\n  subject?: string;\n  /** Body */\n  body?: string;\n  /** Forwarded content */\n  forwardedContent?: string;\n  /**\n   * Entity highlight mapping\n   * This requires body to be passed as a string with html tags\n   */\n  entityHighlightMapping?: EntityHighlightMapping[];\n  /** onReply callback */\n  onReply: (id: EmailProps['id']) => void;\n  /** onForward Callback */\n  onForward: (id: EmailProps['id']) => void;\n  /** onReply callback */\n  onReplyAll?: (id: EmailProps['id']) => void;\n  /** List of suggestions */\n  suggestions?: EmailTemplate[];\n  /** Callback that triggers on click of tag */\n  onSuggestionClick?: (id: EmailProps['id'], suggestionId: EmailTemplate['id']) => void;\n  /** Actions region */\n  actions?: ReactNode;\n  /** Flag that indicates if email is unread\n   * @default false\n   */\n  unRead?: boolean;\n  /** Attachments list */\n  attachments?: FileDisplayProps[];\n  /** Items list in Popover */\n  contextMenu?: ContextMenuProps;\n}\n\nexport interface EmailConversationProps extends BaseProps {\n  /** ref to the element */\n  ref?: Ref<HTMLLIElement>;\n  /** Unique ID for this email conversation record */\n  id: string;\n  /** List of mails */\n  emails: EmailProps[];\n  /** Sender(s) of this email conversation */\n  from: EmailUser;\n  /** Recipient(s) of this email conversation */\n  to: EmailUser[];\n  /** Count of unread emails */\n  unReadEmailCount?: number;\n  /** Timestamp of this conversation as ISO8601 string, timestamp or native Date object. */\n  timeStamp: Date | string | number;\n  /** Flag that indicates if email conversation is expanded */\n  isCollapsed?: boolean;\n  /** Flag to set if conversation is spun off from forwarded email */\n  isForwarded?: boolean;\n  /** Callback when email conversation is collapsed */\n  onCollapse?: () => void;\n  /** Callback when email conversation is expanded */\n  onExpand?: () => void;\n}\n\nexport interface EmailComposerData\n  extends Pick<\n    EmailComposerProps,\n    'cc' | 'bcc' | 'subject' | 'bodyContent' | 'attachments' | 'responseType'\n  > {\n  /** Array to hold the initial participants that should be default initialized in To address. */\n  to: EmailUser['emailAddress'][];\n}\n\nexport type EmailResponseType = 'reply' | 'replyAll' | 'forward';\n\nexport interface EmailDirectRecipients {\n  /** To address/addresses in case of reply response type on email. */\n  reply: EmailUser['emailAddress'][];\n  /** To address/addresses in case of replyAll response type on email. */\n  replyAll: EmailUser['emailAddress'][];\n  /** To address/addresses in case of forward response type on email. */\n  forward?: EmailUser['emailAddress'][];\n}\n\nexport interface EmailComposerProps\n  extends Pick<EmailProps, 'attachments' | 'suggestions' | 'onSuggestionClick'>,\n    BaseProps,\n    NoChildrenProp {\n  /** Show loader until the background process completes */\n  progress?: boolean | Pick<ProgressProps, 'message'>;\n  /** Object containing full list of email participants. */\n  participants: EmailUser[];\n  /** Object to hold initial to address/addresses based on different action types. */\n  to?: EmailDirectRecipients;\n  /** Array to hold the initial participants that should be default initialized in Cc address. */\n  cc?: EmailUser['emailAddress'][];\n  /** Array to hold the initial participants that should be default initialized in Bcc address. */\n  bcc?: EmailUser['emailAddress'][];\n  /** Object containing the props to render the subject input */\n  subject: string;\n  /** Body content of the email */\n  bodyContent: string;\n  /** Template id to select the initial template */\n  defaultTemplateId?: EmailTemplate['id'];\n  /** Callback when email needs to be sent */\n  onSend: (data: EmailComposerData) => void;\n  /** Callback when image is added */\n  onImageAdded?: RichTextEditorProps['onImageAdded'];\n  /** List of attachments */\n  attachments?: FileUploadItemProps[];\n  /** Region to show more actions in footer */\n  footerMoreActions?: ReactNode;\n  /** Templates for drafting email */\n  templates?: Pick<EmailTemplate, 'id' | 'title'>[];\n  /** Template change callback */\n  onTemplateChange?: (id: EmailTemplate['id']) => string | Promise<string>;\n  /** Callback when cancel composing */\n  onCancel: () => void;\n  /**\n   * Callback to handle external entry validation\n   * If returned true considers the entry to be a valid entry\n   */\n  externalValidator?: (value: string) => boolean;\n  /** Ref to the element */\n  ref?: Ref<HTMLDivElement>;\n  /** Email action types */\n  responseType?: EmailResponseType;\n}\nexport interface EmailShellProps extends BaseProps {\n  /** ref to the element */\n  ref?: Ref<HTMLDivElement>;\n  /** Region for header */\n  headerProps?: {\n    /** Region for actions */\n    actions?: ReactNode;\n    /** Subject of the email conversations list */\n    subject?: string;\n  };\n  /** Email conversations */\n  conversations?: EmailConversationProps[];\n  /** Shows only one conversation at a time */\n  autoCollapse?: boolean;\n}\n\nexport interface EmailSummaryItemProps extends BaseProps {\n  /** Id of each summary item */\n  id: string;\n  /** List of from participant names of the conversations */\n  activeParticipants: EmailUser[];\n  /** Email body of last email in the email */\n  message: string;\n  /** Timestamp of the latest email */\n  timeStamp: Date | string | number;\n  /** Top topic of an email */\n  topic?: string;\n  /** Sentiment */\n  sentiment?: SentimentProps;\n  /** Urgency of an email */\n  urgency?: number;\n  /** Total number of unread emails in the email */\n  unreadEmailCount?: number;\n  /** Is the email currently active */\n  active?: boolean;\n  /** On click of email item */\n  onClick: MouseEventHandler;\n  /** ref to the element */\n  ref?: Ref<HTMLButtonElement>;\n}\n\nexport interface Filter {\n  /** Sets DOM id for the control and associates label element via 'for' attribute. */\n  id: string;\n  /** Pass a string or a fragment with an Icon and string for the filter label. */\n  label: ReactNode;\n  /**\n   * Disables the filter.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Sets on prop via onFilterChange.\n   * @default false\n   */\n  on?: boolean;\n}\n\nexport interface EmailSummaryListProps extends BaseProps {\n  /** List of email categories */\n  categories: MenuProps['items'];\n  /** Handles category change */\n  onCategoryClick?: MenuItemProps['onClick'];\n  /** List of EmailItems items */\n  items: OmitStrict<EmailSummaryItemProps, 'onClick' | 'active'>[];\n  /** Total number of unread email count */\n  unreadEmailCount?: number;\n  /** A set of filters to apply to the email inbox. */\n  filters?: Filter[];\n  /** A callback that runs when a filter is clicked. */\n  onFilterChange?: (filterId: Filter['id'], on: boolean) => void;\n  /** onClick of list item */\n  onItemClick: (id: EmailSummaryItemProps['id']) => void;\n  /** Indicates if the data is being currently loading */\n  loading?: boolean;\n  /** Callback to fetch more rows */\n  onLoadMore?: () => void;\n  /** ref to the element */\n  ref?: Ref<HTMLDivElement>;\n  /** Empty message when there are no email summary items  */\n  emptyMessage?: EmptyStateProps['message'];\n}\n\nexport interface EmailEntityProps extends BaseProps {\n  entity: EntityHighlightMapping;\n  ref?: Ref<HTMLElement>;\n}\n\nexport interface TargetProps {\n  cursorPosition: { x: number; y: number };\n  targetNode: Node | null;\n}\n\nexport interface ContextMenuPopoverProps extends BaseProps, TargetProps {\n  contextMenu: ContextMenuProps;\n}\n\nexport interface EntityListProps extends BaseProps {\n  content: {\n    name: string;\n    value?: {\n      id: string;\n      entity: EntityHighlightMapping;\n    }[];\n  }[];\n\n  header: {\n    icon: string;\n    text: string;\n  };\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport interface StyledContextMenuFieldSelectorProps extends BaseProps {\n  selected?: boolean;\n}\n"]}

package/lib/components/Email/EmailComposer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmailComposer.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailComposer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAGL,IAAI,EAYL,MAAM,yBAAyB,CAAC;AAOjC,OAAO,EAAE,kBAAkB,EAAa,MAAM,eAAe,CAAC;AAK9D,eAAO,MAAM,mBAAmB,yHAW9B,CAAC;AAEH,eAAO,MAAM,sBAAsB,EAAE,OAAO,IAI1C,CAAC;AAIH,eAAO,MAAM,kBAAkB,qNAK7B,CAAC;AAmBH,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,CAqVxD,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"EmailComposer.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailComposer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAGL,IAAI,EAYL,MAAM,yBAAyB,CAAC;AAOjC,OAAO,EAAE,kBAAkB,EAA4B,MAAM,eAAe,CAAC;AAK7E,eAAO,MAAM,mBAAmB,yHAW9B,CAAC;AAEH,eAAO,MAAM,sBAAsB,EAAE,OAAO,IAI1C,CAAC;AAIH,eAAO,MAAM,kBAAkB,qNAK7B,CAAC;AAkBH,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,CA6VxD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/Email/EmailComposer.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { forwardRef, useState, useMemo, useRef, useCallback, useEffect } from 'react';
 import styled, { css } from 'styled-components';
 import { Button, Flex, Icon, registerIcon, useI18n, Option, defaultThemeProp, FileUploadItem, MenuButton, Select, Input, useUID, Progress } from '@pega/cosmos-react-core';
-import { RichTextEditor } from '@pega/cosmos-react-rte';
+import { Editor } from '@pega/cosmos-react-rte';
 import * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';
 import * as replyAllIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply-all.icon';
 import * as replyIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply.icon';
@@ -40,24 +40,21 @@ const responseTypeIcons = {
     replyAll: 'reply-all',
     forward: 'forward'
 };
-const rteToolbar = [
+const editorToolbar = [
     'inline-styling',
-    'headers',
     'lists',
+    'indentation',
     'images',
-    'cut-copy-paste',
-    'indentation'
+    'links'
 ];
-const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend, onImageAdded, externalValidator, onTemplateChange, to, footerMoreActions, progress = false, templates, defaultTemplateId, ...restProps }, ref) => {
+const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend, onImageAdded, externalValidator, onTemplateChange, to, footerMoreActions, progress = false, templates, defaultTemplateId, cc, bcc, responseType: responseTypeProp, subject: subjectProp, attachments: attachmentsProp, ...restProps }, ref) => {
     const t = useI18n();
-    const [cc, setCC] = useState(restProps.cc);
-    const [bcc, setBCC] = useState(restProps.bcc);
-    const [responseType, setResponseType] = useState(restProps.responseType);
-    const [showCC, setShowCC] = useState(restProps.responseType !== 'reply' && !!cc && cc.length > 0);
-    const [showBCC, setShowBCC] = useState(restProps.responseType !== 'reply' && !!bcc && bcc.length > 0);
-    const [subject, setSubject] = useState(restProps.subject);
+    const [responseType, setResponseType] = useState(responseTypeProp);
+    const [showCC, setShowCC] = useState(responseTypeProp !== 'reply' && !!cc && cc.length > 0);
+    const [showBCC, setShowBCC] = useState(responseTypeProp !== 'reply' && !!bcc && bcc.length > 0);
+    const [subject, setSubject] = useState(subjectProp);
     const [autoReplyTemplate, setAutoReplyTemplate] = useState(defaultTemplateId || '');
-    const [attachments, setAttachments] = useState(restProps.attachments || []);
+    const [attachments, setAttachments] = useState(attachmentsProp || []);
     const [toAddresses, setToAddresses] = useState(() => {
         if (responseType && to?.[responseType])
             return to?.[responseType];
@@ -73,27 +70,37 @@ const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend,
             return bcc;
         return [];
     });
-    const initialCC = cc;
-    const initialBCC = bcc;
-    const rteEditorRef = useRef(null);
+    const editorRef = useRef(null);
     const fileUploadInputRef = useRef(null);
     const uid = useUID();
+    const replaceBodyWithTemplate = async (templateId) => {
+        if (templateId && onTemplateChange) {
+            const templateContent = await onTemplateChange(templateId);
+            editorRef?.current?.insertHtml(templateContent, true);
+        }
+    };
     // inserts selected template in RTE
     useEffect(() => {
         const selectedTemplate = templates?.find(template => template.id === autoReplyTemplate);
         if (selectedTemplate) {
-            rteEditorRef?.current?.insertHtml(onTemplateChange?.(selectedTemplate.id), true);
+            replaceBodyWithTemplate(selectedTemplate.id);
         }
     }, [autoReplyTemplate]);
     // resets To | CC | BCC combobox selection and toggles fields on responseType change reply | replyAll | forward
     useEffect(() => {
+        if (responseType && to?.[responseType]) {
+            setToAddresses(to?.[responseType]);
+        }
+        else {
+            setToAddresses([]);
+        }
         setShowCC(responseType === 'replyAll' ? !!cc && cc.length > 0 : false);
-        setShowBCC(responseType === 'replyAll' && !!bcc && bcc?.length > 0 ? !!bcc : false);
+        setShowBCC(responseType === 'replyAll' ? !!bcc && bcc.length > 0 : false);
         if (responseType === 'replyAll') {
-            setCC(initialCC);
-            setBCC(initialBCC);
+            setCcAddresses(cc || []);
+            setBccAddresses(bcc || []);
         }
-        if (responseType === 'reply') {
+        else if (responseType === 'reply') {
             setCcAddresses([]);
             setBccAddresses([]);
         }
@@ -110,7 +117,7 @@ const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend,
             {
                 id: 'reply',
                 primary: t('reply'),
-                visual: _jsx(StyledResponseTypeIcon, { name: responseTypeIcons.reply }, void 0),
+                visual: _jsx(StyledResponseTypeIcon, { name: responseTypeIcons.reply }),
                 selected: responseType === 'reply',
                 onClick: () => {
                     setResponseType('reply');
@@ -119,7 +126,7 @@ const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend,
             {
                 id: 'replyAll',
                 primary: t('reply_all'),
-                visual: _jsx(StyledResponseTypeIcon, { name: responseTypeIcons.replyAll }, void 0),
+                visual: _jsx(StyledResponseTypeIcon, { name: responseTypeIcons.replyAll }),
                 selected: responseType === 'replyAll',
                 onClick: () => {
                     setResponseType('replyAll');
@@ -152,15 +159,15 @@ const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend,
             ]);
         }
     }, []);
-    const selectedItems = (selections, label) => {
+    const updateSelectedItems = (selectedItems, label) => {
         if (label === 'To') {
-            setToAddresses(selections);
+            setToAddresses(selectedItems);
         }
         if (label === 'Cc') {
-            setCcAddresses(selections);
+            setCcAddresses(selectedItems);
         }
         if (label === 'Bcc') {
-            setBccAddresses(selections);
+            setBccAddresses(selectedItems);
         }
     };
     const handleSend = () => {
@@ -169,14 +176,14 @@ const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend,
             cc: showCC ? ccAddresses : undefined,
             bcc: showBCC ? bccAddresses : undefined,
             subject,
-            bodyContent: rteEditorRef.current?.getHtml() || '',
+            bodyContent: editorRef.current?.getHtml() || '',
             attachments,
             responseType
         });
     };
     const handleImageAdded = (image, id) => {
         const src = URL.createObjectURL(image);
-        rteEditorRef.current?.appendImage({ src, alt: image.name }, id);
+        editorRef.current?.appendImage({ src, alt: image.name }, id);
         if (onImageAdded)
             onImageAdded(image, id);
     };
@@ -186,7 +193,7 @@ const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend,
                 }, progress: !!progress, children: [_jsx("div", { children: responseType !== 'forward' && (_jsx(MenuButton, { text: responseTypeMenuData.selectedResponseType, variant: 'link', icon: responseTypeMenuData.selectedResponseTypeIcon, menu: {
                                 mode: 'single-select',
                                 items: responseTypeMenuData.menuItems
-                            } }, void 0)) }, void 0), _jsxs(Flex, { container: {
+                            } })) }), _jsxs(Flex, { container: {
                             alignItems: 'start',
                             gap: 0.5
                         }, children: [_jsx(Flex, { container: {
@@ -194,14 +201,14 @@ const EmailComposer = forwardRef(({ participants, bodyContent, onCancel, onSend,
                                     direction: 'column'
                                 }, item: {
                                     grow: 1
-                                }, children: _jsx(EmailSelector, { participants: participants, defaultSelections: to?.[responseType], label: t('to'), mode: 'multi-select', required: true, selections: selectedItems, externalValidator: externalValidator }, void 0) }, void 0), !showCC && (_jsx(StyledToggleButton, { variant: 'simple', onClick: () => setShowCC(true), icon: true, children: t('cc') }, void 0)), !showBCC && (_jsx(StyledToggleButton, { variant: 'simple', onClick: () => setShowBCC(true), icon: true, children: t('bcc') }, void 0))] }, void 0), showCC && (_jsx(EmailSelector, { participants: participants, defaultSelections: responseType === 'replyAll' ? cc : undefined, label: t('cc'), mode: 'multi-select', selections: selectedItems, externalValidator: externalValidator }, void 0)), showBCC && (_jsx(EmailSelector, { selections: selectedItems, participants: participants, defaultSelections: responseType === 'replyAll' ? bcc : undefined, label: t('bcc'), mode: 'multi-select', externalValidator: externalValidator }, void 0)), _jsx(Input, { value: subject, onChange: onSubjectChange, label: t('subject') }, void 0), _jsxs(Select, { onChange: onTemplateSelectionChange, label: t('auto_reply'), value: autoReplyTemplate, children: [_jsx(Option, { value: uid, children: t('insert') }, uid), _jsx(_Fragment, { children: templateOptions }, void 0)] }, void 0), _jsx(RichTextEditor, { autoFocus: true, ref: rteEditorRef, toolbar: rteToolbar, onImageAdded: handleImageAdded, labelHidden: true, label: t('email_message'), defaultValue: bodyContent, 
+                                }, children: _jsx(EmailSelector, { participants: participants, selectedItems: toAddresses, label: t('to'), mode: 'multi-select', required: true, onSelectedItemChange: updateSelectedItems, externalValidator: externalValidator }) }), !showCC && (_jsx(StyledToggleButton, { variant: 'simple', onClick: () => setShowCC(true), icon: true, children: t('cc') })), !showBCC && (_jsx(StyledToggleButton, { variant: 'simple', onClick: () => setShowBCC(true), icon: true, children: t('bcc') }))] }), showCC && (_jsx(EmailSelector, { participants: participants, selectedItems: ccAddresses, label: t('cc'), mode: 'multi-select', onSelectedItemChange: updateSelectedItems, externalValidator: externalValidator })), showBCC && (_jsx(EmailSelector, { participants: participants, selectedItems: bccAddresses, label: t('bcc'), mode: 'multi-select', onSelectedItemChange: updateSelectedItems, externalValidator: externalValidator })), _jsx(Input, { value: subject, onChange: onSubjectChange, label: t('subject') }), _jsxs(Select, { onChange: onTemplateSelectionChange, label: t('auto_reply'), value: autoReplyTemplate, children: [_jsx(Option, { value: uid, children: t('insert') }, uid), _jsx(_Fragment, { children: templateOptions })] }), _jsx(Editor, { autoFocus: true, ref: editorRef, toolbar: editorToolbar, onImageAdded: handleImageAdded, labelHidden: true, label: t('email_message'), defaultValue: bodyContent, 
                         // Below rem values are derived from min 150px, max 300px minus the approx height of toolbar
                         height: {
                             min: '7rem',
                             max: '16.5rem'
-                        } }, void 0), attachments.length > 0 && (_jsx(Flex, { container: { gap: 1, wrap: 'wrap' }, children: attachments.map(attachment => (_createElement(FileUploadItem, { ...attachment, key: attachment.name, onDelete: onAttachmentDelete }))) }, void 0)), _jsxs(Flex, { container: {
+                        } }), attachments.length > 0 && (_jsx(Flex, { container: { gap: 1, wrap: 'wrap' }, children: attachments.map(attachment => (_createElement(FileUploadItem, { ...attachment, key: attachment.name, onDelete: onAttachmentDelete }))) })), _jsxs(Flex, { container: {
                             gap: 1
-                        }, children: [_jsxs(Flex, { container: true, item: { grow: 1 }, children: [_jsx(Button, { variant: 'secondary', onClick: onCancel, children: t('cancel') }, void 0), footerMoreActions] }, void 0), _jsxs(Flex, { container: true, children: [_jsx(Button, { onClick: () => fileUploadInputRef.current?.click(), variant: 'link', label: t('file_upload_text_multiple'), children: _jsx(Icon, { name: 'paper-clip' }, void 0) }, void 0), _jsx(Button, { variant: 'primary', onClick: handleSend, children: t('send_label') }, void 0)] }, void 0)] }, void 0), _jsx("input", { type: 'file', style: { display: 'none' }, ref: fileUploadInputRef, onChange: onFileChange, multiple: true }, void 0)] }, void 0), !!progress && (_jsx(Progress, { visible: !!progress, placement: 'local', message: typeof progress === 'object' ? progress.message : t('loading') }, void 0))] }, void 0));
+                        }, children: [_jsxs(Flex, { container: true, item: { grow: 1 }, children: [_jsx(Button, { variant: 'secondary', onClick: onCancel, children: t('cancel') }), footerMoreActions] }), _jsxs(Flex, { container: true, children: [_jsx(Button, { onClick: () => fileUploadInputRef.current?.click(), variant: 'link', label: t('file_upload_text_multiple'), children: _jsx(Icon, { name: 'paper-clip' }) }), _jsx(Button, { variant: 'primary', onClick: handleSend, children: t('send_label') })] })] }), _jsx("input", { type: 'file', style: { display: 'none' }, ref: fileUploadInputRef, onChange: onFileChange, multiple: true })] }), _jsx(Progress, { visible: !!progress, placement: 'local', message: typeof progress === 'object' ? progress.message : t('loading') })] }));
 });
 export default EmailComposer;
 //# sourceMappingURL=EmailComposer.js.map

package/lib/components/Email/EmailComposer.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmailComposer.js","sourceRoot":"","sources":["../../../src/components/Email/EmailComposer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  useState,\n  ChangeEvent,\n  useMemo,\n  useRef,\n  useCallback,\n  useEffect,\n  ReactNode\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  Button,\n  Flex,\n  Icon,\n  registerIcon,\n  useI18n,\n  Option,\n  defaultThemeProp,\n  FileUploadItem,\n  MenuButton,\n  FileUploadItemProps,\n  Select,\n  Input,\n  useUID,\n  Progress\n} from '@pega/cosmos-react-core';\nimport { RichTextEditor, RichTextEditorProps, RichTextEditorState } from '@pega/cosmos-react-rte';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\nimport * as replyAllIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply-all.icon';\nimport * as replyIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply.icon';\nimport * as forwardIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/forward.icon';\n\nimport { EmailComposerProps, EmailUser } from './Email.types';\nimport EmailSelector from './EmailSelector';\n\nregisterIcon(paperClipIcon, replyAllIcon, replyIcon, forwardIcon);\n\nexport const StyledEmailComposer = styled.div<EmailComposerProps>(({ progress }) => {\n  return css`\n    max-height: 70vh;\n    ${progress\n      ? css`\n          visibility: hidden;\n        `\n      : css`\n          visibility: visible;\n        `}\n  `;\n});\n\nexport const StyledResponseTypeIcon: typeof Icon = styled(Icon)(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.interactive};\n  `;\n});\n\nStyledResponseTypeIcon.defaultProps = defaultThemeProp;\n\nexport const StyledToggleButton = styled(Button)(({ theme }) => {\n  return css`\n    margin-block-start: calc(2 * ${theme.base.spacing});\n    color: ${theme.base.palette.interactive};\n  `;\n});\n\nStyledToggleButton.defaultProps = defaultThemeProp;\n\nconst responseTypeIcons = {\n  reply: 'reply',\n  replyAll: 'reply-all',\n  forward: 'forward'\n};\n\nconst rteToolbar: RichTextEditorProps['toolbar'] = [\n  'inline-styling',\n  'headers',\n  'lists',\n  'images',\n  'cut-copy-paste',\n  'indentation'\n];\n\nconst EmailComposer: FunctionComponent<EmailComposerProps> = forwardRef(\n  (\n    {\n      participants,\n      bodyContent,\n      onCancel,\n      onSend,\n      onImageAdded,\n      externalValidator,\n      onTemplateChange,\n      to,\n      footerMoreActions,\n      progress = false,\n      templates,\n      defaultTemplateId,\n      ...restProps\n    }: PropsWithoutRef<EmailComposerProps>,\n    ref: EmailComposerProps['ref']\n  ) => {\n    const t = useI18n();\n    const [cc, setCC] = useState(restProps.cc);\n    const [bcc, setBCC] = useState(restProps.bcc);\n    const [responseType, setResponseType] = useState(restProps.responseType);\n    const [showCC, setShowCC] = useState(\n      restProps.responseType !== 'reply' && !!cc && cc.length > 0\n    );\n    const [showBCC, setShowBCC] = useState(\n      restProps.responseType !== 'reply' && !!bcc && bcc.length > 0\n    );\n    const [subject, setSubject] = useState(restProps.subject);\n    const [autoReplyTemplate, setAutoReplyTemplate] = useState(defaultTemplateId || '');\n    const [attachments, setAttachments] = useState(restProps.attachments || []);\n    const [toAddresses, setToAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n      if (responseType && to?.[responseType])\n        return to?.[responseType] as EmailUser['emailAddress'][];\n      return [];\n    });\n    const [ccAddresses, setCcAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n      if (responseType === 'replyAll') return cc as EmailUser['emailAddress'][];\n      return [];\n    });\n    const [bccAddresses, setBccAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n      if (responseType === 'replyAll') return bcc as EmailUser['emailAddress'][];\n      return [];\n    });\n\n    const initialCC = cc;\n    const initialBCC = bcc;\n\n    const rteEditorRef = useRef<RichTextEditorState>(null);\n    const fileUploadInputRef = useRef<HTMLInputElement>(null);\n    const uid = useUID();\n\n    // inserts selected template in RTE\n    useEffect(() => {\n      const selectedTemplate = templates?.find(template => template.id === autoReplyTemplate);\n      if (selectedTemplate) {\n        rteEditorRef?.current?.insertHtml(onTemplateChange?.(selectedTemplate.id) as string, true);\n      }\n    }, [autoReplyTemplate]);\n\n    // resets To | CC | BCC combobox selection and toggles fields on responseType change reply | replyAll | forward\n    useEffect(() => {\n      setShowCC(responseType === 'replyAll' ? !!cc && cc.length > 0 : false);\n      setShowBCC(responseType === 'replyAll' && !!bcc && bcc?.length > 0 ? !!bcc : false);\n      if (responseType === 'replyAll') {\n        setCC(initialCC);\n        setBCC(initialBCC);\n      }\n      if (responseType === 'reply') {\n        setCcAddresses([] as EmailUser['emailAddress'][]);\n        setBccAddresses([] as EmailUser['emailAddress'][]);\n      }\n    }, [responseType]);\n\n    const templateOptions = useMemo(\n      () =>\n        templates &&\n        templates.map(template => {\n          if (template.id === defaultTemplateId) {\n            <Option selected='selected' key={template.id} value={template.id}>\n              {template.title}\n            </Option>;\n          }\n          return (\n            <Option key={template.id} value={template.id}>\n              {template.title}\n            </Option>\n          );\n        }),\n      [templates]\n    );\n\n    const responseTypeMenuData = useMemo(() => {\n      const menuItems = [\n        {\n          id: 'reply',\n          primary: t('reply'),\n          visual: <StyledResponseTypeIcon name={responseTypeIcons.reply} />,\n          selected: responseType === 'reply',\n          onClick: () => {\n            setResponseType('reply');\n          }\n        },\n        {\n          id: 'replyAll',\n          primary: t('reply_all'),\n          visual: <StyledResponseTypeIcon name={responseTypeIcons.replyAll} />,\n          selected: responseType === 'replyAll',\n          onClick: () => {\n            setResponseType('replyAll');\n          }\n        }\n      ];\n      return {\n        menuItems,\n        selectedResponseType:\n          menuItems.find(item => item.selected)?.primary || menuItems[0].primary,\n        selectedResponseTypeIcon:\n          (responseType && responseTypeIcons[responseType]) || responseTypeIcons.reply\n      };\n    }, [responseType]);\n\n    const onSubjectChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n      setSubject(e.target.value);\n    }, []);\n\n    const onTemplateSelectionChange = useCallback((e: ChangeEvent<HTMLSelectElement>) => {\n      setAutoReplyTemplate(e.target.value);\n    }, []);\n\n    const onAttachmentDelete = useCallback((name: FileUploadItemProps['name']) => {\n      setAttachments(prevAttachments => prevAttachments.filter(item => item.name !== name));\n    }, []);\n\n    const onFileChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n      if (e.target.files) {\n        setAttachments(prevAttachments => [\n          ...prevAttachments,\n          ...Array.from(e.target.files!).map(file => ({\n            name: file.name,\n            file\n          }))\n        ]);\n      }\n    }, []);\n\n    const selectedItems = (selections: EmailUser['emailAddress'][], label: ReactNode) => {\n      if (label === 'To') {\n        setToAddresses(selections);\n      }\n      if (label === 'Cc') {\n        setCcAddresses(selections);\n      }\n      if (label === 'Bcc') {\n        setBccAddresses(selections);\n      }\n    };\n    const handleSend = () => {\n      onSend({\n        to: toAddresses,\n        cc: showCC ? ccAddresses : undefined,\n        bcc: showBCC ? bccAddresses : undefined,\n        subject,\n        bodyContent: rteEditorRef.current?.getHtml() || '',\n        attachments,\n        responseType\n      });\n    };\n\n    const handleImageAdded = (image: File, id: string) => {\n      const src = URL.createObjectURL(image);\n      rteEditorRef.current?.appendImage({ src, alt: image.name }, id);\n      if (onImageAdded) onImageAdded(image, id);\n    };\n\n    return (\n      <>\n        <Flex\n          as={StyledEmailComposer}\n          ref={ref}\n          {...restProps}\n          container={{\n            gap: 2,\n            direction: 'column'\n          }}\n          progress={!!progress}\n        >\n          <div>\n            {responseType !== 'forward' && (\n              <MenuButton\n                text={responseTypeMenuData.selectedResponseType}\n                variant='link'\n                icon={responseTypeMenuData.selectedResponseTypeIcon}\n                menu={{\n                  mode: 'single-select',\n                  items: responseTypeMenuData.menuItems\n                }}\n              />\n            )}\n          </div>\n\n          <Flex\n            container={{\n              alignItems: 'start',\n              gap: 0.5\n            }}\n          >\n            <Flex\n              container={{\n                gap: 1,\n                direction: 'column'\n              }}\n              item={{\n                grow: 1\n              }}\n            >\n              <EmailSelector\n                participants={participants}\n                defaultSelections={to?.[responseType!]}\n                label={t('to')}\n                mode='multi-select'\n                required\n                selections={selectedItems}\n                externalValidator={externalValidator}\n              />\n            </Flex>\n            {!showCC && (\n              <StyledToggleButton variant='simple' onClick={() => setShowCC(true)} icon>\n                {t('cc')}\n              </StyledToggleButton>\n            )}\n            {!showBCC && (\n              <StyledToggleButton variant='simple' onClick={() => setShowBCC(true)} icon>\n                {t('bcc')}\n              </StyledToggleButton>\n            )}\n          </Flex>\n\n          {showCC && (\n            <EmailSelector\n              participants={participants}\n              defaultSelections={responseType === 'replyAll' ? cc : undefined}\n              label={t('cc')}\n              mode='multi-select'\n              selections={selectedItems}\n              externalValidator={externalValidator}\n            />\n          )}\n          {showBCC && (\n            <EmailSelector\n              selections={selectedItems}\n              participants={participants}\n              defaultSelections={responseType === 'replyAll' ? bcc : undefined}\n              label={t('bcc')}\n              mode='multi-select'\n              externalValidator={externalValidator}\n            />\n          )}\n\n          <Input value={subject} onChange={onSubjectChange} label={t('subject')} />\n\n          <Select\n            onChange={onTemplateSelectionChange}\n            label={t('auto_reply')}\n            value={autoReplyTemplate}\n          >\n            <Option key={uid} value={uid}>\n              {t('insert')}\n            </Option>\n            <>{templateOptions}</>\n          </Select>\n\n          <RichTextEditor\n            autoFocus\n            ref={rteEditorRef}\n            toolbar={rteToolbar}\n            onImageAdded={handleImageAdded}\n            labelHidden\n            label={t('email_message')}\n            defaultValue={bodyContent}\n            // Below rem values are derived from min 150px, max 300px minus the approx height of toolbar\n            height={{\n              min: '7rem',\n              max: '16.5rem'\n            }}\n          />\n          {attachments.length > 0 && (\n            <Flex container={{ gap: 1, wrap: 'wrap' }}>\n              {attachments.map(attachment => (\n                <FileUploadItem\n                  {...attachment}\n                  key={attachment.name}\n                  onDelete={onAttachmentDelete}\n                />\n              ))}\n            </Flex>\n          )}\n          <Flex\n            container={{\n              gap: 1\n            }}\n          >\n            <Flex container item={{ grow: 1 }}>\n              <Button variant='secondary' onClick={onCancel}>\n                {t('cancel')}\n              </Button>\n              {footerMoreActions}\n            </Flex>\n            <Flex container>\n              <Button\n                onClick={() => fileUploadInputRef.current?.click()}\n                variant='link'\n                label={t('file_upload_text_multiple')}\n              >\n                <Icon name='paper-clip' />\n              </Button>\n\n              <Button variant='primary' onClick={handleSend}>\n                {t('send_label')}\n              </Button>\n            </Flex>\n          </Flex>\n          <input\n            type='file'\n            style={{ display: 'none' }}\n            ref={fileUploadInputRef}\n            onChange={onFileChange}\n            multiple\n          />\n        </Flex>\n        {!!progress && (\n          <Progress\n            visible={!!progress}\n            placement='local'\n            message={typeof progress === 'object' ? progress.message : t('loading')}\n          />\n        )}\n      </>\n    );\n  }\n);\n\nexport default EmailComposer;\n"]}
+{"version":3,"file":"EmailComposer.js","sourceRoot":"","sources":["../../../src/components/Email/EmailComposer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  useState,\n  ChangeEvent,\n  useMemo,\n  useRef,\n  useCallback,\n  useEffect,\n  ReactNode\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  Button,\n  Flex,\n  Icon,\n  registerIcon,\n  useI18n,\n  Option,\n  defaultThemeProp,\n  FileUploadItem,\n  MenuButton,\n  FileUploadItemProps,\n  Select,\n  Input,\n  useUID,\n  Progress\n} from '@pega/cosmos-react-core';\nimport { Editor, EditorState, EditorProps } from '@pega/cosmos-react-rte';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\nimport * as replyAllIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply-all.icon';\nimport * as replyIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/reply.icon';\nimport * as forwardIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/forward.icon';\n\nimport { EmailComposerProps, EmailTemplate, EmailUser } from './Email.types';\nimport EmailSelector from './EmailSelector';\n\nregisterIcon(paperClipIcon, replyAllIcon, replyIcon, forwardIcon);\n\nexport const StyledEmailComposer = styled.div<EmailComposerProps>(({ progress }) => {\n  return css`\n    max-height: 70vh;\n    ${progress\n      ? css`\n          visibility: hidden;\n        `\n      : css`\n          visibility: visible;\n        `}\n  `;\n});\n\nexport const StyledResponseTypeIcon: typeof Icon = styled(Icon)(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.interactive};\n  `;\n});\n\nStyledResponseTypeIcon.defaultProps = defaultThemeProp;\n\nexport const StyledToggleButton = styled(Button)(({ theme }) => {\n  return css`\n    margin-block-start: calc(2 * ${theme.base.spacing});\n    color: ${theme.base.palette.interactive};\n  `;\n});\n\nStyledToggleButton.defaultProps = defaultThemeProp;\n\nconst responseTypeIcons = {\n  reply: 'reply',\n  replyAll: 'reply-all',\n  forward: 'forward'\n};\n\nconst editorToolbar: EditorProps['toolbar'] = [\n  'inline-styling',\n  'lists',\n  'indentation',\n  'images',\n  'links'\n];\n\nconst EmailComposer: FunctionComponent<EmailComposerProps> = forwardRef(\n  (\n    {\n      participants,\n      bodyContent,\n      onCancel,\n      onSend,\n      onImageAdded,\n      externalValidator,\n      onTemplateChange,\n      to,\n      footerMoreActions,\n      progress = false,\n      templates,\n      defaultTemplateId,\n      cc,\n      bcc,\n      responseType: responseTypeProp,\n      subject: subjectProp,\n      attachments: attachmentsProp,\n      ...restProps\n    }: PropsWithoutRef<EmailComposerProps>,\n    ref: EmailComposerProps['ref']\n  ) => {\n    const t = useI18n();\n\n    const [responseType, setResponseType] = useState(responseTypeProp);\n    const [showCC, setShowCC] = useState(responseTypeProp !== 'reply' && !!cc && cc.length > 0);\n    const [showBCC, setShowBCC] = useState(responseTypeProp !== 'reply' && !!bcc && bcc.length > 0);\n    const [subject, setSubject] = useState(subjectProp);\n    const [autoReplyTemplate, setAutoReplyTemplate] = useState(defaultTemplateId || '');\n    const [attachments, setAttachments] = useState(attachmentsProp || []);\n    const [toAddresses, setToAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n      if (responseType && to?.[responseType])\n        return to?.[responseType] as EmailUser['emailAddress'][];\n      return [];\n    });\n    const [ccAddresses, setCcAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n      if (responseType === 'replyAll') return cc as EmailUser['emailAddress'][];\n      return [];\n    });\n    const [bccAddresses, setBccAddresses] = useState<EmailUser['emailAddress'][]>(() => {\n      if (responseType === 'replyAll') return bcc as EmailUser['emailAddress'][];\n      return [];\n    });\n\n    const editorRef = useRef<EditorState>(null);\n    const fileUploadInputRef = useRef<HTMLInputElement>(null);\n    const uid = useUID();\n\n    const replaceBodyWithTemplate = async (templateId: EmailTemplate['id']) => {\n      if (templateId && onTemplateChange) {\n        const templateContent = await onTemplateChange(templateId);\n        editorRef?.current?.insertHtml(templateContent, true);\n      }\n    };\n\n    // inserts selected template in RTE\n    useEffect(() => {\n      const selectedTemplate = templates?.find(template => template.id === autoReplyTemplate);\n      if (selectedTemplate) {\n        replaceBodyWithTemplate(selectedTemplate.id);\n      }\n    }, [autoReplyTemplate]);\n\n    // resets To | CC | BCC combobox selection and toggles fields on responseType change reply | replyAll | forward\n    useEffect(() => {\n      if (responseType && to?.[responseType]) {\n        setToAddresses(to?.[responseType] as EmailUser['emailAddress'][]);\n      } else {\n        setToAddresses([]);\n      }\n\n      setShowCC(responseType === 'replyAll' ? !!cc && cc.length > 0 : false);\n      setShowBCC(responseType === 'replyAll' ? !!bcc && bcc.length > 0 : false);\n\n      if (responseType === 'replyAll') {\n        setCcAddresses(cc || []);\n        setBccAddresses(bcc || []);\n      } else if (responseType === 'reply') {\n        setCcAddresses([] as EmailUser['emailAddress'][]);\n        setBccAddresses([] as EmailUser['emailAddress'][]);\n      }\n    }, [responseType]);\n\n    const templateOptions = useMemo(\n      () =>\n        templates &&\n        templates.map(template => {\n          if (template.id === defaultTemplateId) {\n            <Option selected='selected' key={template.id} value={template.id}>\n              {template.title}\n            </Option>;\n          }\n          return (\n            <Option key={template.id} value={template.id}>\n              {template.title}\n            </Option>\n          );\n        }),\n      [templates]\n    );\n\n    const responseTypeMenuData = useMemo(() => {\n      const menuItems = [\n        {\n          id: 'reply',\n          primary: t('reply'),\n          visual: <StyledResponseTypeIcon name={responseTypeIcons.reply} />,\n          selected: responseType === 'reply',\n          onClick: () => {\n            setResponseType('reply');\n          }\n        },\n        {\n          id: 'replyAll',\n          primary: t('reply_all'),\n          visual: <StyledResponseTypeIcon name={responseTypeIcons.replyAll} />,\n          selected: responseType === 'replyAll',\n          onClick: () => {\n            setResponseType('replyAll');\n          }\n        }\n      ];\n      return {\n        menuItems,\n        selectedResponseType:\n          menuItems.find(item => item.selected)?.primary || menuItems[0].primary,\n        selectedResponseTypeIcon:\n          (responseType && responseTypeIcons[responseType]) || responseTypeIcons.reply\n      };\n    }, [responseType]);\n\n    const onSubjectChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n      setSubject(e.target.value);\n    }, []);\n\n    const onTemplateSelectionChange = useCallback((e: ChangeEvent<HTMLSelectElement>) => {\n      setAutoReplyTemplate(e.target.value);\n    }, []);\n\n    const onAttachmentDelete = useCallback((name: FileUploadItemProps['name']) => {\n      setAttachments(prevAttachments => prevAttachments.filter(item => item.name !== name));\n    }, []);\n\n    const onFileChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n      if (e.target.files) {\n        setAttachments(prevAttachments => [\n          ...prevAttachments,\n          ...Array.from(e.target.files!).map(file => ({\n            name: file.name,\n            file\n          }))\n        ]);\n      }\n    }, []);\n\n    const updateSelectedItems = (selectedItems: EmailUser['emailAddress'][], label: ReactNode) => {\n      if (label === 'To') {\n        setToAddresses(selectedItems);\n      }\n      if (label === 'Cc') {\n        setCcAddresses(selectedItems);\n      }\n      if (label === 'Bcc') {\n        setBccAddresses(selectedItems);\n      }\n    };\n\n    const handleSend = () => {\n      onSend({\n        to: toAddresses,\n        cc: showCC ? ccAddresses : undefined,\n        bcc: showBCC ? bccAddresses : undefined,\n        subject,\n        bodyContent: editorRef.current?.getHtml() || '',\n        attachments,\n        responseType\n      });\n    };\n\n    const handleImageAdded = (image: File, id: string) => {\n      const src = URL.createObjectURL(image);\n      editorRef.current?.appendImage({ src, alt: image.name }, id);\n      if (onImageAdded) onImageAdded(image, id);\n    };\n    return (\n      <>\n        <Flex\n          as={StyledEmailComposer}\n          ref={ref}\n          {...restProps}\n          container={{\n            gap: 2,\n            direction: 'column'\n          }}\n          progress={!!progress}\n        >\n          <div>\n            {responseType !== 'forward' && (\n              <MenuButton\n                text={responseTypeMenuData.selectedResponseType}\n                variant='link'\n                icon={responseTypeMenuData.selectedResponseTypeIcon}\n                menu={{\n                  mode: 'single-select',\n                  items: responseTypeMenuData.menuItems\n                }}\n              />\n            )}\n          </div>\n\n          <Flex\n            container={{\n              alignItems: 'start',\n              gap: 0.5\n            }}\n          >\n            <Flex\n              container={{\n                gap: 1,\n                direction: 'column'\n              }}\n              item={{\n                grow: 1\n              }}\n            >\n              <EmailSelector\n                participants={participants}\n                selectedItems={toAddresses}\n                label={t('to')}\n                mode='multi-select'\n                required\n                onSelectedItemChange={updateSelectedItems}\n                externalValidator={externalValidator}\n              />\n            </Flex>\n            {!showCC && (\n              <StyledToggleButton variant='simple' onClick={() => setShowCC(true)} icon>\n                {t('cc')}\n              </StyledToggleButton>\n            )}\n            {!showBCC && (\n              <StyledToggleButton variant='simple' onClick={() => setShowBCC(true)} icon>\n                {t('bcc')}\n              </StyledToggleButton>\n            )}\n          </Flex>\n\n          {showCC && (\n            <EmailSelector\n              participants={participants}\n              selectedItems={ccAddresses}\n              label={t('cc')}\n              mode='multi-select'\n              onSelectedItemChange={updateSelectedItems}\n              externalValidator={externalValidator}\n            />\n          )}\n          {showBCC && (\n            <EmailSelector\n              participants={participants}\n              selectedItems={bccAddresses}\n              label={t('bcc')}\n              mode='multi-select'\n              onSelectedItemChange={updateSelectedItems}\n              externalValidator={externalValidator}\n            />\n          )}\n\n          <Input value={subject} onChange={onSubjectChange} label={t('subject')} />\n\n          <Select\n            onChange={onTemplateSelectionChange}\n            label={t('auto_reply')}\n            value={autoReplyTemplate}\n          >\n            <Option key={uid} value={uid}>\n              {t('insert')}\n            </Option>\n            <>{templateOptions}</>\n          </Select>\n\n          <Editor\n            autoFocus\n            ref={editorRef}\n            toolbar={editorToolbar}\n            onImageAdded={handleImageAdded}\n            labelHidden\n            label={t('email_message')}\n            defaultValue={bodyContent}\n            // Below rem values are derived from min 150px, max 300px minus the approx height of toolbar\n            height={{\n              min: '7rem',\n              max: '16.5rem'\n            }}\n          />\n          {attachments.length > 0 && (\n            <Flex container={{ gap: 1, wrap: 'wrap' }}>\n              {attachments.map(attachment => (\n                <FileUploadItem\n                  {...attachment}\n                  key={attachment.name}\n                  onDelete={onAttachmentDelete}\n                />\n              ))}\n            </Flex>\n          )}\n          <Flex\n            container={{\n              gap: 1\n            }}\n          >\n            <Flex container item={{ grow: 1 }}>\n              <Button variant='secondary' onClick={onCancel}>\n                {t('cancel')}\n              </Button>\n              {footerMoreActions}\n            </Flex>\n            <Flex container>\n              <Button\n                onClick={() => fileUploadInputRef.current?.click()}\n                variant='link'\n                label={t('file_upload_text_multiple')}\n              >\n                <Icon name='paper-clip' />\n              </Button>\n\n              <Button variant='primary' onClick={handleSend}>\n                {t('send_label')}\n              </Button>\n            </Flex>\n          </Flex>\n          <input\n            type='file'\n            style={{ display: 'none' }}\n            ref={fileUploadInputRef}\n            onChange={onFileChange}\n            multiple\n          />\n        </Flex>\n        <Progress\n          visible={!!progress}\n          placement='local'\n          message={typeof progress === 'object' ? progress.message : t('loading')}\n        />\n      </>\n    );\n  }\n);\n\nexport default EmailComposer;\n"]}

package/lib/components/Email/EmailConversation.js

@@ -158,22 +158,22 @@ const EmailConversation = forwardRef((props, ref) => {
         }
         return recipientElements;
     }, [to]);
-    return (_jsxs(StyledEmailConversation, { ...restProps, id: id, ref: ref, children: [_jsxs(Flex, { as: StyledConversationButton, id: `conversation-heading${id}`, "aria-controls": id, "aria-expanded": !collapsedState, container: { gap: 1, alignItems: 'center', pad: 1 }, onClick: onExpandCollapse, ref: headerRef, children: [_jsx(Icon, { name: collapsedState ? caretDirection : 'caret-down' }, void 0), _jsx(StyledUnreadIndicator, { isVisible: !!unReadEmailCount }, void 0), _jsxs(Flex, { container: {
+    return (_jsxs(StyledEmailConversation, { ...restProps, id: id, ref: ref, children: [_jsxs(Flex, { as: StyledConversationButton, id: `conversation-heading${id}`, "aria-controls": id, "aria-expanded": !collapsedState, container: { gap: 1, alignItems: 'center', pad: 1 }, onClick: onExpandCollapse, ref: headerRef, children: [_jsx(Icon, { name: collapsedState ? caretDirection : 'caret-down' }), _jsx(StyledUnreadIndicator, { isVisible: !!unReadEmailCount }), _jsxs(Flex, { container: {
                             wrap: 'nowrap',
                             alignItems: 'start',
                             direction: 'column'
                         }, item: {
                             grow: 1,
                             shrink: 1
-                        }, children: [_jsx(Text, { variant: 'primary', as: StyledEmailParticipantsText, children: `${isForwarded ? 'FW' : t('from')}: ${from.fullName}` }, void 0), _jsxs(Text, { variant: 'secondary', as: StyledEmailParticipantsText, children: [`${t('to')}: `, generateRecipientList] }, void 0), !isSmallOrAbove && (_jsxs(Text, { variant: 'secondary', as: StyledCompactTimeStampDisplay, children: [`${new Intl.DateTimeFormat(locale, { weekday: 'short' }).format(new Date(timeStamp))}, `, _jsx(DateTimeDisplay, { variant: 'datetime', format: 'short', value: timeStamp }, void 0)] }, void 0))] }, void 0), _jsx(Flex, { container: {
+                        }, children: [_jsx(Text, { variant: 'primary', as: StyledEmailParticipantsText, children: `${isForwarded ? 'FW' : t('from')}: ${from.fullName}` }), _jsxs(Text, { variant: 'secondary', as: StyledEmailParticipantsText, children: [`${t('to')}: `, generateRecipientList] }), !isSmallOrAbove && (_jsxs(Text, { variant: 'secondary', as: StyledCompactTimeStampDisplay, children: [`${new Intl.DateTimeFormat(locale, { weekday: 'short' }).format(new Date(timeStamp))}, `, _jsx(DateTimeDisplay, { variant: 'datetime', format: 'short', value: timeStamp })] }))] }), _jsx(Flex, { container: {
                             gap: 1,
                             alignItems: 'center'
                         }, item: {
                             shrink: 0
-                        }, children: isSmallOrAbove && (_jsxs(Text, { variant: 'secondary', as: StyledEmailParticipantsText, children: [`${new Intl.DateTimeFormat(locale, { weekday: 'short' }).format(new Date(timeStamp))}, `, _jsx(DateTimeDisplay, { variant: 'datetime', format: 'short', value: timeStamp }, void 0)] }, void 0)) }, void 0)] }, void 0), _jsxs(ExpandCollapse, { as: Flex, container: { direction: 'column' }, collapsed: collapsedState, onBeforeCollapse: onCollapse, onBeforeExpand: onExpand, role: 'region', "aria-labelledby": `conversation-heading${id}`, id: `conversation-content${id}`, children: [!!unReadEmailCount && (_jsx(Text, { as: StyledUnReadCount, id: `unread-emailCount-${id}`, variant: 'secondary', children: t('new_emails_count', [unReadEmailCount], { count: unReadEmailCount }) }, void 0)), emails &&
+                        }, children: isSmallOrAbove && (_jsxs(Text, { variant: 'secondary', as: StyledEmailParticipantsText, children: [`${new Intl.DateTimeFormat(locale, { weekday: 'short' }).format(new Date(timeStamp))}, `, _jsx(DateTimeDisplay, { variant: 'datetime', format: 'short', value: timeStamp })] })) })] }), _jsxs(ExpandCollapse, { as: Flex, container: { direction: 'column' }, collapsed: collapsedState, onBeforeCollapse: onCollapse, onBeforeExpand: onExpand, role: 'region', "aria-labelledby": `conversation-heading${id}`, id: `conversation-content${id}`, children: [!!unReadEmailCount && (_jsx(Text, { as: StyledUnReadCount, id: `unread-emailCount-${id}`, variant: 'secondary', children: t('new_emails_count', [unReadEmailCount], { count: unReadEmailCount }) })), emails &&
                         emails.map(email => {
                             return _jsx(StyledEmailInConversation, { ...email }, email.id);
-                        })] }, void 0)] }, void 0));
+                        })] })] }));
 });
 export default EmailConversation;
 //# sourceMappingURL=EmailConversation.js.map

package/lib/components/Email/EmailConversation.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmailConversation.js","sourceRoot":"","sources":["../../../src/components/Email/EmailConversation.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef, useState, useMemo } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix, readableColor } from 'polished';\n\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\nimport {\n  ExpandCollapse,\n  Flex,\n  Icon,\n  registerIcon,\n  Text,\n  useI18n,\n  defaultThemeProp,\n  ForwardProps,\n  useAfterInitialEffect,\n  DateTimeDisplay,\n  readableHue,\n  useBreakpoint,\n  useConfiguration,\n  StyledIcon,\n  tryCatch,\n  useDirection\n} from '@pega/cosmos-react-core';\n\nimport Email from './Email';\nimport { EmailConversationProps } from './Email.types';\n\nregisterIcon(caretDownIcon);\n\nconst EmailParticipantTextCss = css`\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 100%;\n`;\n\nexport const StyledEmailParticipantsText = styled(Text)`\n  ${EmailParticipantTextCss}\n`;\n\nStyledEmailParticipantsText.defaultProps = defaultThemeProp;\n\nexport const StyledCompactTimeStampDisplay = styled(Text)`\n  ${EmailParticipantTextCss}\n  margin-top: calc(${props => props.theme.base.spacing} / 2);\n`;\nStyledCompactTimeStampDisplay.defaultProps = defaultThemeProp;\n\nexport const StyledConversationHeader = styled.header<{ collapsed: boolean }>(\n  ({ theme, collapsed }) => {\n    return css`\n      border-bottom: ${collapsed ? 0 : '0.0625rem'} solid ${theme.base.palette['border-line']};\n      position: sticky;\n      top: 0;\n      z-index: 1;\n    `;\n  }\n);\nStyledConversationHeader.defaultProps = defaultThemeProp;\n\nexport const StyledUnReadCount = styled.div(({ theme: { base } }) => {\n  const readableBackground = readableHue(\n    base.palette['brand-primary'],\n    base.palette['primary-background']\n  );\n  const readableTextColor = readableColor(readableBackground);\n\n  return css`\n    align-self: flex-start;\n    background-color: ${readableBackground};\n    color: ${readableTextColor};\n    padding: 0 ${base.spacing};\n    font-weight: ${base['font-weight']['semi-bold']};\n\n    /* stylelint-disable declaration-block-no-duplicate-properties */\n    width: fit-content;\n    width: -moz-fit-content;\n\n    /* stylelint-enable declaration-block-no-duplicate-properties */\n  `;\n});\n\nStyledUnReadCount.defaultProps = defaultThemeProp;\n\nexport const StyledEmailConversation = styled.li(({ theme: { base } }) => {\n  return css`\n    margin-bottom: ${base.spacing};\n    border-radius: ${base['border-radius']};\n    overflow: hidden;\n    background-color: ${base.palette['primary-background']};\n    list-style-type: none;\n  `;\n});\nStyledEmailConversation.defaultProps = defaultThemeProp;\n\nexport const StyledEmailInConversation = styled(Email)(({ unRead, theme: { base } }) => {\n  const readableBackground = readableHue(\n    base.palette['brand-primary'],\n    base.palette['primary-background']\n  );\n  return css`\n    padding: calc(2 * ${base.spacing}) 0;\n    border-bottom: 0.0625rem solid ${base.palette['border-line']};\n    position: relative;\n    ${unRead &&\n    css`\n      &::before {\n        content: '';\n        background-color: ${readableBackground};\n        position: absolute;\n        inset: 0;\n        height: calc(100% + 0.0625rem);\n        top: -0.0625rem;\n        width: 0.125rem;\n      }\n    `}\n  `;\n});\nStyledEmailInConversation.defaultProps = defaultThemeProp;\n\nconst StyledForwardIcon = styled.svg(({ theme }) => {\n  const readableStrokeColor = readableHue(\n    theme.base.colors.purple.medium,\n    theme.base.palette['primary-background']\n  );\n  return css`\n    color: ${readableStrokeColor};\n  `;\n});\nStyledForwardIcon.defaultProps = defaultThemeProp;\n\nconst StyledUnreadIndicator = styled.span<{ isVisible: boolean }>(({ theme, isVisible }) => {\n  const readableBackground = readableHue(\n    theme.base.palette['brand-primary'],\n    theme.base.palette['primary-background']\n  );\n\n  const diameter = '0.375rem';\n\n  return css`\n    width: ${isVisible ? diameter : 0};\n    margin: 0 ${isVisible ? 0 : '0.188rem'};\n    height: ${diameter};\n    display: inline-block;\n    border-radius: 50%;\n    background: ${readableBackground};\n    position: relative;\n    top: 0.375rem;\n    align-self: flex-start;\n  `;\n});\nStyledUnreadIndicator.defaultProps = defaultThemeProp;\n\nconst StyledConversationButton = styled.button(({ theme }) => {\n  const hoverColor = tryCatch(() =>\n    mix(0.85, theme.base.palette['primary-background'], theme.base.palette['brand-primary'])\n  );\n  return css`\n    border-width: 0;\n    width: 100%;\n    padding: ${theme.base.spacing};\n    background: ${theme.base.palette['primary-background']};\n    position: sticky;\n    top: 0;\n    z-index: 1;\n\n    &[aria-expanded='true'] {\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n    }\n\n    &:focus {\n      background: ${theme.base.palette['secondary-background']};\n      outline: none;\n    }\n\n    &:hover {\n      background: ${hoverColor};\n      outline: none;\n    }\n\n    & > ${StyledIcon} {\n      align-self: flex-start;\n      color: ${theme.base.palette['foreground-color']};\n    }\n  `;\n});\n\nStyledConversationButton.defaultProps = defaultThemeProp;\n\nconst EmailConversation: FunctionComponent<EmailConversationProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<EmailConversationProps>, ref: EmailConversationProps['ref']) => {\n    const {\n      id,\n      emails,\n      from,\n      to,\n      unReadEmailCount,\n      timeStamp,\n      isForwarded = false,\n      isCollapsed = false,\n      onCollapse,\n      onExpand,\n      ...restProps\n    } = props;\n    const t = useI18n();\n    const [collapsedState, setCollapsedState] = useState(isCollapsed);\n    useAfterInitialEffect(() => {\n      setCollapsedState(isCollapsed);\n    }, [isCollapsed]);\n    const onExpandCollapse = () => {\n      setCollapsedState(!collapsedState);\n    };\n\n    const headerRef = useRef<HTMLDivElement>(null);\n    const isSmallOrAbove = useBreakpoint('sm', { breakpointRef: headerRef });\n    const { locale } = useConfiguration();\n    const { rtl } = useDirection();\n\n    const caretDirection = rtl ? 'caret-left' : 'caret-right';\n    const generateRecipientList = useMemo(() => {\n      const recipientElements = to.slice(0, 2).map((recipient, i) => {\n        return `${recipient.shortName}${i < to.length - 1 ? ';' : ''} `;\n      });\n      if (to.length > 2) {\n        return [...recipientElements, `+${to.length - 2} more`];\n      }\n      return recipientElements;\n    }, [to]);\n\n    return (\n      <StyledEmailConversation {...restProps} id={id} ref={ref}>\n        <Flex\n          as={StyledConversationButton}\n          id={`conversation-heading${id}`}\n          aria-controls={id}\n          aria-expanded={!collapsedState}\n          container={{ gap: 1, alignItems: 'center', pad: 1 }}\n          onClick={onExpandCollapse}\n          ref={headerRef}\n        >\n          <Icon name={collapsedState ? caretDirection : 'caret-down'} />\n          <StyledUnreadIndicator isVisible={!!unReadEmailCount} />\n          <Flex\n            container={{\n              wrap: 'nowrap',\n              alignItems: 'start',\n              direction: 'column'\n            }}\n            item={{\n              grow: 1,\n              shrink: 1\n            }}\n          >\n            <Text variant='primary' as={StyledEmailParticipantsText}>\n              {`${isForwarded ? 'FW' : t('from')}: ${from.fullName}`}\n            </Text>\n            <Text variant='secondary' as={StyledEmailParticipantsText}>\n              {`${t('to')}: `}\n              {generateRecipientList}\n            </Text>\n            {!isSmallOrAbove && (\n              <Text variant='secondary' as={StyledCompactTimeStampDisplay}>\n                {`${new Intl.DateTimeFormat(locale, { weekday: 'short' }).format(\n                  new Date(timeStamp)\n                )}, `}\n                <DateTimeDisplay variant='datetime' format='short' value={timeStamp} />\n              </Text>\n            )}\n          </Flex>\n          <Flex\n            container={{\n              gap: 1,\n              alignItems: 'center'\n            }}\n            item={{\n              shrink: 0\n            }}\n          >\n            {isSmallOrAbove && (\n              <Text variant='secondary' as={StyledEmailParticipantsText}>\n                {`${new Intl.DateTimeFormat(locale, { weekday: 'short' }).format(\n                  new Date(timeStamp)\n                )}, `}\n                <DateTimeDisplay variant='datetime' format='short' value={timeStamp} />\n              </Text>\n            )}\n          </Flex>\n        </Flex>\n\n        <ExpandCollapse\n          as={Flex}\n          container={{ direction: 'column' }}\n          collapsed={collapsedState}\n          onBeforeCollapse={onCollapse}\n          onBeforeExpand={onExpand}\n          role='region'\n          aria-labelledby={`conversation-heading${id}`}\n          id={`conversation-content${id}`}\n        >\n          {!!unReadEmailCount && (\n            <Text as={StyledUnReadCount} id={`unread-emailCount-${id}`} variant='secondary'>\n              {t('new_emails_count', [unReadEmailCount], { count: unReadEmailCount })}\n            </Text>\n          )}\n          {emails &&\n            emails.map(email => {\n              return <StyledEmailInConversation key={email.id} {...email} />;\n            })}\n        </ExpandCollapse>\n      </StyledEmailConversation>\n    );\n  }\n);\n\nexport default EmailConversation;\n"]}
+{"version":3,"file":"EmailConversation.js","sourceRoot":"","sources":["../../../src/components/Email/EmailConversation.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef, useState, useMemo } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix, readableColor } from 'polished';\n\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\nimport {\n  ExpandCollapse,\n  Flex,\n  Icon,\n  registerIcon,\n  Text,\n  useI18n,\n  defaultThemeProp,\n  ForwardProps,\n  useAfterInitialEffect,\n  DateTimeDisplay,\n  readableHue,\n  useBreakpoint,\n  useConfiguration,\n  StyledIcon,\n  tryCatch,\n  useDirection\n} from '@pega/cosmos-react-core';\n\nimport Email from './Email';\nimport { EmailConversationProps } from './Email.types';\n\nregisterIcon(caretDownIcon);\n\nconst EmailParticipantTextCss = css`\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 100%;\n`;\n\nexport const StyledEmailParticipantsText = styled(Text)`\n  ${EmailParticipantTextCss}\n`;\n\nStyledEmailParticipantsText.defaultProps = defaultThemeProp;\n\nexport const StyledCompactTimeStampDisplay = styled(Text)`\n  ${EmailParticipantTextCss}\n  margin-top: calc(${props => props.theme.base.spacing} / 2);\n`;\nStyledCompactTimeStampDisplay.defaultProps = defaultThemeProp;\n\nexport const StyledConversationHeader = styled.header<{ collapsed: boolean }>(\n  ({ theme, collapsed }) => {\n    return css`\n      border-bottom: ${collapsed ? 0 : '0.0625rem'} solid ${theme.base.palette['border-line']};\n      position: sticky;\n      top: 0;\n      z-index: 1;\n    `;\n  }\n);\nStyledConversationHeader.defaultProps = defaultThemeProp;\n\nexport const StyledUnReadCount = styled.div(({ theme: { base } }) => {\n  const readableBackground = readableHue(\n    base.palette['brand-primary'],\n    base.palette['primary-background']\n  );\n  const readableTextColor = readableColor(readableBackground);\n\n  return css`\n    align-self: flex-start;\n    background-color: ${readableBackground};\n    color: ${readableTextColor};\n    padding: 0 ${base.spacing};\n    font-weight: ${base['font-weight']['semi-bold']};\n\n    /* stylelint-disable declaration-block-no-duplicate-properties */\n    width: fit-content;\n    width: -moz-fit-content;\n\n    /* stylelint-enable declaration-block-no-duplicate-properties */\n  `;\n});\n\nStyledUnReadCount.defaultProps = defaultThemeProp;\n\nexport const StyledEmailConversation = styled.li(({ theme: { base } }) => {\n  return css`\n    margin-bottom: ${base.spacing};\n    border-radius: ${base['border-radius']};\n    overflow: hidden;\n    background-color: ${base.palette['primary-background']};\n    list-style-type: none;\n  `;\n});\nStyledEmailConversation.defaultProps = defaultThemeProp;\n\nexport const StyledEmailInConversation = styled(Email)(({ unRead, theme: { base } }) => {\n  const readableBackground = readableHue(\n    base.palette['brand-primary'],\n    base.palette['primary-background']\n  );\n  return css`\n    padding: calc(2 * ${base.spacing}) 0;\n    border-bottom: 0.0625rem solid ${base.palette['border-line']};\n    position: relative;\n    ${unRead &&\n    css`\n      &::before {\n        content: '';\n        background-color: ${readableBackground};\n        position: absolute;\n        inset: 0;\n        height: calc(100% + 0.0625rem);\n        top: -0.0625rem;\n        width: 0.125rem;\n      }\n    `}\n  `;\n});\nStyledEmailInConversation.defaultProps = defaultThemeProp;\n\nconst StyledForwardIcon = styled.svg(({ theme }) => {\n  const readableStrokeColor = readableHue(\n    theme.base.colors.purple.medium,\n    theme.base.palette['primary-background']\n  );\n  return css`\n    color: ${readableStrokeColor};\n  `;\n});\nStyledForwardIcon.defaultProps = defaultThemeProp;\n\nconst StyledUnreadIndicator = styled.span<{ isVisible: boolean }>(({ theme, isVisible }) => {\n  const readableBackground = readableHue(\n    theme.base.palette['brand-primary'],\n    theme.base.palette['primary-background']\n  );\n\n  const diameter = '0.375rem';\n\n  return css`\n    width: ${isVisible ? diameter : 0};\n    margin: 0 ${isVisible ? 0 : '0.188rem'};\n    height: ${diameter};\n    display: inline-block;\n    border-radius: 50%;\n    background: ${readableBackground};\n    position: relative;\n    top: 0.375rem;\n    align-self: flex-start;\n  `;\n});\nStyledUnreadIndicator.defaultProps = defaultThemeProp;\n\nconst StyledConversationButton = styled.button(({ theme }) => {\n  const hoverColor = tryCatch(() =>\n    mix(0.85, theme.base.palette['primary-background'], theme.base.palette['brand-primary'])\n  );\n  return css`\n    border-width: 0;\n    width: 100%;\n    padding: ${theme.base.spacing};\n    background: ${theme.base.palette['primary-background']};\n    position: sticky;\n    top: 0;\n    z-index: 1;\n\n    &[aria-expanded='true'] {\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n    }\n\n    &:focus {\n      background: ${theme.base.palette['secondary-background']};\n      outline: none;\n    }\n\n    &:hover {\n      background: ${hoverColor};\n      outline: none;\n    }\n\n    & > ${StyledIcon} {\n      align-self: flex-start;\n      color: ${theme.base.palette['foreground-color']};\n    }\n  `;\n});\n\nStyledConversationButton.defaultProps = defaultThemeProp;\n\nconst EmailConversation: FunctionComponent<EmailConversationProps & ForwardProps> = forwardRef(\n  (props: PropsWithoutRef<EmailConversationProps>, ref: EmailConversationProps['ref']) => {\n    const {\n      id,\n      emails,\n      from,\n      to,\n      unReadEmailCount,\n      timeStamp,\n      isForwarded = false,\n      isCollapsed = false,\n      onCollapse,\n      onExpand,\n      ...restProps\n    } = props;\n    const t = useI18n();\n    const [collapsedState, setCollapsedState] = useState(isCollapsed);\n    useAfterInitialEffect(() => {\n      setCollapsedState(isCollapsed);\n    }, [isCollapsed]);\n    const onExpandCollapse = () => {\n      setCollapsedState(!collapsedState);\n    };\n\n    const headerRef = useRef<HTMLDivElement>(null);\n    const isSmallOrAbove = useBreakpoint('sm', { breakpointRef: headerRef });\n    const { locale } = useConfiguration();\n    const { rtl } = useDirection();\n\n    const caretDirection = rtl ? 'caret-left' : 'caret-right';\n    const generateRecipientList = useMemo(() => {\n      const recipientElements = to.slice(0, 2).map((recipient, i) => {\n        return `${recipient.shortName}${i < to.length - 1 ? ';' : ''} `;\n      });\n      if (to.length > 2) {\n        return [...recipientElements, `+${to.length - 2} more`];\n      }\n      return recipientElements;\n    }, [to]);\n\n    return (\n      <StyledEmailConversation {...restProps} id={id} ref={ref}>\n        <Flex\n          as={StyledConversationButton}\n          id={`conversation-heading${id}`}\n          aria-controls={id}\n          aria-expanded={!collapsedState}\n          container={{ gap: 1, alignItems: 'center', pad: 1 }}\n          onClick={onExpandCollapse}\n          ref={headerRef}\n        >\n          <Icon name={collapsedState ? caretDirection : 'caret-down'} />\n          <StyledUnreadIndicator isVisible={!!unReadEmailCount} />\n          <Flex\n            container={{\n              wrap: 'nowrap',\n              alignItems: 'start',\n              direction: 'column'\n            }}\n            item={{\n              grow: 1,\n              shrink: 1\n            }}\n          >\n            <Text variant='primary' as={StyledEmailParticipantsText}>\n              {`${isForwarded ? 'FW' : t('from')}: ${from.fullName}`}\n            </Text>\n            <Text variant='secondary' as={StyledEmailParticipantsText}>\n              {`${t('to')}: `}\n              {generateRecipientList}\n            </Text>\n            {!isSmallOrAbove && (\n              <Text variant='secondary' as={StyledCompactTimeStampDisplay}>\n                {`${new Intl.DateTimeFormat(locale, { weekday: 'short' }).format(\n                  new Date(timeStamp)\n                )}, `}\n                <DateTimeDisplay variant='datetime' format='short' value={timeStamp} />\n              </Text>\n            )}\n          </Flex>\n          <Flex\n            container={{\n              gap: 1,\n              alignItems: 'center'\n            }}\n            item={{\n              shrink: 0\n            }}\n          >\n            {isSmallOrAbove && (\n              <Text variant='secondary' as={StyledEmailParticipantsText}>\n                {`${new Intl.DateTimeFormat(locale, { weekday: 'short' }).format(\n                  new Date(timeStamp)\n                )}, `}\n                <DateTimeDisplay variant='datetime' format='short' value={timeStamp} />\n              </Text>\n            )}\n          </Flex>\n        </Flex>\n\n        <ExpandCollapse\n          as={Flex}\n          container={{ direction: 'column' }}\n          collapsed={collapsedState}\n          onBeforeCollapse={onCollapse}\n          onBeforeExpand={onExpand}\n          role='region'\n          aria-labelledby={`conversation-heading${id}`}\n          id={`conversation-content${id}`}\n        >\n          {!!unReadEmailCount && (\n            <Text as={StyledUnReadCount} id={`unread-emailCount-${id}`} variant='secondary'>\n              {t('new_emails_count', [unReadEmailCount], { count: unReadEmailCount })}\n            </Text>\n          )}\n          {emails &&\n            emails.map(email => {\n              return <StyledEmailInConversation key={email.id} {...email} />;\n            })}\n        </ExpandCollapse>\n      </StyledEmailConversation>\n    );\n  }\n);\n\nexport default EmailConversation;\n"]}

package/lib/components/Email/EmailEntity.js

@@ -13,11 +13,11 @@ const EmailEntity = forwardRef(({ entity, ...restProps }, ref) => {
             : entity.description, onContextMenu: () => {
             if (tooltipRef.current)
                 tooltipRef.current.hidden = true;
-        }, contentEditable: false, children: [entity.value, entity.icon && _jsx(Icon, { name: entity.icon }, void 0), entity.description && (_jsx(Tooltip, { target: el, ref: tooltipRef, children: Array.isArray(entity.description)
+        }, contentEditable: false, children: [entity.value, entity.icon && _jsx(Icon, { name: entity.icon }), entity.description && (_jsx(Tooltip, { target: el, ref: tooltipRef, children: Array.isArray(entity.description)
                     ? formatListToLocaleString(entity.description, t, locale, {
                         separator: '\n'
                     })
-                    : entity.description }, void 0))] }, void 0));
+                    : entity.description }))] }));
 });
 export default EmailEntity;
 //# sourceMappingURL=EmailEntity.js.map

package/lib/components/Email/EmailEntity.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmailEntity.js","sourceRoot":"","sources":["../../../src/components/Email/EmailEntity.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAsC,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/E,OAAO,EAEL,OAAO,EACP,kBAAkB,EAClB,UAAU,EACV,OAAO,EACP,gBAAgB,EAChB,wBAAwB,EACxB,IAAI,EACL,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGnD,MAAM,WAAW,GAAuD,UAAU,CAChF,CAAC,EAAE,MAAM,EAAE,GAAG,SAAS,EAAqC,EAAE,GAA4B,EAAE,EAAE;IAC5F,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,UAAU,EAAe,CAAC;IAC9C,MAAM,UAAU,GAAG,kBAAkB,CAAc,KAAK,EAAE,GAAG,CAAC,CAAC;IAC/D,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACtC,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,OAAO,CACL,MAAC,iBAAiB,OACZ,SAAS,EACb,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,UAAU,gBAEb,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC;YAC/B,CAAC,CAAC,wBAAwB,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,EAAE,MAAM,CAAC;YACzD,CAAC,CAAC,MAAM,CAAC,WAAW,EAExB,aAAa,EAAE,GAAG,EAAE;YAClB,IAAI,UAAU,CAAC,OAAO;gBAAE,UAAU,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;QAC3D,CAAC,EACD,eAAe,EAAE,KAAK,aAErB,MAAM,CAAC,KAAK,EACZ,MAAM,CAAC,IAAI,IAAI,KAAC,IAAI,IAAC,IAAI,EAAE,MAAM,CAAC,IAAI,WAAI,EAC1C,MAAM,CAAC,WAAW,IAAI,CACrB,KAAC,OAAO,IAAC,MAAM,EAAE,EAAE,EAAE,GAAG,EAAE,UAAU,YACjC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC;oBAChC,CAAC,CAAC,wBAAwB,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,EAAE,MAAM,EAAE;wBACtD,SAAS,EAAE,IAAI;qBAChB,CAAC;oBACJ,CAAC,CAAC,MAAM,CAAC,WAAW,WACd,CACX,YACiB,CACrB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef } from 'react';\n\nimport {\n  ForwardProps,\n  Tooltip,\n  useConsolidatedRef,\n  useElement,\n  useI18n,\n  useConfiguration,\n  formatListToLocaleString,\n  Icon\n} from '@pega/cosmos-react-core';\n\nimport { StyledEmailEntity } from './Email.styles';\nimport { EmailEntityProps } from './Email.types';\n\nconst EmailEntity: FunctionComponent<EmailEntityProps & ForwardProps> = forwardRef(\n  ({ entity, ...restProps }: PropsWithoutRef<EmailEntityProps>, ref: EmailEntityProps['ref']) => {\n    const [el, setEl] = useElement<HTMLElement>();\n    const elementRef = useConsolidatedRef<HTMLElement>(setEl, ref);\n    const t = useI18n();\n    const { locale } = useConfiguration();\n    const tooltipRef = useRef<HTMLDivElement>(null);\n    return (\n      <StyledEmailEntity\n        {...restProps}\n        entity={entity}\n        ref={elementRef}\n        aria-label={\n          Array.isArray(entity.description)\n            ? formatListToLocaleString(entity.description, t, locale)\n            : entity.description\n        }\n        onContextMenu={() => {\n          if (tooltipRef.current) tooltipRef.current.hidden = true;\n        }}\n        contentEditable={false}\n      >\n        {entity.value}\n        {entity.icon && <Icon name={entity.icon} />}\n        {entity.description && (\n          <Tooltip target={el} ref={tooltipRef}>\n            {Array.isArray(entity.description)\n              ? formatListToLocaleString(entity.description, t, locale, {\n                  separator: '\\n'\n                })\n              : entity.description}\n          </Tooltip>\n        )}\n      </StyledEmailEntity>\n    );\n  }\n);\n\nexport default EmailEntity;\n"]}
+{"version":3,"file":"EmailEntity.js","sourceRoot":"","sources":["../../../src/components/Email/EmailEntity.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAsC,MAAM,EAAE,MAAM,OAAO,CAAC;AAE/E,OAAO,EAEL,OAAO,EACP,kBAAkB,EAClB,UAAU,EACV,OAAO,EACP,gBAAgB,EAChB,wBAAwB,EACxB,IAAI,EACL,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGnD,MAAM,WAAW,GAAuD,UAAU,CAChF,CAAC,EAAE,MAAM,EAAE,GAAG,SAAS,EAAqC,EAAE,GAA4B,EAAE,EAAE;IAC5F,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,GAAG,UAAU,EAAe,CAAC;IAC9C,MAAM,UAAU,GAAG,kBAAkB,CAAc,KAAK,EAAE,GAAG,CAAC,CAAC;IAC/D,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACtC,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAChD,OAAO,CACL,MAAC,iBAAiB,OACZ,SAAS,EACb,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,UAAU,gBAEb,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC;YAC/B,CAAC,CAAC,wBAAwB,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,EAAE,MAAM,CAAC;YACzD,CAAC,CAAC,MAAM,CAAC,WAAW,EAExB,aAAa,EAAE,GAAG,EAAE;YAClB,IAAI,UAAU,CAAC,OAAO;gBAAE,UAAU,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;QAC3D,CAAC,EACD,eAAe,EAAE,KAAK,aAErB,MAAM,CAAC,KAAK,EACZ,MAAM,CAAC,IAAI,IAAI,KAAC,IAAI,IAAC,IAAI,EAAE,MAAM,CAAC,IAAI,GAAI,EAC1C,MAAM,CAAC,WAAW,IAAI,CACrB,KAAC,OAAO,IAAC,MAAM,EAAE,EAAE,EAAE,GAAG,EAAE,UAAU,YACjC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,CAAC;oBAChC,CAAC,CAAC,wBAAwB,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,EAAE,MAAM,EAAE;wBACtD,SAAS,EAAE,IAAI;qBAChB,CAAC;oBACJ,CAAC,CAAC,MAAM,CAAC,WAAW,GACd,CACX,IACiB,CACrB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef } from 'react';\n\nimport {\n  ForwardProps,\n  Tooltip,\n  useConsolidatedRef,\n  useElement,\n  useI18n,\n  useConfiguration,\n  formatListToLocaleString,\n  Icon\n} from '@pega/cosmos-react-core';\n\nimport { StyledEmailEntity } from './Email.styles';\nimport { EmailEntityProps } from './Email.types';\n\nconst EmailEntity: FunctionComponent<EmailEntityProps & ForwardProps> = forwardRef(\n  ({ entity, ...restProps }: PropsWithoutRef<EmailEntityProps>, ref: EmailEntityProps['ref']) => {\n    const [el, setEl] = useElement<HTMLElement>();\n    const elementRef = useConsolidatedRef<HTMLElement>(setEl, ref);\n    const t = useI18n();\n    const { locale } = useConfiguration();\n    const tooltipRef = useRef<HTMLDivElement>(null);\n    return (\n      <StyledEmailEntity\n        {...restProps}\n        entity={entity}\n        ref={elementRef}\n        aria-label={\n          Array.isArray(entity.description)\n            ? formatListToLocaleString(entity.description, t, locale)\n            : entity.description\n        }\n        onContextMenu={() => {\n          if (tooltipRef.current) tooltipRef.current.hidden = true;\n        }}\n        contentEditable={false}\n      >\n        {entity.value}\n        {entity.icon && <Icon name={entity.icon} />}\n        {entity.description && (\n          <Tooltip target={el} ref={tooltipRef}>\n            {Array.isArray(entity.description)\n              ? formatListToLocaleString(entity.description, t, locale, {\n                  separator: '\\n'\n                })\n              : entity.description}\n          </Tooltip>\n        )}\n      </StyledEmailEntity>\n    );\n  }\n);\n\nexport default EmailEntity;\n"]}

package/lib/components/Email/EmailSelector.d.ts

@@ -5,9 +5,9 @@ export interface EmailSelectorProps extends NoChildrenProp {
     /** participants */
     participants: EmailComposerProps['participants'];
     /** default selections */
-    defaultSelections?: EmailUser['emailAddress'][];
+    selectedItems: EmailUser['emailAddress'][];
     /** selectedItems */
-    selections: (selections: EmailUser['emailAddress'][], label: ReactNode) => void;
+    onSelectedItemChange: (selectedItems: EmailUser['emailAddress'][], label: ReactNode) => void;
     /**
      * Callback to handle external entry validation
      * If returned true considers the entry to be a valid entry

package/lib/components/Email/EmailSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmailSelector.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAA6C,SAAS,EAAE,MAAM,OAAO,CAAC;AAEhG,OAAO,EAEL,aAAa,EAGb,cAAc,EAEf,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE9D,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IACxD,mBAAmB;IACnB,YAAY,EAAE,kBAAkB,CAAC,cAAc,CAAC,CAAC;IACjD,yBAAyB;IACzB,iBAAiB,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,EAAE,CAAC;IAChD,oBAAoB;IACpB,UAAU,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,cAAc,CAAC,EAAE,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAChF;;;OAGG;IACH,iBAAiB,CAAC,EAAE,kBAAkB,CAAC,mBAAmB,CAAC,CAAC;CAC7D;AAED,QAAA,MAAM,aAAa,EAAE,iBAAiB,CACpC,kBAAkB,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,MAAM,GAAG,UAAU,CAAC,CA8GxE,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"EmailSelector.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSelector.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAA6C,SAAS,EAAE,MAAM,OAAO,CAAC;AAEhG,OAAO,EAEL,aAAa,EAGb,cAAc,EAEf,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE9D,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IACxD,mBAAmB;IACnB,YAAY,EAAE,kBAAkB,CAAC,cAAc,CAAC,CAAC;IACjD,yBAAyB;IACzB,aAAa,EAAE,SAAS,CAAC,cAAc,CAAC,EAAE,CAAC;IAC3C,oBAAoB;IACpB,oBAAoB,EAAE,CAAC,aAAa,EAAE,SAAS,CAAC,cAAc,CAAC,EAAE,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC7F;;;OAGG;IACH,iBAAiB,CAAC,EAAE,kBAAkB,CAAC,mBAAmB,CAAC,CAAC;CAC7D;AAED,QAAA,MAAM,aAAa,EAAE,iBAAiB,CACpC,kBAAkB,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,MAAM,GAAG,UAAU,CAAC,CA8HxE,CAAC;AAEF,eAAe,aAAa,CAAC"}