@pega/cosmos-react-social 9.0.0-build.9.8 → 9.0.0

package/lib/components/Email/EmailNotificationPanel.js

@@ -1,12 +1,12 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Icon, registerIcon, StyledAvatar, useTheme, VisuallyHiddenText } from '@pega/cosmos-react-core';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon, registerIcon, useTheme, VisuallyHiddenText } from '@pega/cosmos-react-core';
 import * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail-solid.icon';
 import { NavigationListItem } from '@pega/cosmos-react-core/lib/components/AppShell/NavigationList';
-import { StyledEmailCountIcon } from './Email.styles';
+import { StyledCountIcon } from '@pega/cosmos-react-core/lib/components/AppShell/AppShell.styles';
 registerIcon(mailIcon);
-export const EmailNotificationPanelIcon = ({ status, label, count, ...restProps }) => {
+export const EmailNotificationPanelIcon = ({ label, count }) => {
     const { base: { colors } } = useTheme();
-    return (_jsxs(StyledAvatar, { as: StyledAvatar, ...restProps, size: 'm', backgroundColor: colors.white, children: [_jsx(Icon, { name: 'mail-solid' }), _jsx(StyledEmailCountIcon, { variant: 'urgent', children: count }), _jsx(VisuallyHiddenText, { children: label })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Icon, { name: 'mail-solid', shape: 'circle', background: colors.white }), _jsx(VisuallyHiddenText, { children: label }), _jsx(StyledCountIcon, { variant: 'urgent', children: count })] }));
 };
 const EmailNotificationPanel = ({ label, onClick, count, ...restProps }) => {
     return (_jsx(NavigationListItem, { primary: label, visual: _jsx(EmailNotificationPanelIcon, { ...restProps, count: count, label: label }), onClick: onClick }));

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

@@ -1 +1 @@
-{"version":3,"file":"EmailNotificationPanel.js","sourceRoot":"","sources":["../../../src/components/Email/EmailNotificationPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,EACL,IAAI,EACJ,YAAY,EACZ,YAAY,EACZ,QAAQ,EACR,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,QAAQ,MAAM,mEAAmE,CAAC;AAC9F,OAAO,EAAE,kBAAkB,EAAE,MAAM,gEAAgE,CAAC;AAGpG,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAEtD,YAAY,CAAC,QAAQ,CAAC,CAAC;AAEvB,MAAM,CAAC,MAAM,0BAA0B,GAEnC,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,EAAE;IAC7C,MAAM,EACJ,IAAI,EAAE,EAAE,MAAM,EAAE,EACjB,GAAG,QAAQ,EAAE,CAAC;IACf,OAAO,CACL,MAAC,YAAY,IAAC,EAAE,EAAE,YAAY,KAAM,SAAS,EAAE,IAAI,EAAC,GAAG,EAAC,eAAe,EAAE,MAAM,CAAC,KAAK,aACnF,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,EAE1B,KAAC,oBAAoB,IAAC,OAAO,EAAC,QAAQ,YAAE,KAAK,GAAwB,EAErE,KAAC,kBAAkB,cAAE,KAAK,GAAsB,IACnC,CAChB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,sBAAsB,GAAkE,CAAC,EAC7F,KAAK,EACL,OAAO,EACP,KAAK,EACL,GAAG,SAAS,EACb,EAAE,EAAE;IACH,OAAO,CACL,KAAC,kBAAkB,IACjB,OAAO,EAAE,KAAK,EACd,MAAM,EAAE,KAAC,0BAA0B,OAAK,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI,EACjF,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC","sourcesContent":["import type { FunctionComponent } from 'react';\n\nimport {\n  Icon,\n  registerIcon,\n  StyledAvatar,\n  useTheme,\n  VisuallyHiddenText\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, OmitStrict } from '@pega/cosmos-react-core';\nimport * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail-solid.icon';\nimport { NavigationListItem } from '@pega/cosmos-react-core/lib/components/AppShell/NavigationList';\n\nimport type { EmailNotificationPanelProps } from './Email.types';\nimport { StyledEmailCountIcon } from './Email.styles';\n\nregisterIcon(mailIcon);\n\nexport const EmailNotificationPanelIcon: FunctionComponent<\n  OmitStrict<EmailNotificationPanelProps, 'onClick'> & ForwardProps\n> = ({ status, label, count, ...restProps }) => {\n  const {\n    base: { colors }\n  } = useTheme();\n  return (\n    <StyledAvatar as={StyledAvatar} {...restProps} size='m' backgroundColor={colors.white}>\n      <Icon name='mail-solid' />\n\n      <StyledEmailCountIcon variant='urgent'>{count}</StyledEmailCountIcon>\n\n      <VisuallyHiddenText>{label}</VisuallyHiddenText>\n    </StyledAvatar>\n  );\n};\n\nconst EmailNotificationPanel: FunctionComponent<EmailNotificationPanelProps & ForwardProps> = ({\n  label,\n  onClick,\n  count,\n  ...restProps\n}) => {\n  return (\n    <NavigationListItem\n      primary={label}\n      visual={<EmailNotificationPanelIcon {...restProps} count={count} label={label} />}\n      onClick={onClick}\n    />\n  );\n};\n\nexport default EmailNotificationPanel;\n"]}
+{"version":3,"file":"EmailNotificationPanel.js","sourceRoot":"","sources":["../../../src/components/Email/EmailNotificationPanel.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAE3F,OAAO,KAAK,QAAQ,MAAM,mEAAmE,CAAC;AAC9F,OAAO,EAAE,kBAAkB,EAAE,MAAM,gEAAgE,CAAC;AACpG,OAAO,EAAE,eAAe,EAAE,MAAM,iEAAiE,CAAC;AAIlG,YAAY,CAAC,QAAQ,CAAC,CAAC;AAEvB,MAAM,CAAC,MAAM,0BAA0B,GAEnC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IACvB,MAAM,EACJ,IAAI,EAAE,EAAE,MAAM,EAAE,EACjB,GAAG,QAAQ,EAAE,CAAC;IAEf,OAAO,CACL,8BACE,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,QAAQ,EAAC,UAAU,EAAE,MAAM,CAAC,KAAK,GAAI,EACnE,KAAC,kBAAkB,cAAE,KAAK,GAAsB,EAChD,KAAC,eAAe,IAAC,OAAO,EAAC,QAAQ,YAAE,KAAK,GAAmB,IAC1D,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,sBAAsB,GAAkE,CAAC,EAC7F,KAAK,EACL,OAAO,EACP,KAAK,EACL,GAAG,SAAS,EACb,EAAE,EAAE;IACH,OAAO,CACL,KAAC,kBAAkB,IACjB,OAAO,EAAE,KAAK,EACd,MAAM,EAAE,KAAC,0BAA0B,OAAK,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI,EACjF,OAAO,EAAE,OAAO,GAChB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC","sourcesContent":["import type { FunctionComponent } from 'react';\n\nimport { Icon, registerIcon, useTheme, VisuallyHiddenText } from '@pega/cosmos-react-core';\nimport type { ForwardProps, OmitStrict } from '@pega/cosmos-react-core';\nimport * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail-solid.icon';\nimport { NavigationListItem } from '@pega/cosmos-react-core/lib/components/AppShell/NavigationList';\nimport { StyledCountIcon } from '@pega/cosmos-react-core/lib/components/AppShell/AppShell.styles';\n\nimport type { EmailNotificationPanelProps } from './Email.types';\n\nregisterIcon(mailIcon);\n\nexport const EmailNotificationPanelIcon: FunctionComponent<\n  OmitStrict<EmailNotificationPanelProps, 'onClick'> & ForwardProps\n> = ({ label, count }) => {\n  const {\n    base: { colors }\n  } = useTheme();\n\n  return (\n    <>\n      <Icon name='mail-solid' shape='circle' background={colors.white} />\n      <VisuallyHiddenText>{label}</VisuallyHiddenText>\n      <StyledCountIcon variant='urgent'>{count}</StyledCountIcon>\n    </>\n  );\n};\n\nconst EmailNotificationPanel: FunctionComponent<EmailNotificationPanelProps & ForwardProps> = ({\n  label,\n  onClick,\n  count,\n  ...restProps\n}) => {\n  return (\n    <NavigationListItem\n      primary={label}\n      visual={<EmailNotificationPanelIcon {...restProps} count={count} label={label} />}\n      onClick={onClick}\n    />\n  );\n};\n\nexport default EmailNotificationPanel;\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"EmailShell.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailShell.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,yBAAyB,CAAC;AAG/E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAcrD,QAAA,MAAM,UAAU,EAAE,+BAA+B,CAAC,eAAe,CAoF/D,CAAC;AAEH,eAAe,UAAU,CAAC"}
+{"version":3,"file":"EmailShell.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailShell.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,yBAAyB,CAAC;AAG/E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAcrD,QAAA,MAAM,UAAU,EAAE,+BAA+B,CAAC,eAAe,CA0F/D,CAAC;AAEH,eAAe,UAAU,CAAC"}

package/lib/components/Email/EmailShell.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useState } from 'react';
 import { Flex, Icon, registerIcon, Text, useI18n } from '@pega/cosmos-react-core';
+import { AISummary } from '@pega/cosmos-react-social';
 import * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail.icon';
 import EmailConversation, { StyledEmailConversation, StyledEmailInConversation, StyledUnReadCount } from './EmailConversation';
 import { StyledEmailConversationList, StyledEmailShell, StyledEmailShellHeader } from './Email.styles';
 registerIcon(mailIcon);
 const EmailShell = forwardRef(function EmailShell(props, ref) {
-    const { conversations, headerProps, autoCollapse = false, ...restProps } = props;
+    const { conversations, headerProps, autoCollapse = false, summary, ...restProps } = props;
     const t = useI18n();
     const [activeIndex, setActiveIndex] = useState(0);
     const singleConversation = conversations?.length === 1;
@@ -36,11 +37,11 @@ const EmailShell = forwardRef(function EmailShell(props, ref) {
                 return _jsx(EmailConversation, { ...conversation }, conversation.id);
             });
     };
-    return (_jsxs(Flex, { ...restProps, as: StyledEmailShell, container: { direction: 'column', gap: singleConversation ? undefined : 1 }, ref: ref, singleConversation: singleConversation, children: [headerProps && (_jsxs(Flex, { container: {
-                    alignItems: 'center',
-                    justify: 'between',
-                    pad: 1
-                }, as: StyledEmailShellHeader, children: [_jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, children: [_jsx(Icon, { name: 'mail' }), _jsx(Text, { variant: 'h3', children: headerProps?.subject ? `${t('subject')}: ${headerProps?.subject} ` : t('email') })] }), headerProps?.actions] })), _jsx(StyledEmailConversationList, { children: renderConversations() })] }));
+    return (_jsxs(Flex, { ...restProps, as: StyledEmailShell, container: { direction: 'column', gap: singleConversation ? undefined : 1 }, ref: ref, singleConversation: singleConversation, children: [(headerProps || summary) && (_jsxs(Flex, { container: { direction: 'column', gap: 0.5 }, as: StyledEmailShellHeader, children: [headerProps && (_jsxs(Flex, { container: {
+                            alignItems: 'center',
+                            justify: 'between',
+                            pad: 1
+                        }, children: [_jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, children: [_jsx(Icon, { name: 'mail' }), _jsx(Text, { variant: 'h3', children: headerProps.subject ? `${t('subject')}: ${headerProps.subject} ` : t('email') })] }), headerProps.actions] })), summary && _jsx(AISummary, { ...summary })] })), _jsx(StyledEmailConversationList, { children: renderConversations() })] }));
 });
 export default EmailShell;
 //# sourceMappingURL=EmailShell.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"EmailShell.js","sourceRoot":"","sources":["../../../src/components/Email/EmailShell.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type { PropsWithoutRef } from 'react';\n\nimport { Flex, Icon, registerIcon, Text, useI18n } from '@pega/cosmos-react-core';\nimport type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';\nimport * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail.icon';\n\nimport type { EmailShellProps } from './Email.types';\nimport EmailConversation, {\n  StyledEmailConversation,\n  StyledEmailInConversation,\n  StyledUnReadCount\n} from './EmailConversation';\nimport {\n  StyledEmailConversationList,\n  StyledEmailShell,\n  StyledEmailShellHeader\n} from './Email.styles';\n\nregisterIcon(mailIcon);\n\nconst EmailShell: ForwardRefForwardPropsComponent<EmailShellProps> = forwardRef(function EmailShell(\n  props: PropsWithoutRef<EmailShellProps>,\n  ref: EmailShellProps['ref']\n) {\n  const { conversations, headerProps, autoCollapse = false, ...restProps } = props;\n\n  const t = useI18n();\n\n  const [activeIndex, setActiveIndex] = useState(0);\n\n  const singleConversation = conversations?.length === 1;\n\n  const renderConversations = () => {\n    if (!conversations) return;\n\n    if (singleConversation) {\n      const conversation = conversations[0];\n      return (\n        <StyledEmailConversation singleConversation={singleConversation} showHeader={!!headerProps}>\n          {!!conversation.unReadEmailCount && (\n            <Text as={StyledUnReadCount} variant='secondary'>\n              {t('new_emails_count', [conversation.unReadEmailCount], {\n                count: conversation.unReadEmailCount\n              })}\n            </Text>\n          )}\n          {conversation.emails?.map(email => {\n            return <StyledEmailInConversation key={email.id} {...email} />;\n          })}\n        </StyledEmailConversation>\n      );\n    }\n\n    // Multiple conversations\n    return autoCollapse\n      ? conversations?.map((conversation, index) => {\n          const { onExpand, isCollapsed, ...rest } = conversation;\n          const collapsed = index !== activeIndex;\n          return (\n            <EmailConversation\n              key={conversation.id}\n              onExpand={() => {\n                setActiveIndex(index);\n                if (onExpand) onExpand();\n              }}\n              isCollapsed={collapsed}\n              {...rest}\n            />\n          );\n        })\n      : conversations?.map(conversation => {\n          return <EmailConversation key={conversation.id} {...conversation} />;\n        });\n  };\n\n  return (\n    <Flex\n      {...restProps}\n      as={StyledEmailShell}\n      container={{ direction: 'column', gap: singleConversation ? undefined : 1 }}\n      ref={ref}\n      singleConversation={singleConversation}\n    >\n      {headerProps && (\n        <Flex\n          container={{\n            alignItems: 'center',\n            justify: 'between',\n            pad: 1\n          }}\n          as={StyledEmailShellHeader}\n        >\n          <Flex container={{ gap: 1, alignItems: 'center' }}>\n            <Icon name='mail' />\n            <Text variant='h3'>\n              {headerProps?.subject ? `${t('subject')}: ${headerProps?.subject} ` : t('email')}\n            </Text>\n          </Flex>\n          {headerProps?.actions}\n        </Flex>\n      )}\n      <StyledEmailConversationList>{renderConversations()}</StyledEmailConversationList>\n    </Flex>\n  );\n});\n\nexport default EmailShell;\n"]}
+{"version":3,"file":"EmailShell.js","sourceRoot":"","sources":["../../../src/components/Email/EmailShell.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type { PropsWithoutRef } from 'react';\n\nimport { Flex, Icon, registerIcon, Text, useI18n } from '@pega/cosmos-react-core';\nimport { AISummary } from '@pega/cosmos-react-social';\nimport type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';\nimport * as mailIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/mail.icon';\n\nimport type { EmailShellProps } from './Email.types';\nimport EmailConversation, {\n  StyledEmailConversation,\n  StyledEmailInConversation,\n  StyledUnReadCount\n} from './EmailConversation';\nimport {\n  StyledEmailConversationList,\n  StyledEmailShell,\n  StyledEmailShellHeader\n} from './Email.styles';\n\nregisterIcon(mailIcon);\n\nconst EmailShell: ForwardRefForwardPropsComponent<EmailShellProps> = forwardRef(function EmailShell(\n  props: PropsWithoutRef<EmailShellProps>,\n  ref: EmailShellProps['ref']\n) {\n  const { conversations, headerProps, autoCollapse = false, summary, ...restProps } = props;\n\n  const t = useI18n();\n\n  const [activeIndex, setActiveIndex] = useState(0);\n\n  const singleConversation = conversations?.length === 1;\n\n  const renderConversations = () => {\n    if (!conversations) return;\n\n    if (singleConversation) {\n      const conversation = conversations[0];\n      return (\n        <StyledEmailConversation singleConversation={singleConversation} showHeader={!!headerProps}>\n          {!!conversation.unReadEmailCount && (\n            <Text as={StyledUnReadCount} variant='secondary'>\n              {t('new_emails_count', [conversation.unReadEmailCount], {\n                count: conversation.unReadEmailCount\n              })}\n            </Text>\n          )}\n          {conversation.emails?.map(email => {\n            return <StyledEmailInConversation key={email.id} {...email} />;\n          })}\n        </StyledEmailConversation>\n      );\n    }\n\n    // Multiple conversations\n    return autoCollapse\n      ? conversations?.map((conversation, index) => {\n          const { onExpand, isCollapsed, ...rest } = conversation;\n          const collapsed = index !== activeIndex;\n          return (\n            <EmailConversation\n              key={conversation.id}\n              onExpand={() => {\n                setActiveIndex(index);\n                if (onExpand) onExpand();\n              }}\n              isCollapsed={collapsed}\n              {...rest}\n            />\n          );\n        })\n      : conversations?.map(conversation => {\n          return <EmailConversation key={conversation.id} {...conversation} />;\n        });\n  };\n\n  return (\n    <Flex\n      {...restProps}\n      as={StyledEmailShell}\n      container={{ direction: 'column', gap: singleConversation ? undefined : 1 }}\n      ref={ref}\n      singleConversation={singleConversation}\n    >\n      {(headerProps || summary) && (\n        <Flex container={{ direction: 'column', gap: 0.5 }} as={StyledEmailShellHeader}>\n          {headerProps && (\n            <Flex\n              container={{\n                alignItems: 'center',\n                justify: 'between',\n                pad: 1\n              }}\n            >\n              <Flex container={{ gap: 1, alignItems: 'center' }}>\n                <Icon name='mail' />\n                <Text variant='h3'>\n                  {headerProps.subject ? `${t('subject')}: ${headerProps.subject} ` : t('email')}\n                </Text>\n              </Flex>\n              {headerProps.actions}\n            </Flex>\n          )}\n\n          {summary && <AISummary {...summary} />}\n        </Flex>\n      )}\n\n      <StyledEmailConversationList>{renderConversations()}</StyledEmailConversationList>\n    </Flex>\n  );\n});\n\nexport default EmailShell;\n"]}

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

@@ -1,7 +1,7 @@
 import type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';
 import type { EmailSummaryItemProps } from './Email.types';
-export declare const StyledMessageAndDate: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledEmailSummaryItem: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledMessageAndDate: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledEmailSummaryItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;
 declare const EmailSummaryItem: ForwardRefForwardPropsComponent<EmailSummaryItemProps>;
 export default EmailSummaryItem;
 //# sourceMappingURL=EmailSummaryItem.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"EmailSummaryItem.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,yBAAyB,CAAC;AAI/E,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAoB3D,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAwBF,eAAO,MAAM,sBAAsB,wGA+BjC,CAAC;AAMH,QAAA,MAAM,gBAAgB,EAAE,+BAA+B,CAAC,qBAAqB,CAkI5E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"EmailSummaryItem.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,yBAAyB,CAAC;AAI/E,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAuB3D,eAAO,MAAM,oBAAoB,6NAEhC,CAAC;AA2BF,eAAO,MAAM,sBAAsB,6NA+BjC,CAAC;AAMH,QAAA,MAAM,gBAAgB,EAAE,+BAA+B,CAAC,qBAAqB,CAkI5E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/components/Email/EmailSummaryItem.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useMemo } from 'react';
+import { forwardRef, useMemo, useRef } from 'react';
 import styled, { css } from 'styled-components';
 import { mix } from 'polished';
-import { defaultThemeProp, Text, Flex, Count, Sentiment, MetaList, DateTimeDisplay, Status, tryCatch, useI18n, replaceMatchWithElement, Mark, createStringMatcher, Icon, registerIcon } from '@pega/cosmos-react-core';
+import { defaultThemeProp, Text, Flex, Count, Sentiment, MetaList, DateTimeDisplay, Status, tryCatch, useI18n, useHighlight, createStringMatcher, Icon, registerIcon } from '@pega/cosmos-react-core';
 import { StyledMetaList } from '@pega/cosmos-react-core/lib/components/MetaList/MetaList';
 import * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';
 registerIcon(paperClipIcon);
@@ -79,6 +79,8 @@ StyledParticipants.defaultProps = defaultThemeProp;
 StyledMessage.defaultProps = defaultThemeProp;
 const EmailSummaryItem = forwardRef(function EmailSummaryItem({ id, activeParticipants, sentiment, message, timeStamp, topic, urgency, active = false, onSelect, unreadEmailCount, drafts, undelivered, searchQuery, attachmentCount, ...restProps }, ref) {
     const t = useI18n();
+    const participantsRef = useRef(null);
+    const highlightPattern = useMemo(() => (searchQuery ? createStringMatcher(searchQuery, 'contains', 'ig') : undefined), [searchQuery]);
     const items = useMemo(() => {
         const itemList = [];
         if (typeof topic === 'string' && topic.length > 0) {
@@ -105,6 +107,7 @@ const EmailSummaryItem = forwardRef(function EmailSummaryItem({ id, activePartic
         }
         return participants;
     }, [activeParticipants]);
+    useHighlight(participantsRef, highlightPattern);
     const itemStatus = `${unreadEmailCount ? `${t('unread')}, ` : ''}${undelivered ? `${t('undelivered')}, ` : ''}${drafts ? `${t('drafts')}, ` : ''}`;
     return (_jsxs(StyledEmailSummaryItem, { ref: ref, ...restProps, id: id, onClick: () => onSelect(id), onKeyDown: e => {
             if (e.key === 'Enter') {
@@ -113,9 +116,7 @@ const EmailSummaryItem = forwardRef(function EmailSummaryItem({ id, activePartic
         }, "aria-selected": active, "aria-label": t('email_attachment', [
             `${itemStatus}${emailParticipants}, ${message} ${timeStamp} ${topic} ${sentiment?.variant} ${t('priority')} ${urgency}`,
             `${typeof attachmentCount === 'number' && attachmentCount > 0 ? t('attachments_count', [attachmentCount]) : ''}`
-        ]), tabIndex: active ? 0 : -1, children: [_jsxs(StyledParticipants, { unreadEmailCount: unreadEmailCount, container: { justify: 'between', alignItems: 'center' }, children: [_jsx(Text, { variant: 'h4', children: searchQuery
-                            ? replaceMatchWithElement(emailParticipants, createStringMatcher(searchQuery, 'contains', 'ig'), match => _jsx(Mark, { children: match }))
-                            : emailParticipants }), typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (_jsx(Count, { children: unreadEmailCount }))] }), _jsxs(Flex, { container: {
+        ]), tabIndex: active ? 0 : -1, children: [_jsxs(StyledParticipants, { unreadEmailCount: unreadEmailCount, container: { justify: 'between', alignItems: 'center' }, children: [_jsx(Text, { variant: 'h4', children: _jsx("span", { ref: participantsRef, children: emailParticipants }) }), typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (_jsx(Count, { children: unreadEmailCount }))] }), _jsxs(Flex, { container: {
                     justify: 'between'
                 }, as: StyledMessageAndDate, children: [_jsx(StyledMessage, { unreadEmailCount: unreadEmailCount, children: message }), _jsx(DateTimeDisplay, { value: timeStamp, variant: 'date' })] }), _jsx(MetaList, { items: items }), (undelivered || drafts) && (_jsxs(Flex, { container: {
                     justify: 'start',

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

@@ -1 +1 @@
-{"version":3,"file":"EmailSummaryItem.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo } from 'react';\nimport type { PropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix } from 'polished';\n\nimport {\n  defaultThemeProp,\n  Text,\n  Flex,\n  Count,\n  Sentiment,\n  MetaList,\n  DateTimeDisplay,\n  Status,\n  tryCatch,\n  useI18n,\n  replaceMatchWithElement,\n  Mark,\n  createStringMatcher,\n  Icon,\n  registerIcon\n} from '@pega/cosmos-react-core';\nimport type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';\nimport { StyledMetaList } from '@pega/cosmos-react-core/lib/components/MetaList/MetaList';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\n\nimport type { EmailSummaryItemProps } from './Email.types';\n\nregisterIcon(paperClipIcon);\n\nconst StyledMessage = styled(Flex)<EmailSummaryItemProps>(({ unreadEmailCount, theme }) => {\n  return css`\n    width: ${theme.base['content-width'].md};\n    text-align: start;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    margin-inline-end: ${theme.base.spacing};\n    margin-block-end: ${theme.base.spacing};\n    ${unreadEmailCount !== undefined &&\n    unreadEmailCount > 0 &&\n    css`\n      color: ${theme.base.palette.interactive};\n    `}\n  `;\n});\n\nexport const StyledMessageAndDate = styled.div`\n  white-space: nowrap;\n`;\n\nconst StyledParticipants = styled(Flex)<EmailSummaryItemProps>(({ unreadEmailCount, theme }) => {\n  return css`\n    ${unreadEmailCount !== undefined &&\n    unreadEmailCount > 0 &&\n    css`\n      position: relative;\n      &::before {\n        content: '';\n        position: absolute;\n        inset-inline: calc(-1.5 * ${theme.base.spacing});\n        inset-block-start: calc(0.8 * ${theme.base.spacing});\n        width: 0.5rem;\n        height: 0.5rem;\n        border-radius: 50%;\n        background-color: ${theme.base.palette.interactive};\n      }\n    `}\n  `;\n});\n\nconst StyledStatuses = styled.div``;\n\nexport const StyledEmailSummaryItem = styled.li(({ theme }) => {\n  const hoverColor = tryCatch(() =>\n    mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n  );\n  return css`\n    width: 100%;\n    color: ${theme.base.palette['foreground-color']};\n    background-color: ${theme.base.palette['primary-background']};\n    padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n    outline: none;\n    cursor: pointer;\n    ${StyledMetaList}, ${StyledMessageAndDate}, ${StyledStatuses} {\n      margin-block-start: ${theme.base.spacing};\n    }\n    & + & {\n      margin-inline-start: 0;\n    }\n\n    &[aria-selected='true'],\n    &[data-current='true'] {\n      background-color: ${theme.base.palette['secondary-background']};\n    }\n\n    &:hover,\n    &:focus-within {\n      background-color: ${hoverColor};\n    }\n    &:not(:last-child) {\n      border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n    }\n  `;\n});\n\nStyledEmailSummaryItem.defaultProps = defaultThemeProp;\nStyledParticipants.defaultProps = defaultThemeProp;\nStyledMessage.defaultProps = defaultThemeProp;\n\nconst EmailSummaryItem: ForwardRefForwardPropsComponent<EmailSummaryItemProps> = forwardRef(\n  function EmailSummaryItem(\n    {\n      id,\n      activeParticipants,\n      sentiment,\n      message,\n      timeStamp,\n      topic,\n      urgency,\n      active = false,\n      onSelect,\n      unreadEmailCount,\n      drafts,\n      undelivered,\n      searchQuery,\n      attachmentCount,\n      ...restProps\n    }: PropsWithoutRef<EmailSummaryItemProps>,\n    ref: EmailSummaryItemProps['ref']\n  ) {\n    const t = useI18n();\n    const items = useMemo(() => {\n      const itemList: ReactNode[] = [];\n\n      if (typeof topic === 'string' && topic.length > 0) {\n        itemList.push(\n          <Status variant='info' key='info'>\n            {topic}\n          </Status>\n        );\n      }\n\n      if (sentiment) {\n        itemList.push(<Sentiment variant={sentiment.variant} labelHidden />);\n      }\n\n      if (typeof urgency === 'number') {\n        itemList.push(<Text variant='secondary'>{`${t('priority')} ${urgency}`}</Text>);\n      }\n      if (typeof attachmentCount === 'number' && attachmentCount > 0) {\n        itemList.push(\n          <Flex container={{ gap: 0.5 }}>\n            <Icon name='paper-clip' />\n            <Count>{attachmentCount}</Count>\n          </Flex>\n        );\n      }\n\n      return itemList;\n    }, [sentiment, topic, urgency, attachmentCount]);\n\n    const emailParticipants = useMemo(() => {\n      let participants = '';\n      if (activeParticipants.length > 0) {\n        participants =\n          activeParticipants.length === 1\n            ? activeParticipants[0].fullName\n            : activeParticipants.map(participant => `${participant.shortName}`).join(', ');\n      }\n      return participants;\n    }, [activeParticipants]);\n    const itemStatus = `${unreadEmailCount ? `${t('unread')}, ` : ''}${\n      undelivered ? `${t('undelivered')}, ` : ''\n    }${drafts ? `${t('drafts')}, ` : ''}`;\n\n    return (\n      <StyledEmailSummaryItem\n        ref={ref}\n        {...restProps}\n        id={id}\n        onClick={() => onSelect(id)}\n        onKeyDown={e => {\n          if (e.key === 'Enter') {\n            onSelect(id);\n          }\n        }}\n        aria-selected={active}\n        aria-label={t('email_attachment', [\n          `${itemStatus}${emailParticipants}, ${message} ${timeStamp} ${topic} ${\n            sentiment?.variant\n          } ${t('priority')} ${urgency}`,\n          `${typeof attachmentCount === 'number' && attachmentCount > 0 ? t('attachments_count', [attachmentCount]) : ''}`\n        ])}\n        tabIndex={active ? 0 : -1}\n      >\n        <StyledParticipants\n          unreadEmailCount={unreadEmailCount}\n          container={{ justify: 'between', alignItems: 'center' }}\n        >\n          <Text variant='h4'>\n            {searchQuery\n              ? replaceMatchWithElement(\n                  emailParticipants,\n                  createStringMatcher(searchQuery, 'contains', 'ig'),\n                  match => <Mark>{match}</Mark>\n                )\n              : emailParticipants}\n          </Text>\n          {typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (\n            <Count>{unreadEmailCount}</Count>\n          )}\n        </StyledParticipants>\n        <Flex\n          container={{\n            justify: 'between'\n          }}\n          as={StyledMessageAndDate}\n        >\n          <StyledMessage unreadEmailCount={unreadEmailCount}>{message}</StyledMessage>\n          <DateTimeDisplay value={timeStamp} variant='date' />\n        </Flex>\n        <MetaList items={items} />\n        {(undelivered || drafts) && (\n          <Flex\n            container={{\n              justify: 'start',\n              gap: 1\n            }}\n            as={StyledStatuses}\n          >\n            {undelivered && <Status variant='urgent'>{t('undelivered')}</Status>}\n            {/* Passing count as infinity so that translation engine select correct form of draft,\n                 with [](second argument) as empty so that count is not shown */}\n            {drafts && <Status variant='pending'>{t('draft', [], { count: Infinity })}</Status>}\n          </Flex>\n        )}\n      </StyledEmailSummaryItem>\n    );\n  }\n);\n\nexport default EmailSummaryItem;\n"]}
+{"version":3,"file":"EmailSummaryItem.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo, useRef } from 'react';\nimport type { PropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix } from 'polished';\n\nimport {\n  defaultThemeProp,\n  Text,\n  Flex,\n  Count,\n  Sentiment,\n  MetaList,\n  DateTimeDisplay,\n  Status,\n  tryCatch,\n  useI18n,\n  useHighlight,\n  createStringMatcher,\n  Icon,\n  registerIcon\n} from '@pega/cosmos-react-core';\nimport type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';\nimport { StyledMetaList } from '@pega/cosmos-react-core/lib/components/MetaList/MetaList';\nimport * as paperClipIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/paper-clip.icon';\n\nimport type { EmailSummaryItemProps } from './Email.types';\n\nregisterIcon(paperClipIcon);\n\nconst StyledMessage = styled(Flex)<Pick<EmailSummaryItemProps, 'unreadEmailCount'>>(({\n  unreadEmailCount,\n  theme\n}) => {\n  return css`\n    width: ${theme.base['content-width'].md};\n    text-align: start;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    margin-inline-end: ${theme.base.spacing};\n    margin-block-end: ${theme.base.spacing};\n    ${unreadEmailCount !== undefined &&\n    unreadEmailCount > 0 &&\n    css`\n      color: ${theme.base.palette.interactive};\n    `}\n  `;\n});\n\nexport const StyledMessageAndDate = styled.div`\n  white-space: nowrap;\n`;\n\nconst StyledParticipants = styled(Flex)<Pick<EmailSummaryItemProps, 'unreadEmailCount'>>(({\n  unreadEmailCount,\n  theme\n}) => {\n  return css`\n    ${unreadEmailCount !== undefined &&\n    unreadEmailCount > 0 &&\n    css`\n      position: relative;\n      &::before {\n        content: '';\n        position: absolute;\n        inset-inline: calc(-1.5 * ${theme.base.spacing});\n        inset-block-start: calc(0.8 * ${theme.base.spacing});\n        width: 0.5rem;\n        height: 0.5rem;\n        border-radius: 50%;\n        background-color: ${theme.base.palette.interactive};\n      }\n    `}\n  `;\n});\n\nconst StyledStatuses = styled.div``;\n\nexport const StyledEmailSummaryItem = styled.li(({ theme }) => {\n  const hoverColor = tryCatch(() =>\n    mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n  );\n  return css`\n    width: 100%;\n    color: ${theme.base.palette['foreground-color']};\n    background-color: ${theme.base.palette['primary-background']};\n    padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});\n    outline: none;\n    cursor: pointer;\n    ${StyledMetaList}, ${StyledMessageAndDate}, ${StyledStatuses} {\n      margin-block-start: ${theme.base.spacing};\n    }\n    & + & {\n      margin-inline-start: 0;\n    }\n\n    &[aria-selected='true'],\n    &[data-current='true'] {\n      background-color: ${theme.base.palette['secondary-background']};\n    }\n\n    &:hover,\n    &:focus-within {\n      background-color: ${hoverColor};\n    }\n    &:not(:last-child) {\n      border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};\n    }\n  `;\n});\n\nStyledEmailSummaryItem.defaultProps = defaultThemeProp;\nStyledParticipants.defaultProps = defaultThemeProp;\nStyledMessage.defaultProps = defaultThemeProp;\n\nconst EmailSummaryItem: ForwardRefForwardPropsComponent<EmailSummaryItemProps> = forwardRef(\n  function EmailSummaryItem(\n    {\n      id,\n      activeParticipants,\n      sentiment,\n      message,\n      timeStamp,\n      topic,\n      urgency,\n      active = false,\n      onSelect,\n      unreadEmailCount,\n      drafts,\n      undelivered,\n      searchQuery,\n      attachmentCount,\n      ...restProps\n    }: PropsWithoutRef<EmailSummaryItemProps>,\n    ref: EmailSummaryItemProps['ref']\n  ) {\n    const t = useI18n();\n    const participantsRef = useRef<HTMLSpanElement>(null);\n    const highlightPattern = useMemo(\n      () => (searchQuery ? createStringMatcher(searchQuery, 'contains', 'ig') : undefined),\n      [searchQuery]\n    );\n    const items = useMemo(() => {\n      const itemList: ReactNode[] = [];\n\n      if (typeof topic === 'string' && topic.length > 0) {\n        itemList.push(\n          <Status variant='info' key='info'>\n            {topic}\n          </Status>\n        );\n      }\n\n      if (sentiment) {\n        itemList.push(<Sentiment variant={sentiment.variant} labelHidden />);\n      }\n\n      if (typeof urgency === 'number') {\n        itemList.push(<Text variant='secondary'>{`${t('priority')} ${urgency}`}</Text>);\n      }\n      if (typeof attachmentCount === 'number' && attachmentCount > 0) {\n        itemList.push(\n          <Flex container={{ gap: 0.5 }}>\n            <Icon name='paper-clip' />\n            <Count>{attachmentCount}</Count>\n          </Flex>\n        );\n      }\n\n      return itemList;\n    }, [sentiment, topic, urgency, attachmentCount]);\n\n    const emailParticipants = useMemo(() => {\n      let participants = '';\n      if (activeParticipants.length > 0) {\n        participants =\n          activeParticipants.length === 1\n            ? activeParticipants[0].fullName\n            : activeParticipants.map(participant => `${participant.shortName}`).join(', ');\n      }\n      return participants;\n    }, [activeParticipants]);\n    useHighlight(participantsRef, highlightPattern);\n    const itemStatus = `${unreadEmailCount ? `${t('unread')}, ` : ''}${\n      undelivered ? `${t('undelivered')}, ` : ''\n    }${drafts ? `${t('drafts')}, ` : ''}`;\n\n    return (\n      <StyledEmailSummaryItem\n        ref={ref}\n        {...restProps}\n        id={id}\n        onClick={() => onSelect(id)}\n        onKeyDown={e => {\n          if (e.key === 'Enter') {\n            onSelect(id);\n          }\n        }}\n        aria-selected={active}\n        aria-label={t('email_attachment', [\n          `${itemStatus}${emailParticipants}, ${message} ${timeStamp} ${topic} ${\n            sentiment?.variant\n          } ${t('priority')} ${urgency}`,\n          `${typeof attachmentCount === 'number' && attachmentCount > 0 ? t('attachments_count', [attachmentCount]) : ''}`\n        ])}\n        tabIndex={active ? 0 : -1}\n      >\n        <StyledParticipants\n          unreadEmailCount={unreadEmailCount}\n          container={{ justify: 'between', alignItems: 'center' }}\n        >\n          <Text variant='h4'>\n            <span ref={participantsRef}>{emailParticipants}</span>\n          </Text>\n          {typeof unreadEmailCount === 'number' && unreadEmailCount > 0 && (\n            <Count>{unreadEmailCount}</Count>\n          )}\n        </StyledParticipants>\n        <Flex\n          container={{\n            justify: 'between'\n          }}\n          as={StyledMessageAndDate}\n        >\n          <StyledMessage unreadEmailCount={unreadEmailCount}>{message}</StyledMessage>\n          <DateTimeDisplay value={timeStamp} variant='date' />\n        </Flex>\n        <MetaList items={items} />\n        {(undelivered || drafts) && (\n          <Flex\n            container={{\n              justify: 'start',\n              gap: 1\n            }}\n            as={StyledStatuses}\n          >\n            {undelivered && <Status variant='urgent'>{t('undelivered')}</Status>}\n            {/* Passing count as infinity so that translation engine select correct form of draft,\n                 with [](second argument) as empty so that count is not shown */}\n            {drafts && <Status variant='pending'>{t('draft', [], { count: Infinity })}</Status>}\n          </Flex>\n        )}\n      </StyledEmailSummaryItem>\n    );\n  }\n);\n\nexport default EmailSummaryItem;\n"]}

package/lib/components/Email/EntityList.js

@@ -55,7 +55,7 @@ const EntityList = forwardRef(function EntityList({ content, header, contextMenu
                         return _jsx(EmailEntity, { entity: entityObject.entity }, entityObject.id);
                     }) }))
             }
-            : data;
+            : { ...data, value: undefined };
     });
     useEffect(() => {
         if (popoverOpen)

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

@@ -1 +1 @@
-{"version":3,"file":"EntityList.js","sourceRoot":"","sources":["../../../src/components/Email/EntityList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect, useImperativeHandle } from 'react';\nimport type { PropsWithoutRef, MouseEvent } from 'react';\n\nimport {\n  Text,\n  Flex,\n  Icon,\n  Card,\n  CardHeader,\n  CardContent,\n  useScrollToggle,\n  useElement,\n  useOuterEvent,\n  EmptyState,\n  useConsolidatedRef\n} from '@pega/cosmos-react-core';\n\nimport ContextMenuPopover from './ContextMenuPopover';\nimport { StyledEntityList } from './Email.styles';\nimport EmailEntity from './EmailEntity';\nimport type { ContextMenuProps, EntityListProps, TargetProps } from './Email.types';\n\nconst EntityList = forwardRef(function EntityList(\n  { content, header, contextMenu }: PropsWithoutRef<EntityListProps>,\n  ref: EntityListProps['ref']\n) {\n  const [popoverOpen, setPopoverOpen] = useState(false);\n  const [currentTarget, setCurrentTarget] = useState<TargetProps | undefined>();\n  const { disableScroll, enableScroll } = useScrollToggle();\n  // Only way to set this is through imperative handle\n  const [contextMenuItems, setContextMenuItems] = useState<ContextMenuProps['items']>([]);\n  const [contextMenuLoading, setContextMenuLoading] = useState<boolean>(false);\n  const [popoverEl, setPopoverEl] = useElement<HTMLDivElement>();\n  const popoverRef = useConsolidatedRef(setPopoverEl, contextMenu?.popoverRef);\n\n  useOuterEvent('mousedown', [popoverEl], () => {\n    if (popoverOpen) setPopoverOpen(false);\n  });\n\n  useImperativeHandle(contextMenu?.handle, () => ({\n    setItems: (ctxMenuItems: ContextMenuProps['items']) => {\n      setContextMenuItems(ctxMenuItems || []);\n    },\n    setLoading(loading) {\n      setContextMenuLoading(loading);\n    },\n    setOpen(visible) {\n      setPopoverOpen(visible);\n    }\n  }));\n\n  // Handler for right click\n  const onContextMenu = (e: MouseEvent<HTMLDivElement>) => {\n    if (e.target instanceof Element && e.target.textContent?.trim()) {\n      setCurrentTarget({\n        targetNode: e.target,\n        cursorPosition: {\n          x: e.pageX - window.scrollX,\n          y: e.pageY - window.scrollY\n        }\n      });\n      contextMenu?.onContextMenu(e);\n    }\n  };\n\n  const onItemClick: ContextMenuProps['onItemClick'] = (selectedValue: {\n    fieldName: string;\n    fieldValue: string;\n  }) => {\n    setPopoverOpen(false);\n    contextMenu?.onItemClick(selectedValue);\n  };\n\n  const fields = content.map(data => {\n    return data.value\n      ? {\n          ...data,\n          value: (\n            // Attach the handler only when context menu is enabled\n            <Flex container={{ gap: 0.5, wrap: 'wrap' }} onContextMenu={onContextMenu}>\n              {data.value.map(entityObject => {\n                return <EmailEntity key={entityObject.id} entity={entityObject.entity} />;\n              })}\n            </Flex>\n          )\n        }\n      : data;\n  });\n\n  useEffect(() => {\n    if (popoverOpen) disableScroll();\n    else enableScroll();\n  }, [popoverOpen]);\n\n  return (\n    <Card ref={ref}>\n      {header && (\n        <CardHeader container={{ alignItems: 'center', gap: 1 }}>\n          <Icon name={header.icon} />\n          <Text variant='h3'>{header.text}</Text>\n        </CardHeader>\n      )}\n      {content.length > 0 ? (\n        <CardContent>\n          <StyledEntityList fields={fields} variant='stacked' />\n          {contextMenu && currentTarget && (\n            <ContextMenuPopover\n              ref={popoverRef}\n              cursorPosition={currentTarget?.cursorPosition}\n              contextMenu={{\n                ...contextMenu,\n                items: contextMenuItems,\n                loading: contextMenuLoading,\n                onItemClick\n              }}\n              targetNode={currentTarget.targetNode}\n              show={popoverOpen}\n            />\n          )}\n        </CardContent>\n      ) : (\n        <EmptyState />\n      )}\n    </Card>\n  );\n});\n\nexport default EntityList;\n"]}
+{"version":3,"file":"EntityList.js","sourceRoot":"","sources":["../../../src/components/Email/EntityList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useEffect, useImperativeHandle } from 'react';\nimport type { PropsWithoutRef, MouseEvent } from 'react';\n\nimport {\n  Text,\n  Flex,\n  Icon,\n  Card,\n  CardHeader,\n  CardContent,\n  useScrollToggle,\n  useElement,\n  useOuterEvent,\n  EmptyState,\n  useConsolidatedRef\n} from '@pega/cosmos-react-core';\n\nimport ContextMenuPopover from './ContextMenuPopover';\nimport { StyledEntityList } from './Email.styles';\nimport EmailEntity from './EmailEntity';\nimport type { ContextMenuProps, EntityListProps, TargetProps } from './Email.types';\n\nconst EntityList = forwardRef(function EntityList(\n  { content, header, contextMenu }: PropsWithoutRef<EntityListProps>,\n  ref: EntityListProps['ref']\n) {\n  const [popoverOpen, setPopoverOpen] = useState(false);\n  const [currentTarget, setCurrentTarget] = useState<TargetProps | undefined>();\n  const { disableScroll, enableScroll } = useScrollToggle();\n  // Only way to set this is through imperative handle\n  const [contextMenuItems, setContextMenuItems] = useState<ContextMenuProps['items']>([]);\n  const [contextMenuLoading, setContextMenuLoading] = useState<boolean>(false);\n  const [popoverEl, setPopoverEl] = useElement<HTMLDivElement>();\n  const popoverRef = useConsolidatedRef(setPopoverEl, contextMenu?.popoverRef);\n\n  useOuterEvent('mousedown', [popoverEl], () => {\n    if (popoverOpen) setPopoverOpen(false);\n  });\n\n  useImperativeHandle(contextMenu?.handle, () => ({\n    setItems: (ctxMenuItems: ContextMenuProps['items']) => {\n      setContextMenuItems(ctxMenuItems || []);\n    },\n    setLoading(loading) {\n      setContextMenuLoading(loading);\n    },\n    setOpen(visible) {\n      setPopoverOpen(visible);\n    }\n  }));\n\n  // Handler for right click\n  const onContextMenu = (e: MouseEvent<HTMLDivElement>) => {\n    if (e.target instanceof Element && e.target.textContent?.trim()) {\n      setCurrentTarget({\n        targetNode: e.target,\n        cursorPosition: {\n          x: e.pageX - window.scrollX,\n          y: e.pageY - window.scrollY\n        }\n      });\n      contextMenu?.onContextMenu(e);\n    }\n  };\n\n  const onItemClick: ContextMenuProps['onItemClick'] = (selectedValue: {\n    fieldName: string;\n    fieldValue: string;\n  }) => {\n    setPopoverOpen(false);\n    contextMenu?.onItemClick(selectedValue);\n  };\n\n  const fields = content.map(data => {\n    return data.value\n      ? {\n          ...data,\n          value: (\n            // Attach the handler only when context menu is enabled\n            <Flex container={{ gap: 0.5, wrap: 'wrap' }} onContextMenu={onContextMenu}>\n              {data.value.map(entityObject => {\n                return <EmailEntity key={entityObject.id} entity={entityObject.entity} />;\n              })}\n            </Flex>\n          )\n        }\n      : { ...data, value: undefined };\n  });\n\n  useEffect(() => {\n    if (popoverOpen) disableScroll();\n    else enableScroll();\n  }, [popoverOpen]);\n\n  return (\n    <Card ref={ref}>\n      {header && (\n        <CardHeader container={{ alignItems: 'center', gap: 1 }}>\n          <Icon name={header.icon} />\n          <Text variant='h3'>{header.text}</Text>\n        </CardHeader>\n      )}\n      {content.length > 0 ? (\n        <CardContent>\n          <StyledEntityList fields={fields} variant='stacked' />\n          {contextMenu && currentTarget && (\n            <ContextMenuPopover\n              ref={popoverRef}\n              cursorPosition={currentTarget?.cursorPosition}\n              contextMenu={{\n                ...contextMenu,\n                items: contextMenuItems,\n                loading: contextMenuLoading,\n                onItemClick\n              }}\n              targetNode={currentTarget.targetNode}\n              show={popoverOpen}\n            />\n          )}\n        </CardContent>\n      ) : (\n        <EmptyState />\n      )}\n    </Card>\n  );\n});\n\nexport default EntityList;\n"]}

package/lib/components/Email/utils/EntityHighlighter.d.ts

@@ -1,9 +1,8 @@
 import type { EmailProps } from '../Email.types';
 /**
  * Function to highlight entities in a given html
- * @param {string} html
- * @param {EmailProps['entityHighlightMapping']} entityMapping
- * @returns {string}
+ * @param html
+ * @param entityMapping
  */
 declare const highlightEntities: (html: string, entityMapping: EmailProps["entityHighlightMapping"]) => string;
 export default highlightEntities;

package/lib/components/Email/utils/EntityHighlighter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EntityHighlighter.d.ts","sourceRoot":"","sources":["../../../../src/components/Email/utils/EntityHighlighter.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAA2B,MAAM,gBAAgB,CAAC;AA+R1E;;;;;GAKG;AACH,QAAA,MAAM,iBAAiB,GACrB,MAAM,MAAM,EACZ,eAAe,UAAU,CAAC,wBAAwB,CAAC,KAClD,MAMF,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"EntityHighlighter.d.ts","sourceRoot":"","sources":["../../../../src/components/Email/utils/EntityHighlighter.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAA2B,MAAM,gBAAgB,CAAC;AA2R1E;;;;GAIG;AACH,QAAA,MAAM,iBAAiB,GACrB,MAAM,MAAM,EACZ,eAAe,UAAU,CAAC,wBAAwB,CAAC,KAClD,MAMF,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/Email/utils/EntityHighlighter.js

@@ -6,9 +6,8 @@ const isParentNode = (node) => !!node &&
     node.nodeName !== '#documentType';
 /**
  * Function to check if there is nesting in the given ranges
- * @param {MatchRange} range1
- * @param {MatchRange} range2
- * @returns {boolean}
+ * @param range1
+ * @param range2
  */
 const isNesting = (range1, range2) => {
     return ((range1.start >= range2.start && range1.end <= range2.end) ||
@@ -16,9 +15,8 @@ const isNesting = (range1, range2) => {
 };
 /**
  * Function to check if there is an intersection in the ranges
- * @param {MatchRange} range1
- * @param {MatchRange} range2
- * @returns {boolean}
+ * @param range1
+ * @param range2
  */
 const isIntersecting = (range1, range2) => {
     return ((range1.start > range2.start && range1.start <= range2.end && range1.end > range2.end) ||
@@ -26,9 +24,8 @@ const isIntersecting = (range1, range2) => {
 };
 /**
  * Callback function to sort ranges
- * @param {MatchRange} range1
- * @param {MatchRange} range2
- * @returns {number}
+ * @param range1
+ * @param range2
  */
 const matchSorter = (range1, range2) => {
     if (range1.start === range2.start) {
@@ -38,9 +35,8 @@ const matchSorter = (range1, range2) => {
 };
 /**
  * Recursive function to generate nested matches structure by inserting it at the right place
- * @param {EntityMatch} match
- * @param {EntityMatch[]} nestedMatches
- * @returns {EntityMatch[]}
+ * @param match
+ * @param nestedMatches
  */
 const insertIntoNestedMatches = (match, nestedMatches) => {
     const updatedNestedMatches = [...nestedMatches];
@@ -245,9 +241,8 @@ const highlightEntitiesInNode = (node, entityMapping) => {
 };
 /**
  * Function to highlight entities in a given html
- * @param {string} html
- * @param {EmailProps['entityHighlightMapping']} entityMapping
- * @returns {string}
+ * @param html
+ * @param entityMapping
  */
 const highlightEntities = (html, entityMapping) => {
     const document = parse(html);

package/lib/components/Email/utils/EntityHighlighter.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityHighlighter.js","sourceRoot":"","sources":["../../../../src/components/Email/utils/EntityHighlighter.ts"],"names":[],"mappings":"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","sourcesContent":["import { parse, serialize } from 'parse5';\nimport type { TextNode, Element, Node, ParentNode, Document } from 'parse5';\n\nimport { escapeRegExp } from '@pega/cosmos-react-core';\n\nimport type { EmailProps, EntityMatch, MatchRange } from '../Email.types';\n\nconst isParentNode = (node: Node | undefined): node is ParentNode =>\n  !!node &&\n  node.nodeName !== '#text' &&\n  node.nodeName !== '#comment' &&\n  node.nodeName !== '#documentType';\n\n/**\n * Function to check if there is nesting in the given ranges\n * @param {MatchRange} range1\n * @param {MatchRange} range2\n * @returns {boolean}\n */\nconst isNesting = (range1: MatchRange, range2: MatchRange): boolean => {\n  return (\n    (range1.start >= range2.start && range1.end <= range2.end) ||\n    (range2.start >= range1.start && range2.end <= range1.end)\n  );\n};\n\n/**\n * Function to check if there is an intersection in the ranges\n * @param {MatchRange} range1\n * @param {MatchRange} range2\n * @returns {boolean}\n */\nconst isIntersecting = (range1: MatchRange, range2: MatchRange): boolean => {\n  return (\n    (range1.start > range2.start && range1.start <= range2.end && range1.end > range2.end) ||\n    (range2.start > range1.start && range2.start <= range1.end && range2.end > range1.end)\n  );\n};\n\n/**\n * Callback function to sort ranges\n * @param {MatchRange} range1\n * @param {MatchRange} range2\n * @returns {number}\n */\nconst matchSorter = (range1: MatchRange, range2: MatchRange): number => {\n  if (range1.start === range2.start) {\n    return range2.end - range1.end;\n  }\n\n  return range1.start - range2.start;\n};\n\n/**\n * Recursive function to generate nested matches structure by inserting it at the right place\n * @param {EntityMatch} match\n * @param {EntityMatch[]} nestedMatches\n * @returns {EntityMatch[]}\n */\nconst insertIntoNestedMatches: (\n  match: EntityMatch,\n  nestedMatches: EntityMatch[]\n) => EntityMatch[] = (match: EntityMatch, nestedMatches: EntityMatch[]): EntityMatch[] => {\n  const updatedNestedMatches = [...nestedMatches];\n  let isInserted = false;\n\n  for (let index = 0; index < nestedMatches.length; index += 1) {\n    const matchInArr = nestedMatches[index];\n\n    if (isNesting(match, matchInArr)) {\n      if (match.end - match.start <= matchInArr.end - matchInArr.start) {\n        // The range of existing match in array is either larger or equal, so new match can be a child.\n        if (matchInArr.children && matchInArr.children.length > 0) {\n          // Recursive call\n          const updatedChildren = insertIntoNestedMatches(match, matchInArr.children);\n          // Update matchInArr in the newOverlapsArray\n          matchInArr.children = updatedChildren;\n        } else {\n          matchInArr.children = [match];\n        }\n        updatedNestedMatches.splice(index, 1, matchInArr);\n        isInserted = true;\n        break;\n      } else {\n        // Replace the existing match and make it the child of current match\n        updatedNestedMatches.splice(index, 1, { ...match, children: [matchInArr] });\n        isInserted = true;\n        break;\n      }\n    }\n\n    if (isIntersecting(match, matchInArr)) {\n      // Intersection\n      // We are only keeping the first match and discarding the following match\n      if (match.start < matchInArr.start) {\n        updatedNestedMatches.splice(index, 1, match);\n        isInserted = true;\n      } else {\n        isInserted = true;\n      }\n      break;\n    }\n  }\n\n  if (!isInserted) {\n    // Not nesting or intersecting\n    updatedNestedMatches.push(match);\n  }\n\n  return updatedNestedMatches;\n};\n\nconst getConsolidatedDescription = (match: EntityMatch) => {\n  const consolidatedDescription: { [name: string]: Set<string> } = {};\n\n  match.names?.forEach(name => {\n    if (!consolidatedDescription[name]) {\n      consolidatedDescription[name] = new Set();\n    }\n    consolidatedDescription[name].add(match.matchedText);\n  });\n\n  if (match.children && match.children.length > 0) {\n    match.children.forEach(nestedMatch => {\n      const nestMatchDesc = getConsolidatedDescription(nestedMatch);\n      Object.keys(nestMatchDesc).forEach(key => {\n        if (consolidatedDescription[key]) {\n          consolidatedDescription[key] = new Set([\n            ...consolidatedDescription[key],\n            ...nestMatchDesc[key]\n          ]);\n        } else {\n          consolidatedDescription[key] = nestMatchDesc[key];\n        }\n      });\n    });\n  }\n\n  return consolidatedDescription;\n};\n\nconst highlightEntitiesInTextNode = (\n  textNode: TextNode,\n  entityMapping: EmailProps['entityHighlightMapping']\n) => {\n  const matches: EntityMatch[] = [];\n  // Find all matches\n  entityMapping?.forEach(mapping => {\n    const escapedValue = escapeRegExp(mapping.value);\n    const regExp = new RegExp(`(?<=\\\\W|^)${escapedValue}(?=(\\\\W|$))`, 'ig');\n    let res;\n    // eslint-disable-next-line no-cond-assign\n    while ((res = regExp.exec(textNode.value)) !== null) {\n      matches.push({\n        start: res.index,\n        end: res.index + res[0].length,\n        matchedText: res[0],\n        ...mapping\n      });\n    }\n  });\n\n  if (matches.length === 0) {\n    // Early exit as there are no matches\n    const newSpanNode: Element = {\n      nodeName: 'span',\n      tagName: 'span',\n      parentNode: textNode.parentNode,\n      attrs: [],\n      namespaceURI: '',\n      childNodes: []\n    };\n    newSpanNode.childNodes.push(textNode);\n    return newSpanNode;\n  }\n\n  matches.sort(matchSorter);\n\n  // Handle nesting and intersections\n  let nestedMatches: EntityMatch[] = [];\n  matches.forEach(match => {\n    nestedMatches = insertIntoNestedMatches(match, nestedMatches);\n  });\n\n  // Wrap matched ranges\n  let lastIndex = 0;\n  const updatedNodes: Node[] = [];\n  nestedMatches.sort(matchSorter);\n  nestedMatches.forEach(match => {\n    if (match.start !== lastIndex) {\n      const newSpanNode: Element = {\n        nodeName: 'span',\n        tagName: 'span',\n        parentNode: textNode.parentNode,\n        attrs: [],\n        namespaceURI: '',\n        childNodes: []\n      };\n\n      newSpanNode.childNodes.push({\n        ...textNode,\n        nodeName: '#text',\n        value: textNode.value.substring(lastIndex, match.start),\n        parentNode: newSpanNode\n      });\n\n      updatedNodes.push(newSpanNode);\n    }\n\n    const consolidatedDescription = getConsolidatedDescription(match);\n    let consolidatedDescriptionArray;\n    if (Object.entries(consolidatedDescription).length === 1) {\n      consolidatedDescriptionArray = [`${Object.keys(consolidatedDescription)[0]}`];\n    } else {\n      consolidatedDescriptionArray = Object.entries(consolidatedDescription).map(([key, value]) => {\n        return `${key}: ${[...value].join(', ')}`;\n      });\n    }\n\n    const newMarkNode: Element = {\n      nodeName: 'pega-email-entity',\n      tagName: 'pega-email-entity',\n      parentNode: textNode.parentNode,\n      attrs: [\n        { name: 'data-variant', value: `${match.variant}` },\n        { name: 'data-entity-type', value: match.type },\n        { name: 'data-description', value: JSON.stringify(consolidatedDescriptionArray) }\n      ],\n      namespaceURI: '',\n      childNodes: []\n    };\n\n    newMarkNode.childNodes.push({\n      nodeName: '#text',\n      value: match.matchedText,\n      parentNode: newMarkNode\n    });\n\n    updatedNodes.push(newMarkNode);\n\n    lastIndex = match.end;\n  });\n\n  if (lastIndex !== textNode.value.length) {\n    const newSpanNode: Element = {\n      nodeName: 'span',\n      tagName: 'span',\n      parentNode: textNode.parentNode,\n      attrs: [],\n      namespaceURI: '',\n      childNodes: []\n    };\n\n    newSpanNode.childNodes.push({\n      ...textNode,\n      nodeName: '#text',\n      value: textNode.value.substring(lastIndex),\n      parentNode: newSpanNode\n    } as TextNode);\n\n    updatedNodes.push(newSpanNode);\n  }\n\n  return updatedNodes;\n};\n\nconst highlightEntitiesInNode = (\n  node: Node,\n  entityMapping: EmailProps['entityHighlightMapping']\n) => {\n  // Either call self recursively or call mark entities in text\n  if (isParentNode(node) && node.childNodes?.length > 0) {\n    // Iteratively mark entities to all child nodes\n    let newChildNodes: Node[] = [];\n    node.childNodes.forEach(childNode => {\n      const res = highlightEntitiesInNode(childNode, entityMapping);\n      if (Array.isArray(res)) {\n        newChildNodes = [...newChildNodes, ...res];\n      } else {\n        newChildNodes.push(res as Node);\n      }\n    });\n    return { ...node, childNodes: newChildNodes };\n  }\n\n  if (node.nodeName === '#text') {\n    return highlightEntitiesInTextNode(node as TextNode, entityMapping);\n  }\n\n  return node;\n};\n\n/**\n * Function to highlight entities in a given html\n * @param {string} html\n * @param {EmailProps['entityHighlightMapping']} entityMapping\n * @returns {string}\n */\nconst highlightEntities = (\n  html: string,\n  entityMapping: EmailProps['entityHighlightMapping']\n): string => {\n  const document: Document = parse(html);\n\n  const markedDocument = highlightEntitiesInNode(document, entityMapping);\n\n  return serialize(markedDocument as Document);\n};\n\nexport default highlightEntities;\n"]}
+{"version":3,"file":"EntityHighlighter.js","sourceRoot":"","sources":["../../../../src/components/Email/utils/EntityHighlighter.ts"],"names":[],"mappings":"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","sourcesContent":["import { parse, serialize } from 'parse5';\nimport type { TextNode, Element, Node, ParentNode, Document } from 'parse5';\n\nimport { escapeRegExp } from '@pega/cosmos-react-core';\n\nimport type { EmailProps, EntityMatch, MatchRange } from '../Email.types';\n\nconst isParentNode = (node: Node | undefined): node is ParentNode =>\n  !!node &&\n  node.nodeName !== '#text' &&\n  node.nodeName !== '#comment' &&\n  node.nodeName !== '#documentType';\n\n/**\n * Function to check if there is nesting in the given ranges\n * @param range1\n * @param range2\n */\nconst isNesting = (range1: MatchRange, range2: MatchRange): boolean => {\n  return (\n    (range1.start >= range2.start && range1.end <= range2.end) ||\n    (range2.start >= range1.start && range2.end <= range1.end)\n  );\n};\n\n/**\n * Function to check if there is an intersection in the ranges\n * @param range1\n * @param range2\n */\nconst isIntersecting = (range1: MatchRange, range2: MatchRange): boolean => {\n  return (\n    (range1.start > range2.start && range1.start <= range2.end && range1.end > range2.end) ||\n    (range2.start > range1.start && range2.start <= range1.end && range2.end > range1.end)\n  );\n};\n\n/**\n * Callback function to sort ranges\n * @param range1\n * @param range2\n */\nconst matchSorter = (range1: MatchRange, range2: MatchRange): number => {\n  if (range1.start === range2.start) {\n    return range2.end - range1.end;\n  }\n\n  return range1.start - range2.start;\n};\n\n/**\n * Recursive function to generate nested matches structure by inserting it at the right place\n * @param match\n * @param nestedMatches\n */\nconst insertIntoNestedMatches: (\n  match: EntityMatch,\n  nestedMatches: EntityMatch[]\n) => EntityMatch[] = (match: EntityMatch, nestedMatches: EntityMatch[]): EntityMatch[] => {\n  const updatedNestedMatches = [...nestedMatches];\n  let isInserted = false;\n\n  for (let index = 0; index < nestedMatches.length; index += 1) {\n    const matchInArr = nestedMatches[index];\n\n    if (isNesting(match, matchInArr)) {\n      if (match.end - match.start <= matchInArr.end - matchInArr.start) {\n        // The range of existing match in array is either larger or equal, so new match can be a child.\n        if (matchInArr.children && matchInArr.children.length > 0) {\n          // Recursive call\n          const updatedChildren = insertIntoNestedMatches(match, matchInArr.children);\n          // Update matchInArr in the newOverlapsArray\n          matchInArr.children = updatedChildren;\n        } else {\n          matchInArr.children = [match];\n        }\n        updatedNestedMatches.splice(index, 1, matchInArr);\n        isInserted = true;\n        break;\n      } else {\n        // Replace the existing match and make it the child of current match\n        updatedNestedMatches.splice(index, 1, { ...match, children: [matchInArr] });\n        isInserted = true;\n        break;\n      }\n    }\n\n    if (isIntersecting(match, matchInArr)) {\n      // Intersection\n      // We are only keeping the first match and discarding the following match\n      if (match.start < matchInArr.start) {\n        updatedNestedMatches.splice(index, 1, match);\n        isInserted = true;\n      } else {\n        isInserted = true;\n      }\n      break;\n    }\n  }\n\n  if (!isInserted) {\n    // Not nesting or intersecting\n    updatedNestedMatches.push(match);\n  }\n\n  return updatedNestedMatches;\n};\n\nconst getConsolidatedDescription = (match: EntityMatch) => {\n  const consolidatedDescription: { [name: string]: Set<string> } = {};\n\n  match.names?.forEach(name => {\n    if (!consolidatedDescription[name]) {\n      consolidatedDescription[name] = new Set();\n    }\n    consolidatedDescription[name].add(match.matchedText);\n  });\n\n  if (match.children && match.children.length > 0) {\n    match.children.forEach(nestedMatch => {\n      const nestMatchDesc = getConsolidatedDescription(nestedMatch);\n      Object.keys(nestMatchDesc).forEach(key => {\n        if (consolidatedDescription[key]) {\n          consolidatedDescription[key] = new Set([\n            ...consolidatedDescription[key],\n            ...nestMatchDesc[key]\n          ]);\n        } else {\n          consolidatedDescription[key] = nestMatchDesc[key];\n        }\n      });\n    });\n  }\n\n  return consolidatedDescription;\n};\n\nconst highlightEntitiesInTextNode = (\n  textNode: TextNode,\n  entityMapping: EmailProps['entityHighlightMapping']\n) => {\n  const matches: EntityMatch[] = [];\n  // Find all matches\n  entityMapping?.forEach(mapping => {\n    const escapedValue = escapeRegExp(mapping.value);\n    const regExp = new RegExp(`(?<=\\\\W|^)${escapedValue}(?=(\\\\W|$))`, 'ig');\n    let res;\n    // eslint-disable-next-line no-cond-assign\n    while ((res = regExp.exec(textNode.value)) !== null) {\n      matches.push({\n        start: res.index,\n        end: res.index + res[0].length,\n        matchedText: res[0],\n        ...mapping\n      });\n    }\n  });\n\n  if (matches.length === 0) {\n    // Early exit as there are no matches\n    const newSpanNode: Element = {\n      nodeName: 'span',\n      tagName: 'span',\n      parentNode: textNode.parentNode,\n      attrs: [],\n      namespaceURI: '',\n      childNodes: []\n    };\n    newSpanNode.childNodes.push(textNode);\n    return newSpanNode;\n  }\n\n  matches.sort(matchSorter);\n\n  // Handle nesting and intersections\n  let nestedMatches: EntityMatch[] = [];\n  matches.forEach(match => {\n    nestedMatches = insertIntoNestedMatches(match, nestedMatches);\n  });\n\n  // Wrap matched ranges\n  let lastIndex = 0;\n  const updatedNodes: Node[] = [];\n  nestedMatches.sort(matchSorter);\n  nestedMatches.forEach(match => {\n    if (match.start !== lastIndex) {\n      const newSpanNode: Element = {\n        nodeName: 'span',\n        tagName: 'span',\n        parentNode: textNode.parentNode,\n        attrs: [],\n        namespaceURI: '',\n        childNodes: []\n      };\n\n      newSpanNode.childNodes.push({\n        ...textNode,\n        nodeName: '#text',\n        value: textNode.value.substring(lastIndex, match.start),\n        parentNode: newSpanNode\n      });\n\n      updatedNodes.push(newSpanNode);\n    }\n\n    const consolidatedDescription = getConsolidatedDescription(match);\n    let consolidatedDescriptionArray;\n    if (Object.entries(consolidatedDescription).length === 1) {\n      consolidatedDescriptionArray = [`${Object.keys(consolidatedDescription)[0]}`];\n    } else {\n      consolidatedDescriptionArray = Object.entries(consolidatedDescription).map(([key, value]) => {\n        return `${key}: ${[...value].join(', ')}`;\n      });\n    }\n\n    const newMarkNode: Element = {\n      nodeName: 'pega-email-entity',\n      tagName: 'pega-email-entity',\n      parentNode: textNode.parentNode,\n      attrs: [\n        { name: 'data-variant', value: `${match.variant}` },\n        { name: 'data-entity-type', value: match.type },\n        { name: 'data-description', value: JSON.stringify(consolidatedDescriptionArray) }\n      ],\n      namespaceURI: '',\n      childNodes: []\n    };\n\n    newMarkNode.childNodes.push({\n      nodeName: '#text',\n      value: match.matchedText,\n      parentNode: newMarkNode\n    });\n\n    updatedNodes.push(newMarkNode);\n\n    lastIndex = match.end;\n  });\n\n  if (lastIndex !== textNode.value.length) {\n    const newSpanNode: Element = {\n      nodeName: 'span',\n      tagName: 'span',\n      parentNode: textNode.parentNode,\n      attrs: [],\n      namespaceURI: '',\n      childNodes: []\n    };\n\n    newSpanNode.childNodes.push({\n      ...textNode,\n      nodeName: '#text',\n      value: textNode.value.substring(lastIndex),\n      parentNode: newSpanNode\n    } as TextNode);\n\n    updatedNodes.push(newSpanNode);\n  }\n\n  return updatedNodes;\n};\n\nconst highlightEntitiesInNode = (\n  node: Node,\n  entityMapping: EmailProps['entityHighlightMapping']\n) => {\n  // Either call self recursively or call mark entities in text\n  if (isParentNode(node) && node.childNodes?.length > 0) {\n    // Iteratively mark entities to all child nodes\n    let newChildNodes: Node[] = [];\n    node.childNodes.forEach(childNode => {\n      const res = highlightEntitiesInNode(childNode, entityMapping);\n      if (Array.isArray(res)) {\n        newChildNodes = [...newChildNodes, ...res];\n      } else {\n        newChildNodes.push(res as Node);\n      }\n    });\n    return { ...node, childNodes: newChildNodes };\n  }\n\n  if (node.nodeName === '#text') {\n    return highlightEntitiesInTextNode(node as TextNode, entityMapping);\n  }\n\n  return node;\n};\n\n/**\n * Function to highlight entities in a given html\n * @param html\n * @param entityMapping\n */\nconst highlightEntities = (\n  html: string,\n  entityMapping: EmailProps['entityHighlightMapping']\n): string => {\n  const document: Document = parse(html);\n\n  const markedDocument = highlightEntitiesInNode(document, entityMapping);\n\n  return serialize(markedDocument as Document);\n};\n\nexport default highlightEntities;\n"]}

package/lib/components/Feed/Feed.d.ts

@@ -1,5 +1,7 @@
 import type { FeedProps } from './Feed.types';
-export declare const StyledFilterDialog: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").DialogProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledFilterDialog: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").DialogProps, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string & Omit<import("react").ForwardRefExoticComponent<Omit<import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").DialogProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
 declare const Feed: import("react").ForwardRefExoticComponent<Omit<FeedProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 export default Feed;
 //# sourceMappingURL=Feed.d.ts.map

package/lib/components/Feed/Feed.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Feed.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/Feed.tsx"],"names":[],"mappings":"AAiCA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAY9C,eAAO,MAAM,kBAAkB,4RAc7B,CAAC;AAyBH,QAAA,MAAM,IAAI,mHAuMT,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Feed.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/Feed.tsx"],"names":[],"mappings":"AAiCA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAY9C,eAAO,MAAM,kBAAkB;;mQAc7B,CAAC;AAyBH,QAAA,MAAM,IAAI,mHAyMT,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/components/Feed/Feed.js

@@ -50,7 +50,7 @@ const StyledLoadMore = styled.div(({ theme }) => {
 });
 StyledLoadMore.defaultProps = defaultThemeProp;
 const Feed = forwardRef(function Feed(props, ref) {
-    const { loadingPosts = false, children, userInfo, className, title, searchTypes, onDecoratorSearch, searchResults = [], autopilotInfo = {
+    const { loadingPosts = false, progress = false, children, userInfo, className, title, searchTypes, onDecoratorSearch, searchResults = [], autopilotInfo = {
         id: 'autopilot',
         label: 'Autopilot'
     }, onAutopilotClick, onMentionClick, onMentionPreview, onTagClick, interactionRenderers = [], markdownMap, filters, onFilterChange, onLoadMore, onLinkRender, newPostRegion, posts = [], ...restProps } = props;
@@ -131,7 +131,7 @@ const Feed = forwardRef(function Feed(props, ref) {
             markdownMap,
             userInfo,
             feedRef
-        }, children: _jsxs(StyledFeed, { ref: feedRef, ...restProps, children: [_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(Text, { variant: 'h2', children: title }), filters && filters.length > 0 && (_jsx(Button, { as: FeedButton, ref: setButtonEl, variant: 'simple', icon: true, onClick: () => setMountDialog(curr => !curr), label: t('filters'), "aria-label": `${t('filters')} - ${t('pulse')}`, "aria-expanded": !!filters && mountDialog, "aria-owns": !!filters && mountDialog && buttonEl ? dialogId : undefined, emphasized: true, children: _jsx(Icon, { name: filters?.map(filter => !!filter.on).reduce((acc, curr) => acc || curr)
+        }, children: _jsxs(StyledFeed, { ref: feedRef, ...restProps, children: [_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(Text, { variant: 'h2', children: title }), filters && filters.length > 0 && (_jsx(Button, { as: FeedButton, ref: setButtonEl, variant: 'simple', icon: true, onClick: () => setMountDialog(curr => !curr), label: t('filters'), "aria-label": `${t('filters')} - ${t('pulse')}`, "aria-expanded": !!filters && mountDialog, "aria-owns": !!filters && mountDialog && buttonEl ? dialogId : undefined, children: _jsx(Icon, { name: filters?.map(filter => !!filter.on).reduce((acc, curr) => acc || curr)
                                             ? 'filter-on'
                                             : 'filter' }) })), !!filters && mountDialog && buttonEl && (_jsx(StyledFilterDialog, { ref: dialogRef, target: buttonEl, "aria-labelledby": headingId, id: dialogId, onKeyDown: (event) => {
                                         if (event.key === 'Escape') {
@@ -140,7 +140,7 @@ const Feed = forwardRef(function Feed(props, ref) {
                                         }
                                     }, children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, as: 'fieldset', children: [_jsx(Text, { variant: 'h3', as: 'legend', id: headingId, children: t('filters') }), _jsx(StyledFilterList, { ref: filterRef, children: filters?.map(filter => {
                                                     return (_jsx("li", { children: _jsx(Switch, { ...filter, onChange: (event) => onFilterChange?.(event.target.id, event.target.checked) }) }, filter.id));
-                                                }) })] }) }))] }), _jsx(CardContent, { children: newPostRegion })] }), _jsx("div", { id: id, children: posts }), loadingPosts && (_jsx(Flex, { container: { justify: 'center' }, as: StyledLoadMore, children: _jsx(Progress, { placement: 'inline' }) }))] }) }));
+                                                }) })] }) }))] }), _jsx(CardContent, { children: progress ? _jsx(Progress, { message: t('loading'), placement: 'block' }) : newPostRegion })] }), _jsx("div", { id: id, children: posts }), loadingPosts && (_jsx(Flex, { container: { justify: 'center' }, as: StyledLoadMore, children: _jsx(Progress, { placement: 'inline' }) }))] }) }));
 });
 export default Feed;
 //# sourceMappingURL=Feed.js.map

package/lib/components/Feed/Feed.js.map

@@ -1 +1 @@
-{"version":3,"file":"Feed.js","sourceRoot":"","sources":["../../../src/components/Feed/Feed.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useRef, useEffect, forwardRef } from 'react';\nimport type { ChangeEvent, PropsWithoutRef, KeyboardEvent as ReactKeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  defaultThemeProp,\n  Flex,\n  getFocusables,\n  Icon,\n  registerIcon,\n  StyledCard,\n  Switch,\n  Text,\n  Progress,\n  usePrevious,\n  useLiveLog,\n  useItemIntersection,\n  useUID,\n  useConsolidatedRef,\n  type RefElement\n} from '@pega/cosmos-react-core';\nimport { useArrows, useElement, useI18n, useOuterEvent } from '@pega/cosmos-react-core/lib/hooks';\nimport * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';\nimport * as filterOnIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter-on.icon';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\nimport Dialog from '@pega/cosmos-react-core/lib/components/Dialog/Dialog';\n\nimport { FeedContext } from './Feed.context';\nimport FeedButton from './FeedButton';\nimport type { FeedProps } from './Feed.types';\n\nregisterIcon(filterIcon, filterOnIcon);\n\nconst StyledFeed = styled.div`\n  ${StyledCardHeader}:not(${StyledCard} ${StyledCard} > ${StyledCardHeader}) {\n    padding-bottom: 0.25rem;\n  }\n`;\n\nStyledFeed.defaultProps = defaultThemeProp;\n\nexport const StyledFilterDialog = styled(Dialog)(({ theme }) => {\n  return css`\n    min-width: fit-content;\n    fieldset {\n      padding-block-end: calc(2 * ${theme.base.spacing});\n      border: none;\n      max-height: inherit;\n\n      legend {\n        padding-block-start: calc(2 * ${theme.base.spacing});\n        padding-inline: calc(2 * ${theme.base.spacing});\n      }\n    }\n  `;\n});\n\nStyledFilterDialog.defaultProps = defaultThemeProp;\n\nconst StyledFilterList = styled.ul(({ theme }) => {\n  return css`\n    list-style-type: none;\n    min-width: ${theme.base['content-width'].xs};\n    padding-inline: calc(2 * ${theme.base.spacing});\n    overflow: auto;\n  `;\n});\n\nStyledFilterList.defaultProps = defaultThemeProp;\n\nconst StyledLoadMore = styled.div(({ theme }) => {\n  return css`\n    margin-top: ${theme.base.spacing};\n    min-height: 2rem;\n    min-width: 2rem;\n  `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nconst Feed = forwardRef<RefElement<FeedProps>, PropsWithoutRef<FeedProps>>(\n  function Feed(props, ref) {\n    const {\n      loadingPosts = false,\n      children,\n      userInfo,\n      className,\n      title,\n      searchTypes,\n      onDecoratorSearch,\n      searchResults = [],\n      autopilotInfo = {\n        id: 'autopilot',\n        label: 'Autopilot'\n      },\n      onAutopilotClick,\n      onMentionClick,\n      onMentionPreview,\n      onTagClick,\n      interactionRenderers = [],\n      markdownMap,\n      filters,\n      onFilterChange,\n      onLoadMore,\n      onLinkRender,\n      newPostRegion,\n      posts = [],\n      ...restProps\n    } = props;\n    const t = useI18n();\n    const dialogRef = useRef<HTMLDivElement>(null);\n    const [buttonEl, setButtonEl] = useElement<HTMLButtonElement>();\n    const headingId = useUID();\n    const dialogId = useUID();\n    const [mountDialog, setMountDialog] = useState(false);\n    const [showSearchResults, setShowSearchResults] = useState(false);\n    const prevPosts = usePrevious(posts);\n    const { announcePolite } = useLiveLog();\n\n    const feedRef = useConsolidatedRef(ref);\n\n    const filterRef = useRef(null);\n    useArrows(filterRef);\n\n    useOuterEvent('mousedown', [dialogRef, buttonEl], () => {\n      setMountDialog(false);\n    });\n\n    useOuterEvent('focusin', [dialogRef, buttonEl], () => {\n      setMountDialog(false);\n    });\n\n    const onKeydown = ({ key }: KeyboardEvent) => {\n      if (key === 'Escape') setMountDialog(false);\n    };\n\n    useEffect(() => {\n      document.addEventListener('keydown', onKeydown);\n      return () => {\n        document.removeEventListener('keydown', onKeydown);\n      };\n    }, []);\n\n    const id = useUID();\n    useItemIntersection(\n      { current: null },\n      posts.length - 1,\n      () => {\n        onLoadMore?.();\n      },\n      `#${id} > article[role='none']`,\n      feedRef\n    );\n\n    useEffect(() => {\n      if (loadingPosts) {\n        announcePolite({ message: t('loading_post') });\n      }\n    }, [loadingPosts]);\n\n    useEffect(() => {\n      if (prevPosts) {\n        const difference = posts.length - prevPosts.length;\n        if (difference < 0) announcePolite({ message: t('feed_post_removed') });\n        else if (difference > 0) {\n          announcePolite({\n            message: t('feed_new_post_added', [difference], { count: difference })\n          });\n        }\n      }\n    }, [posts]);\n\n    useEffect(() => {\n      if (mountDialog) {\n        setTimeout(() => {\n          const focusables = getFocusables(filterRef);\n          focusables[0]?.focus();\n        }, 0);\n      }\n    }, [mountDialog]);\n\n    return (\n      <FeedContext.Provider\n        // eslint-disable-next-line react/jsx-no-constructed-context-values\n        value={{\n          searchTypes,\n          onSearch: onDecoratorSearch,\n          searchResults,\n          showSearchResults,\n          setShowSearchResults,\n          autopilotInfo,\n          onLinkRender,\n          onAutopilotClick,\n          onMentionClick,\n          onMentionPreview,\n          onTagClick,\n          interactionRenderers,\n          markdownMap,\n          userInfo,\n          feedRef\n        }}\n      >\n        <StyledFeed ref={feedRef} {...restProps}>\n          <Card>\n            <CardHeader>\n              <Text variant='h2'>{title}</Text>\n              {filters && filters.length > 0 && (\n                <Button\n                  as={FeedButton}\n                  ref={setButtonEl}\n                  variant='simple'\n                  icon\n                  onClick={() => setMountDialog(curr => !curr)}\n                  label={t('filters')}\n                  aria-label={`${t('filters')} - ${t('pulse')}`}\n                  aria-expanded={!!filters && mountDialog}\n                  aria-owns={!!filters && mountDialog && buttonEl ? dialogId : undefined}\n                  emphasized\n                >\n                  <Icon\n                    name={\n                      filters?.map(filter => !!filter.on).reduce((acc, curr) => acc || curr)\n                        ? 'filter-on'\n                        : 'filter'\n                    }\n                  />\n                </Button>\n              )}\n\n              {!!filters && mountDialog && buttonEl && (\n                <StyledFilterDialog\n                  ref={dialogRef}\n                  target={buttonEl}\n                  aria-labelledby={headingId}\n                  id={dialogId}\n                  onKeyDown={(event: ReactKeyboardEvent) => {\n                    if (event.key === 'Escape') {\n                      event.preventDefault();\n                      buttonEl?.focus();\n                    }\n                  }}\n                >\n                  <Flex container={{ direction: 'column', gap: 2 }} as='fieldset'>\n                    <Text variant='h3' as='legend' id={headingId}>\n                      {t('filters')}\n                    </Text>\n                    <StyledFilterList ref={filterRef}>\n                      {filters?.map(filter => {\n                        return (\n                          <li key={filter.id}>\n                            <Switch\n                              {...filter}\n                              onChange={(event: ChangeEvent<HTMLInputElement>) =>\n                                onFilterChange?.(event.target.id, event.target.checked)\n                              }\n                            />\n                          </li>\n                        );\n                      })}\n                    </StyledFilterList>\n                  </Flex>\n                </StyledFilterDialog>\n              )}\n            </CardHeader>\n\n            <CardContent>{newPostRegion}</CardContent>\n          </Card>\n\n          <div id={id}>{posts}</div>\n\n          {loadingPosts && (\n            <Flex container={{ justify: 'center' }} as={StyledLoadMore}>\n              <Progress placement='inline' />\n            </Flex>\n          )}\n        </StyledFeed>\n      </FeedContext.Provider>\n    );\n  }\n);\n\nexport default Feed;\n"]}
+{"version":3,"file":"Feed.js","sourceRoot":"","sources":["../../../src/components/Feed/Feed.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,MAAM,EACN,IAAI,EACJ,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,IAAI,EACJ,aAAa,EACb,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,UAAU,EACV,mBAAmB,EACnB,MAAM,EACN,kBAAkB,EAEnB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClG,OAAO,KAAK,UAAU,MAAM,+DAA+D,CAAC;AAC5F,OAAO,KAAK,YAAY,MAAM,kEAAkE,CAAC;AACjG,OAAO,EAAE,gBAAgB,EAAE,MAAM,wDAAwD,CAAC;AAC1F,OAAO,MAAM,MAAM,sDAAsD,CAAC;AAE1E,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,UAAU,MAAM,cAAc,CAAC;AAGtC,YAAY,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC;AAEvC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;IACzB,gBAAgB,QAAQ,UAAU,IAAI,UAAU,MAAM,gBAAgB;;;CAGzE,CAAC;AAEF,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,OAAO,GAAG,CAAA;;;oCAGwB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;wCAKd,KAAK,CAAC,IAAI,CAAC,OAAO;mCACvB,KAAK,CAAC,IAAI,CAAC,OAAO;;;GAGlD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,gBAAgB,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC/C,OAAO,GAAG,CAAA;;iBAEK,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;+BAChB,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE9C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9C,OAAO,GAAG,CAAA;kBACM,KAAK,CAAC,IAAI,CAAC,OAAO;;;GAGjC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,IAAI,GAAG,UAAU,CACrB,SAAS,IAAI,CAAC,KAAK,EAAE,GAAG;IACtB,MAAM,EACJ,YAAY,GAAG,KAAK,EACpB,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,KAAK,EACL,WAAW,EACX,iBAAiB,EACjB,aAAa,GAAG,EAAE,EAClB,aAAa,GAAG;QACd,EAAE,EAAE,WAAW;QACf,KAAK,EAAE,WAAW;KACnB,EACD,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,UAAU,EACV,oBAAoB,GAAG,EAAE,EACzB,WAAW,EACX,OAAO,EACP,cAAc,EACd,UAAU,EACV,YAAY,EACZ,aAAa,EACb,KAAK,GAAG,EAAE,EACV,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,UAAU,EAAqB,CAAC;IAChE,MAAM,SAAS,GAAG,MAAM,EAAE,CAAC;IAC3B,MAAM,QAAQ,GAAG,MAAM,EAAE,CAAC;IAC1B,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClE,MAAM,SAAS,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IACrC,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IAExC,MAAM,OAAO,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAExC,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC/B,SAAS,CAAC,SAAS,CAAC,CAAC;IAErB,aAAa,CAAC,WAAW,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE;QACrD,cAAc,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC,CAAC;IAEH,aAAa,CAAC,SAAS,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE;QACnD,cAAc,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,CAAC,EAAE,GAAG,EAAiB,EAAE,EAAE;QAC3C,IAAI,GAAG,KAAK,QAAQ;YAAE,cAAc,CAAC,KAAK,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QAChD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QACrD,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,EAAE,GAAG,MAAM,EAAE,CAAC;IACpB,mBAAmB,CACjB,EAAE,OAAO,EAAE,IAAI,EAAE,EACjB,KAAK,CAAC,MAAM,GAAG,CAAC,EAChB,GAAG,EAAE;QACH,UAAU,EAAE,EAAE,CAAC;IACjB,CAAC,EACD,IAAI,EAAE,yBAAyB,EAC/B,OAAO,CACR,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,EAAE,CAAC;YACjB,cAAc,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC;QACjD,CAAC;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,EAAE,CAAC;YACd,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC;YACnD,IAAI,UAAU,GAAG,CAAC;gBAAE,cAAc,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,mBAAmB,CAAC,EAAE,CAAC,CAAC;iBACnE,IAAI,UAAU,GAAG,CAAC,EAAE,CAAC;gBACxB,cAAc,CAAC;oBACb,OAAO,EAAE,CAAC,CAAC,qBAAqB,EAAE,CAAC,UAAU,CAAC,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC;iBACvE,CAAC,CAAC;YACL,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,WAAW,EAAE,CAAC;YAChB,UAAU,CAAC,GAAG,EAAE;gBACd,MAAM,UAAU,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;gBAC5C,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC;YACzB,CAAC,EAAE,CAAC,CAAC,CAAC;QACR,CAAC;IACH,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,OAAO,CACL,KAAC,WAAW,CAAC,QAAQ;IACnB,mEAAmE;;QAAnE,mEAAmE;QACnE,KAAK,EAAE;YACL,WAAW;YACX,QAAQ,EAAE,iBAAiB;YAC3B,aAAa;YACb,iBAAiB;YACjB,oBAAoB;YACpB,aAAa;YACb,YAAY;YACZ,gBAAgB;YAChB,cAAc;YACd,gBAAgB;YAChB,UAAU;YACV,oBAAoB;YACpB,WAAW;YACX,QAAQ;YACR,OAAO;SACR,YAED,MAAC,UAAU,IAAC,GAAG,EAAE,OAAO,KAAM,SAAS,aACrC,MAAC,IAAI,eACH,MAAC,UAAU,eACT,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,KAAK,GAAQ,EAChC,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,CAChC,KAAC,MAAM,IACL,EAAE,EAAE,UAAU,EACd,GAAG,EAAE,WAAW,EAChB,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,EAC5C,KAAK,EAAE,CAAC,CAAC,SAAS,CAAC,gBACP,GAAG,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAAE,mBAC9B,CAAC,CAAC,OAAO,IAAI,WAAW,eAC5B,CAAC,CAAC,OAAO,IAAI,WAAW,IAAI,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,YAEtE,KAAC,IAAI,IACH,IAAI,EACF,OAAO,EAAE,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,GAAG,IAAI,IAAI,CAAC;4CACpE,CAAC,CAAC,WAAW;4CACb,CAAC,CAAC,QAAQ,GAEd,GACK,CACV,EAEA,CAAC,CAAC,OAAO,IAAI,WAAW,IAAI,QAAQ,IAAI,CACvC,KAAC,kBAAkB,IACjB,GAAG,EAAE,SAAS,EACd,MAAM,EAAE,QAAQ,qBACC,SAAS,EAC1B,EAAE,EAAE,QAAQ,EACZ,SAAS,EAAE,CAAC,KAAyB,EAAE,EAAE;wCACvC,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;4CAC3B,KAAK,CAAC,cAAc,EAAE,CAAC;4CACvB,QAAQ,EAAE,KAAK,EAAE,CAAC;wCACpB,CAAC;oCACH,CAAC,YAED,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,EAAC,UAAU,aAC7D,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,EAAC,EAAE,EAAC,QAAQ,EAAC,EAAE,EAAE,SAAS,YACzC,CAAC,CAAC,SAAS,CAAC,GACR,EACP,KAAC,gBAAgB,IAAC,GAAG,EAAE,SAAS,YAC7B,OAAO,EAAE,GAAG,CAAC,MAAM,CAAC,EAAE;oDACrB,OAAO,CACL,uBACE,KAAC,MAAM,OACD,MAAM,EACV,QAAQ,EAAE,CAAC,KAAoC,EAAE,EAAE,CACjD,cAAc,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAEzD,IANK,MAAM,CAAC,EAAE,CAOb,CACN,CAAC;gDACJ,CAAC,CAAC,GACe,IACd,GACY,CACtB,IACU,EAEb,KAAC,WAAW,cACT,QAAQ,CAAC,CAAC,CAAC,KAAC,QAAQ,IAAC,OAAO,EAAE,CAAC,CAAC,SAAS,CAAC,EAAE,SAAS,EAAC,OAAO,GAAG,CAAC,CAAC,CAAC,aAAa,GACrE,IACT,EAEP,cAAK,EAAE,EAAE,EAAE,YAAG,KAAK,GAAO,EAEzB,YAAY,IAAI,CACf,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,cAAc,YACxD,KAAC,QAAQ,IAAC,SAAS,EAAC,QAAQ,GAAG,GAC1B,CACR,IACU,GACQ,CACxB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { useState, useRef, useEffect, forwardRef } from 'react';\nimport type { ChangeEvent, PropsWithoutRef, KeyboardEvent as ReactKeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  defaultThemeProp,\n  Flex,\n  getFocusables,\n  Icon,\n  registerIcon,\n  StyledCard,\n  Switch,\n  Text,\n  Progress,\n  usePrevious,\n  useLiveLog,\n  useItemIntersection,\n  useUID,\n  useConsolidatedRef,\n  type RefElement\n} from '@pega/cosmos-react-core';\nimport { useArrows, useElement, useI18n, useOuterEvent } from '@pega/cosmos-react-core/lib/hooks';\nimport * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';\nimport * as filterOnIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter-on.icon';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\nimport Dialog from '@pega/cosmos-react-core/lib/components/Dialog/Dialog';\n\nimport { FeedContext } from './Feed.context';\nimport FeedButton from './FeedButton';\nimport type { FeedProps } from './Feed.types';\n\nregisterIcon(filterIcon, filterOnIcon);\n\nconst StyledFeed = styled.div`\n  ${StyledCardHeader}:not(${StyledCard} ${StyledCard} > ${StyledCardHeader}) {\n    padding-bottom: 0.25rem;\n  }\n`;\n\nStyledFeed.defaultProps = defaultThemeProp;\n\nexport const StyledFilterDialog = styled(Dialog)(({ theme }) => {\n  return css`\n    min-width: fit-content;\n    fieldset {\n      padding-block-end: calc(2 * ${theme.base.spacing});\n      border: none;\n      max-height: inherit;\n\n      legend {\n        padding-block-start: calc(2 * ${theme.base.spacing});\n        padding-inline: calc(2 * ${theme.base.spacing});\n      }\n    }\n  `;\n});\n\nStyledFilterDialog.defaultProps = defaultThemeProp;\n\nconst StyledFilterList = styled.ul(({ theme }) => {\n  return css`\n    list-style-type: none;\n    min-width: ${theme.base['content-width'].xs};\n    padding-inline: calc(2 * ${theme.base.spacing});\n    overflow: auto;\n  `;\n});\n\nStyledFilterList.defaultProps = defaultThemeProp;\n\nconst StyledLoadMore = styled.div(({ theme }) => {\n  return css`\n    margin-top: ${theme.base.spacing};\n    min-height: 2rem;\n    min-width: 2rem;\n  `;\n});\n\nStyledLoadMore.defaultProps = defaultThemeProp;\n\nconst Feed = forwardRef<RefElement<FeedProps>, PropsWithoutRef<FeedProps>>(\n  function Feed(props, ref) {\n    const {\n      loadingPosts = false,\n      progress = false,\n      children,\n      userInfo,\n      className,\n      title,\n      searchTypes,\n      onDecoratorSearch,\n      searchResults = [],\n      autopilotInfo = {\n        id: 'autopilot',\n        label: 'Autopilot'\n      },\n      onAutopilotClick,\n      onMentionClick,\n      onMentionPreview,\n      onTagClick,\n      interactionRenderers = [],\n      markdownMap,\n      filters,\n      onFilterChange,\n      onLoadMore,\n      onLinkRender,\n      newPostRegion,\n      posts = [],\n      ...restProps\n    } = props;\n    const t = useI18n();\n    const dialogRef = useRef<HTMLDivElement>(null);\n    const [buttonEl, setButtonEl] = useElement<HTMLButtonElement>();\n    const headingId = useUID();\n    const dialogId = useUID();\n    const [mountDialog, setMountDialog] = useState(false);\n    const [showSearchResults, setShowSearchResults] = useState(false);\n    const prevPosts = usePrevious(posts);\n    const { announcePolite } = useLiveLog();\n\n    const feedRef = useConsolidatedRef(ref);\n\n    const filterRef = useRef(null);\n    useArrows(filterRef);\n\n    useOuterEvent('mousedown', [dialogRef, buttonEl], () => {\n      setMountDialog(false);\n    });\n\n    useOuterEvent('focusin', [dialogRef, buttonEl], () => {\n      setMountDialog(false);\n    });\n\n    const onKeydown = ({ key }: KeyboardEvent) => {\n      if (key === 'Escape') setMountDialog(false);\n    };\n\n    useEffect(() => {\n      document.addEventListener('keydown', onKeydown);\n      return () => {\n        document.removeEventListener('keydown', onKeydown);\n      };\n    }, []);\n\n    const id = useUID();\n    useItemIntersection(\n      { current: null },\n      posts.length - 1,\n      () => {\n        onLoadMore?.();\n      },\n      `#${id} > article[role='none']`,\n      feedRef\n    );\n\n    useEffect(() => {\n      if (loadingPosts) {\n        announcePolite({ message: t('loading_post') });\n      }\n    }, [loadingPosts]);\n\n    useEffect(() => {\n      if (prevPosts) {\n        const difference = posts.length - prevPosts.length;\n        if (difference < 0) announcePolite({ message: t('feed_post_removed') });\n        else if (difference > 0) {\n          announcePolite({\n            message: t('feed_new_post_added', [difference], { count: difference })\n          });\n        }\n      }\n    }, [posts]);\n\n    useEffect(() => {\n      if (mountDialog) {\n        setTimeout(() => {\n          const focusables = getFocusables(filterRef);\n          focusables[0]?.focus();\n        }, 0);\n      }\n    }, [mountDialog]);\n\n    return (\n      <FeedContext.Provider\n        // eslint-disable-next-line react/jsx-no-constructed-context-values\n        value={{\n          searchTypes,\n          onSearch: onDecoratorSearch,\n          searchResults,\n          showSearchResults,\n          setShowSearchResults,\n          autopilotInfo,\n          onLinkRender,\n          onAutopilotClick,\n          onMentionClick,\n          onMentionPreview,\n          onTagClick,\n          interactionRenderers,\n          markdownMap,\n          userInfo,\n          feedRef\n        }}\n      >\n        <StyledFeed ref={feedRef} {...restProps}>\n          <Card>\n            <CardHeader>\n              <Text variant='h2'>{title}</Text>\n              {filters && filters.length > 0 && (\n                <Button\n                  as={FeedButton}\n                  ref={setButtonEl}\n                  variant='simple'\n                  icon\n                  onClick={() => setMountDialog(curr => !curr)}\n                  label={t('filters')}\n                  aria-label={`${t('filters')} - ${t('pulse')}`}\n                  aria-expanded={!!filters && mountDialog}\n                  aria-owns={!!filters && mountDialog && buttonEl ? dialogId : undefined}\n                >\n                  <Icon\n                    name={\n                      filters?.map(filter => !!filter.on).reduce((acc, curr) => acc || curr)\n                        ? 'filter-on'\n                        : 'filter'\n                    }\n                  />\n                </Button>\n              )}\n\n              {!!filters && mountDialog && buttonEl && (\n                <StyledFilterDialog\n                  ref={dialogRef}\n                  target={buttonEl}\n                  aria-labelledby={headingId}\n                  id={dialogId}\n                  onKeyDown={(event: ReactKeyboardEvent) => {\n                    if (event.key === 'Escape') {\n                      event.preventDefault();\n                      buttonEl?.focus();\n                    }\n                  }}\n                >\n                  <Flex container={{ direction: 'column', gap: 2 }} as='fieldset'>\n                    <Text variant='h3' as='legend' id={headingId}>\n                      {t('filters')}\n                    </Text>\n                    <StyledFilterList ref={filterRef}>\n                      {filters?.map(filter => {\n                        return (\n                          <li key={filter.id}>\n                            <Switch\n                              {...filter}\n                              onChange={(event: ChangeEvent<HTMLInputElement>) =>\n                                onFilterChange?.(event.target.id, event.target.checked)\n                              }\n                            />\n                          </li>\n                        );\n                      })}\n                    </StyledFilterList>\n                  </Flex>\n                </StyledFilterDialog>\n              )}\n            </CardHeader>\n\n            <CardContent>\n              {progress ? <Progress message={t('loading')} placement='block' /> : newPostRegion}\n            </CardContent>\n          </Card>\n\n          <div id={id}>{posts}</div>\n\n          {loadingPosts && (\n            <Flex container={{ justify: 'center' }} as={StyledLoadMore}>\n              <Progress placement='inline' />\n            </Flex>\n          )}\n        </StyledFeed>\n      </FeedContext.Provider>\n    );\n  }\n);\n\nexport default Feed;\n"]}