npm - @pega/cosmos-react-social - Versions diffs - 8.0.0-build.9.0 → 8.0.0 - Mend

@pega/cosmos-react-social 8.0.0-build.9.0 → 8.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (212) hide show

package/lib/components/Email/EmailSelector.js CHANGED Viewed

@@ -1,22 +1,16 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo, useState } from 'react';
-import { ComboBox, createStringMatcher, menuHelpers, useI18n, useAfterInitialEffect } from '@pega/cosmos-react-core';
-const EmailSelector = ({ participants, selectedItems, label, mode, required, onSelectedItemChange, externalValidator, status, info, compose }) => {
+import { useMemo, useState, useEffect } from 'react';
+import { ComboBox, menuHelpers, useI18n } from '@pega/cosmos-react-core';
+const EmailSelector = ({ participants, selectedItems, label, mode, required, onSelectedItemChange, externalValidator, status, info, compose, onFilterChange, onLoadMore, loading, accent }) => {
     const [filterValue, setFilterValue] = useState('');
-    const [emailParticipants, setEmailParticipants] = useState(participants);
+    const [customEmailParticipants, setCustomEmailParticipants] = useState([]);
     const t = useI18n();
-    useAfterInitialEffect(() => {
-        setEmailParticipants(participants);
-    }, [participants]);
-    const filterRegex = createStringMatcher(filterValue, 'contains');
+    useEffect(() => {
+        onFilterChange(filterValue);
+    }, [filterValue]);
     const emailsToRender = useMemo(() => {
-        const filteredItems = (filterValue
-            ? emailParticipants.filter(({ emailAddress, fullName, shortName }) => {
-                return (filterRegex.test(emailAddress) ||
-                    filterRegex.test(fullName) ||
-                    filterRegex.test(shortName));
-            })
-            : emailParticipants).map(({ emailAddress, fullName }) => {
+        const emailParticipants = participants.concat(customEmailParticipants);
+        const items = emailParticipants.map(({ emailAddress, fullName }) => {
             return {
                 id: emailAddress,
                 primary: fullName,
@@ -33,10 +27,10 @@ const EmailSelector = ({ participants, selectedItems, label, mode, required, onS
                     primary: `${t('use')}: ${filterValue}`,
                     selected: selectedItems.includes(filterValue)
                 },
-                ...filteredItems
+                ...items
             ]
-            : filteredItems;
-    }, [emailParticipants, selectedItems, filterRegex]);
+            : items;
+    }, [participants, customEmailParticipants, selectedItems]);
     const toggleSelectedItems = (id) => {
         let newSelectedItems = mode === 'single-select' ? [] : [...selectedItems];
         if (selectedItems.includes(id)) {
@@ -49,8 +43,8 @@ const EmailSelector = ({ participants, selectedItems, label, mode, required, onS
             if (!filteredItem?.secondary) {
                 // New value addition to the list
                 if (!externalValidator) {
-                    setEmailParticipants([
-                        ...emailParticipants,
+                    setCustomEmailParticipants([
+                        ...customEmailParticipants,
                         {
                             shortName: '',
                             fullName: '',
@@ -62,8 +56,8 @@ const EmailSelector = ({ participants, selectedItems, label, mode, required, onS
                 else {
                     const isValid = externalValidator?.(filterValue);
                     if (isValid) {
-                        setEmailParticipants([
-                            ...emailParticipants,
+                        setCustomEmailParticipants([
+                            ...customEmailParticipants,
                             {
                                 shortName: '',
                                 fullName: '',
@@ -87,14 +81,12 @@ const EmailSelector = ({ participants, selectedItems, label, mode, required, onS
         }
         return selectedItems.map(value => ({ id: value, text: value }));
     };
-    const clearSelection = () => {
-        onSelectedItemChange([], label);
-    };
     const comboBoxProps = {
         value: filterValue,
         onChange: (e) => {
-            if (!e.target.value)
-                clearSelection();
+            if (mode === 'single-select' && !e.target.value) {
+                onSelectedItemChange([], label);
+            }
             setFilterValue(e.target.value);
         },
         onBlur: () => {
@@ -102,8 +94,12 @@ const EmailSelector = ({ participants, selectedItems, label, mode, required, onS
         },
         menu: {
             items: emailsToRender,
-            accent: filterRegex,
-            onItemClick: toggleSelectedItems
+            accent,
+            onItemClick: toggleSelectedItems,
+            loadMore: () => {
+                onLoadMore?.(filterValue);
+            },
+            loading
         },
         selected: {
             items: getSelectedItems(),

package/lib/components/Email/EmailSelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailSelector.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSelector.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;~~AAG1C~~,OAAO,~~EACL~~,QAAQ,~~EACR~~,~~mBAAmB,EACnB,~~WAAW,~~EACX~~,OAAO,~~EACP~~,~~qBAAqB,EACtB,~~MAAM,yBAAyB,CAAC;~~AA2BjC~~,MAAM,aAAa,GAEf,CAAC,EACH,YAAY,EACZ,aAAa,EACb,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,oBAAoB,EACpB,iBAAiB,EACjB,MAAM,EACN,IAAI,EACJ,OAAO,~~EACR~~,EAAE,EAAE;IACH,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,~~iBAAiB~~,EAAE,~~oBAAoB~~,CAAC,GAAG,QAAQ,~~CAAC~~,~~YAAY~~,CAAC,CAAC;~~IACzE~~,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,~~qBAAqB~~,CAAC,GAAG,EAAE;~~QACzB~~,~~oBAAoB~~,CAAC,~~YAAY~~,CAAC,CAAC;~~IACrC~~,CAAC,EAAE,CAAC,~~YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,~~WAAW,~~GAAG,mBAAmB,~~CAAC,~~WAAW,EAAE,UAAU,~~CAAC,CAAC;~~IAEjE~~,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,MAAM,~~aAAa,GAAG,CACpB,WAAW;YACT,CAAC,CAAC,~~iBAAiB,~~CAAC~~,~~MAAM,CAAC,CAAC,EAAE,~~YAAY,~~EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,EAAE;gBACjE,OAAO,CACL,WAAW,~~CAAC,~~IAAI~~,CAAC,~~YAAY~~,CAAC~~;oBAC9B~~,~~WAAW,~~CAAC~~,IAAI,CAAC,QAAQ,CAAC~~;~~oBAC1B~~,~~WAAW~~,~~CAAC~~,~~IAAI~~,~~CAAC,SAAS,CAAC,CAC5B,CAAC;YACJ,CAAC,CAAC;YACJ,CAAC,CAAC,~~iBAAiB,~~CACtB,~~CAAC,GAAG,CAAC,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,EAAE;~~YACnC~~,OAAO;gBACL,EAAE,EAAE,YAAY;gBAChB,OAAO,EAAE,QAAQ;gBACjB,SAAS,EAAE,CAAC,YAAY,CAAC;gBACzB,QAAQ,EAAE,aAAa,CAAC,QAAQ,CAAC,YAAY,CAAC;aAC/C,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,iBAAiB,EAAE,CAAC,WAAW,CAAC,CAAC;QAEjD,OAAO,CAAC,CAAC,WAAW,IAAI,iBAAiB,IAAI,OAAO,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,iBAAiB,CAAC,CAAC;YAC3F,CAAC,OAAO;YACR,CAAC,CAAC;gBACE;oBACE,EAAE,EAAE,WAAW;oBACf,OAAO,EAAE,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,WAAW,EAAE;oBACtC,QAAQ,EAAE,aAAa,CAAC,QAAQ,CAAC,WAAW,CAAC;iBAC9C;gBACD,GAAG,~~aAAa~~;~~aACjB~~;YACH,CAAC,CAAC,~~aAAa~~,CAAC;~~IACpB~~,CAAC,EAAE,CAAC,~~iBAAiB~~,EAAE,~~aAAa~~,EAAE,~~WAAW~~,CAAC,CAAC,CAAC;~~IAEpD~~,MAAM,mBAAmB,GAAG,CAAC,EAAU,EAAE,EAAE;QACzC,IAAI,gBAAgB,GAAG,IAAI,KAAK,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC;QAE1E,IAAI,aAAa,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE,CAAC;YAC/B,oCAAoC;YACpC,gBAAgB,GAAG,gBAAgB,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,KAAK,EAAE,CAAC,CAAC;QACpE,CAAC;aAAM,CAAC;YACN,cAAc,CAAC,EAAE,CAAC,CAAC;YACnB,MAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAgB,cAAc,EAAE,EAAE,CAAC,CAAC;YAE5E,IAAI,CAAC,YAAY,EAAE,SAAS,EAAE,CAAC;gBAC7B,iCAAiC;gBACjC,IAAI,CAAC,iBAAiB,EAAE,CAAC;oBACvB,~~oBAAoB~~,CAAC;~~wBACnB~~,GAAG,~~iBAAiB~~;~~wBACpB~~;4BACE,SAAS,EAAE,EAAE;4BACb,QAAQ,EAAE,EAAE;4BACZ,YAAY,EAAE,WAAW;yBAC1B;qBACF,CAAC,CAAC;oBACH,gBAAgB,GAAG,CAAC,GAAG,gBAAgB,EAAE,EAAE,CAAC,CAAC;gBAC/C,CAAC;qBAAM,CAAC;oBACN,MAAM,OAAO,GAAG,iBAAiB,EAAE,CAAC,WAAW,CAAC,CAAC;oBACjD,IAAI,OAAO,EAAE,CAAC;wBACZ,~~oBAAoB~~,CAAC;~~4BACnB~~,GAAG,~~iBAAiB~~;~~4BACpB~~;gCACE,SAAS,EAAE,EAAE;gCACb,QAAQ,EAAE,EAAE;gCACZ,YAAY,EAAE,WAAW;6BAC1B;yBACF,CAAC,CAAC;wBACH,gBAAgB,GAAG,CAAC,GAAG,gBAAgB,EAAE,EAAE,CAAC,CAAC;oBAC/C,CAAC;gBACH,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,gCAAgC;gBAChC,gBAAgB,GAAG,CAAC,GAAG,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;QACH,CAAC;QAED,oBAAoB,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;IAChD,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC5B,IAAI,IAAI,KAAK,eAAe,EAAE,CAAC;YAC7B,OAAO,EAAE,EAAE,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;QAC1D,CAAC;QACD,OAAO,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;IAClE,CAAC,CAAC;IAEF,MAAM,~~cAAc,GAAG,GAAG,EAAE;QAC1B,oBAAoB,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;IAClC,CAAC,CAAC;IAEF,MAAM,~~aAAa,GAAG;QACpB,KAAK,EAAE,WAAW;QAClB,QAAQ,EAAE,CAAC,CAAgC,EAAE,EAAE;YAC7C,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK;~~gBAAE~~,~~cAAc~~,EAAE,CAAC;~~YACtC~~,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC;QACD,MAAM,EAAE,GAAG,EAAE;YACX,cAAc,CAAC,EAAE,CAAC,CAAC;QACrB,CAAC;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,cAAc;YACrB,MAAM,EAAE,~~WAAW~~;~~YACnB~~,~~WAAW~~,EAAE,~~mBAAmB~~;~~SACjC~~;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,gBAAgB,EAAE;YACzB,QAAQ,EAAE,mBAAmB;SAC9B;QACD,KAAK;QACL,IAAI;QACJ,QAAQ;QACR,MAAM;QACN,IAAI;KACL,CAAC;IAEF,OAAO,KAAC,QAAQ,OAAK,aAAa,GAAI,CAAC;AACzC,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useMemo, useState } from 'react';\nimport type { FunctionComponent, ChangeEvent, ReactNode } from 'react';\n\nimport {\n ComboBox~~,\n createStringMatcher,\n~~ menuHelpers~~,\n~~ useI18n~~,\n useAfterInitialEffect\n~~} from '@pega/cosmos-react-core';\nimport type {\n ComboBoxProps,\n NoChildrenProp,\n FormControlProps,\n MenuItemProps\n} from '@pega/cosmos-react-core';\n\nimport type { EmailComposerProps, EmailUser } from './Email.types';\n\nexport interface EmailSelectorProps extends NoChildrenProp {\n /** participants /\n participants: EmailComposerProps['participants'];\n /* default selections /\n selectedItems: EmailUser['emailAddress'][];\n /* selectedItems /\n onSelectedItemChange: (selectedItems: EmailUser['emailAddress'][], label: ReactNode) => void;\n /\n Callback to handle external entry validation\n * If returned true considers the entry to be a valid entry\n */\n externalValidator?: EmailComposerProps['externalValidator'];\n status?: FormControlProps['status'];\n info?: FormControlProps['info'];\n compose?: boolean;\n}\n\nconst EmailSelector: FunctionComponent<\n EmailSelectorProps & Pick<ComboBoxProps, 'label' \| 'mode' \| 'required'>\n> = ({\n participants,\n selectedItems,\n label,\n mode,\n required,\n onSelectedItemChange,\n externalValidator,\n status,\n info,\n compose\n}) => {\n const [filterValue, setFilterValue] = useState('');\n const [~~emailParticipants~~, ~~setEmailParticipants~~] = useState(~~participants~~);\n const t = useI18n();\n\n ~~useAfterInitialEffect~~(() => {\n ~~setEmailParticipants~~(~~participants~~);\n }, [~~participants~~]);\n\n const ~~filterRegex = createStringMatcher(filterValue, 'contains');\n\n const~~ emailsToRender = useMemo(() => {\n const ~~filteredItems~~ = (\n ~~filterValue\n ? emailParticipants~~.~~filter~~(~~({ emailAddress, fullName, shortName }~~) ~~=> {\~~n ~~return (~~\n ~~filterRegex.test(emailAddress)~~ ~~\|\|\n filterRegex.test(fullName)~~ ~~\|\|\n filterRegex.test(shortName)\n );\n })\n :~~ emailParticipants~~\n )~~.map(({ emailAddress, fullName }) => {\n return {\n id: emailAddress,\n primary: fullName,\n secondary: [emailAddress],\n selected: selectedItems.includes(emailAddress)\n };\n });\n\n const isValid = externalValidator?.(filterValue);\n\n return ((filterValue && externalValidator && isValid) \|\| (filterValue && !externalValidator)) &&\n !compose\n ? [\n {\n id: filterValue,\n primary: `${t('use')}: ${filterValue}`,\n selected: selectedItems.includes(filterValue)\n },\n ...~~filteredItems~~\n ]\n : ~~filteredItems~~;\n }, [~~emailParticipants~~, ~~selectedItems~~, ~~filterRegex~~]);\n\n const toggleSelectedItems = (id: string) => {\n let newSelectedItems = mode === 'single-select' ? [] : [...selectedItems];\n\n if (selectedItems.includes(id)) {\n // Unselect an already selected item\n newSelectedItems = newSelectedItems.filter(value => value !== id);\n } else {\n setFilterValue('');\n const filteredItem = menuHelpers.getItem<MenuItemProps>(emailsToRender, id);\n\n if (!filteredItem?.secondary) {\n // New value addition to the list\n if (!externalValidator) {\n ~~setEmailParticipants~~([\n ...~~emailParticipants~~,\n {\n shortName: '',\n fullName: '',\n emailAddress: filterValue\n }\n ]);\n newSelectedItems = [...newSelectedItems, id];\n } else {\n const isValid = externalValidator?.(filterValue);\n if (isValid) {\n ~~setEmailParticipants~~([\n ...~~emailParticipants~~,\n {\n shortName: '',\n fullName: '',\n emailAddress: filterValue\n }\n ]);\n newSelectedItems = [...newSelectedItems, id];\n }\n }\n } else {\n // Existing value to be selected\n newSelectedItems = [...newSelectedItems, id];\n }\n }\n\n onSelectedItemChange(newSelectedItems, label);\n };\n\n const getSelectedItems = () => {\n if (mode === 'single-select') {\n return { id: selectedItems[0], text: selectedItems[0] };\n }\n return selectedItems.map(value => ({ id: value, text: value }));\n };\n\n const ~~clearSelection = () => {\n onSelectedItemChange([], label);\n };\n\n const~~ comboBoxProps = {\n value: filterValue,\n onChange: (e: ChangeEvent<HTMLInputElement>) => {\n if (!e.target.value) ~~clearSelection~~();\n setFilterValue(e.target.value);\n },\n onBlur: () => {\n setFilterValue('');\n },\n menu: {\n items: emailsToRender,\n accent: ~~filterRegex~~,\n ~~onItemClick~~: ~~toggleSelectedItems~~\n },\n selected: {\n items: getSelectedItems(),\n onRemove: toggleSelectedItems\n },\n label,\n mode,\n required,\n status,\n info\n };\n\n return <ComboBox {...comboBoxProps} />;\n};\n\nexport default EmailSelector;\n"]}
1	+ {"version":3,"file":"EmailSelector.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSelector.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAgCzE,MAAM,aAAa,GAEf,CAAC,EACH,YAAY,EACZ,aAAa,EACb,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,oBAAoB,EACpB,iBAAiB,EACjB,MAAM,EACN,IAAI,EACJ,OAAO,EACP,cAAc,EACd,UAAU,EACV,OAAO,EACP,MAAM,EACP,EAAE,EAAE;IACH,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GAAG,QAAQ,CAEpE,EAAE,CAAC,CAAC;IACN,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,SAAS,CAAC,GAAG,EAAE;QACb,cAAc,CAAC,WAAW,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,MAAM,iBAAiB,GACrB,YAAY,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC;QAE/C,MAAM,KAAK,GAAG,iBAAiB,CAAC,GAAG,CAAC,CAAC,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,EAAE;YACjE,OAAO;gBACL,EAAE,EAAE,YAAY;gBAChB,OAAO,EAAE,QAAQ;gBACjB,SAAS,EAAE,CAAC,YAAY,CAAC;gBACzB,QAAQ,EAAE,aAAa,CAAC,QAAQ,CAAC,YAAY,CAAC;aAC/C,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,MAAM,OAAO,GAAG,iBAAiB,EAAE,CAAC,WAAW,CAAC,CAAC;QAEjD,OAAO,CAAC,CAAC,WAAW,IAAI,iBAAiB,IAAI,OAAO,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,iBAAiB,CAAC,CAAC;YAC3F,CAAC,OAAO;YACR,CAAC,CAAC;gBACE;oBACE,EAAE,EAAE,WAAW;oBACf,OAAO,EAAE,GAAG,CAAC,CAAC,KAAK,CAAC,KAAK,WAAW,EAAE;oBACtC,QAAQ,EAAE,aAAa,CAAC,QAAQ,CAAC,WAAW,CAAC;iBAC9C;gBACD,GAAG,KAAK;aACT;YACH,CAAC,CAAC,KAAK,CAAC;IACZ,CAAC,EAAE,CAAC,YAAY,EAAE,uBAAuB,EAAE,aAAa,CAAC,CAAC,CAAC;IAE3D,MAAM,mBAAmB,GAAG,CAAC,EAAU,EAAE,EAAE;QACzC,IAAI,gBAAgB,GAAG,IAAI,KAAK,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC;QAE1E,IAAI,aAAa,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE,CAAC;YAC/B,oCAAoC;YACpC,gBAAgB,GAAG,gBAAgB,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,KAAK,EAAE,CAAC,CAAC;QACpE,CAAC;aAAM,CAAC;YACN,cAAc,CAAC,EAAE,CAAC,CAAC;YACnB,MAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAgB,cAAc,EAAE,EAAE,CAAC,CAAC;YAE5E,IAAI,CAAC,YAAY,EAAE,SAAS,EAAE,CAAC;gBAC7B,iCAAiC;gBACjC,IAAI,CAAC,iBAAiB,EAAE,CAAC;oBACvB,0BAA0B,CAAC;wBACzB,GAAG,uBAAuB;wBAC1B;4BACE,SAAS,EAAE,EAAE;4BACb,QAAQ,EAAE,EAAE;4BACZ,YAAY,EAAE,WAAW;yBAC1B;qBACF,CAAC,CAAC;oBACH,gBAAgB,GAAG,CAAC,GAAG,gBAAgB,EAAE,EAAE,CAAC,CAAC;gBAC/C,CAAC;qBAAM,CAAC;oBACN,MAAM,OAAO,GAAG,iBAAiB,EAAE,CAAC,WAAW,CAAC,CAAC;oBACjD,IAAI,OAAO,EAAE,CAAC;wBACZ,0BAA0B,CAAC;4BACzB,GAAG,uBAAuB;4BAC1B;gCACE,SAAS,EAAE,EAAE;gCACb,QAAQ,EAAE,EAAE;gCACZ,YAAY,EAAE,WAAW;6BAC1B;yBACF,CAAC,CAAC;wBACH,gBAAgB,GAAG,CAAC,GAAG,gBAAgB,EAAE,EAAE,CAAC,CAAC;oBAC/C,CAAC;gBACH,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,gCAAgC;gBAChC,gBAAgB,GAAG,CAAC,GAAG,gBAAgB,EAAE,EAAE,CAAC,CAAC;YAC/C,CAAC;QACH,CAAC;QAED,oBAAoB,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;IAChD,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC5B,IAAI,IAAI,KAAK,eAAe,EAAE,CAAC;YAC7B,OAAO,EAAE,EAAE,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC;QAC1D,CAAC;QACD,OAAO,aAAa,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;IAClE,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG;QACpB,KAAK,EAAE,WAAW;QAClB,QAAQ,EAAE,CAAC,CAAgC,EAAE,EAAE;YAC7C,IAAI,IAAI,KAAK,eAAe,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;gBAChD,oBAAoB,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;YAClC,CAAC;YACD,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC;QACD,MAAM,EAAE,GAAG,EAAE;YACX,cAAc,CAAC,EAAE,CAAC,CAAC;QACrB,CAAC;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,cAAc;YACrB,MAAM;YACN,WAAW,EAAE,mBAAmB;YAChC,QAAQ,EAAE,GAAG,EAAE;gBACb,UAAU,EAAE,CAAC,WAAW,CAAC,CAAC;YAC5B,CAAC;YACD,OAAO;SACR;QACD,QAAQ,EAAE;YACR,KAAK,EAAE,gBAAgB,EAAE;YACzB,QAAQ,EAAE,mBAAmB;SAC9B;QACD,KAAK;QACL,IAAI;QACJ,QAAQ;QACR,MAAM;QACN,IAAI;KACL,CAAC;IAEF,OAAO,KAAC,QAAQ,OAAK,aAAa,GAAI,CAAC;AACzC,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useMemo, useState, useEffect } from 'react';\nimport type { FunctionComponent, ChangeEvent, ReactNode } from 'react';\n\nimport { ComboBox, menuHelpers, useI18n } from '@pega/cosmos-react-core';\nimport type {\n ComboBoxProps,\n NoChildrenProp,\n FormControlProps,\n MenuItemProps,\n MenuProps\n} from '@pega/cosmos-react-core';\n\nimport type { EmailComposerProps, EmailUser } from './Email.types';\n\nexport interface EmailSelectorProps extends NoChildrenProp, Pick<MenuProps, 'loading' \| 'accent'> {\n /** participants /\n participants: EmailComposerProps['participants'];\n /* default selections /\n selectedItems: EmailUser['emailAddress'][];\n /* selectedItems /\n onSelectedItemChange: (selectedItems: EmailUser['emailAddress'][], label: ReactNode) => void;\n /* Callback fired when the Combobox input value changes. /\n onFilterChange: (filterValue: string) => void;\n /* Callback to fetch more rows /\n onLoadMore?: (filterValue: string) => void;\n /\n Callback to handle external entry validation\n * If returned true considers the entry to be a valid entry\n */\n externalValidator?: EmailComposerProps['externalValidator'];\n status?: FormControlProps['status'];\n info?: FormControlProps['info'];\n compose?: boolean;\n}\n\nconst EmailSelector: FunctionComponent<\n EmailSelectorProps & Pick<ComboBoxProps, 'label' \| 'mode' \| 'required'>\n> = ({\n participants,\n selectedItems,\n label,\n mode,\n required,\n onSelectedItemChange,\n externalValidator,\n status,\n info,\n compose,\n onFilterChange,\n onLoadMore,\n loading,\n accent\n}) => {\n const [filterValue, setFilterValue] = useState('');\n const [customEmailParticipants, setCustomEmailParticipants] = useState<\n EmailSelectorProps['participants']\n >([]);\n const t = useI18n();\n\n useEffect(() => {\n onFilterChange(filterValue);\n }, [filterValue]);\n\n const emailsToRender = useMemo(() => {\n const emailParticipants: EmailSelectorProps['participants'] =\n participants.concat(customEmailParticipants);\n\n const items = emailParticipants.map(({ emailAddress, fullName }) => {\n return {\n id: emailAddress,\n primary: fullName,\n secondary: [emailAddress],\n selected: selectedItems.includes(emailAddress)\n };\n });\n\n const isValid = externalValidator?.(filterValue);\n\n return ((filterValue && externalValidator && isValid) \|\| (filterValue && !externalValidator)) &&\n !compose\n ? [\n {\n id: filterValue,\n primary: `${t('use')}: ${filterValue}`,\n selected: selectedItems.includes(filterValue)\n },\n ...items\n ]\n : items;\n }, [participants, customEmailParticipants, selectedItems]);\n\n const toggleSelectedItems = (id: string) => {\n let newSelectedItems = mode === 'single-select' ? [] : [...selectedItems];\n\n if (selectedItems.includes(id)) {\n // Unselect an already selected item\n newSelectedItems = newSelectedItems.filter(value => value !== id);\n } else {\n setFilterValue('');\n const filteredItem = menuHelpers.getItem<MenuItemProps>(emailsToRender, id);\n\n if (!filteredItem?.secondary) {\n // New value addition to the list\n if (!externalValidator) {\n setCustomEmailParticipants([\n ...customEmailParticipants,\n {\n shortName: '',\n fullName: '',\n emailAddress: filterValue\n }\n ]);\n newSelectedItems = [...newSelectedItems, id];\n } else {\n const isValid = externalValidator?.(filterValue);\n if (isValid) {\n setCustomEmailParticipants([\n ...customEmailParticipants,\n {\n shortName: '',\n fullName: '',\n emailAddress: filterValue\n }\n ]);\n newSelectedItems = [...newSelectedItems, id];\n }\n }\n } else {\n // Existing value to be selected\n newSelectedItems = [...newSelectedItems, id];\n }\n }\n\n onSelectedItemChange(newSelectedItems, label);\n };\n\n const getSelectedItems = () => {\n if (mode === 'single-select') {\n return { id: selectedItems[0], text: selectedItems[0] };\n }\n return selectedItems.map(value => ({ id: value, text: value }));\n };\n\n const comboBoxProps = {\n value: filterValue,\n onChange: (e: ChangeEvent<HTMLInputElement>) => {\n if (mode === 'single-select' && !e.target.value) {\n onSelectedItemChange([], label);\n }\n setFilterValue(e.target.value);\n },\n onBlur: () => {\n setFilterValue('');\n },\n menu: {\n items: emailsToRender,\n accent,\n onItemClick: toggleSelectedItems,\n loadMore: () => {\n onLoadMore?.(filterValue);\n },\n loading\n },\n selected: {\n items: getSelectedItems(),\n onRemove: toggleSelectedItems\n },\n label,\n mode,\n required,\n status,\n info\n };\n\n return <ComboBox {...comboBoxProps} />;\n};\n\nexport default EmailSelector;\n"]}

package/lib/components/Email/EmailShell.d.ts CHANGED Viewed

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailShell.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailShell.tsx"],"names":[],"mappings":"~~AACA~~,OAAO,KAAK,EAAE,~~iBAAiB,EAAmB,MAAM,OAAO,CAAC;AAGhE,OAAO,KAAK,~~EAAE,~~YAAY,EAAE,~~MAAM,yBAAyB,CAAC;~~AAG5D~~,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAcrD,QAAA,MAAM,UAAU,EAAE,~~iBAAiB,~~CAAC,eAAe,~~GAAG~~,~~YAAY,CAwFjE,~~CAAC;~~AAEF~~,eAAe,UAAU,CAAC"}
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"}

package/lib/components/Email/EmailShell.js CHANGED Viewed

@@ -40,7 +40,7 @@ const EmailShell = forwardRef(function EmailShell(props, ref) {
                     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, { "aria-multiselectable": !autoCollapse, children: renderConversations() })] }));
+                }, 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() })] }));
 });
 export default EmailShell;
 //# sourceMappingURL=EmailShell.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailShell.js","sourceRoot":"","sources":["../../../src/components/Email/EmailShell.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG7C,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAElF,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AAGxF,OAAO,iBAAiB,EAAE,EACxB,uBAAuB,EACvB,yBAAyB,EACzB,iBAAiB,EAClB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,2BAA2B,EAC3B,gBAAgB,EAChB,sBAAsB,EACvB,MAAM,gBAAgB,CAAC;AAExB,YAAY,CAAC,QAAQ,CAAC,CAAC;AAEvB,MAAM,UAAU,~~GAAsD~~,UAAU,~~CAC9E~~,SAAS,UAAU,~~CAAC~~,KAAuC,~~EAAE~~,GAA2B;~~IACtF~~,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,YAAY,GAAG,KAAK,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IAEjF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElD,MAAM,kBAAkB,GAAG,aAAa,EAAE,MAAM,KAAK,CAAC,CAAC;IAEvD,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,IAAI,CAAC,aAAa;YAAE,OAAO;QAE3B,IAAI,kBAAkB,EAAE,CAAC;YACvB,MAAM,YAAY,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC;YACtC,OAAO,CACL,MAAC,uBAAuB,~~IACtB~~,kBAAkB,EAAE,kBAAkB,~~EACtC~~,UAAU,EAAE,CAAC,CAAC,WAAW,~~aAExB~~,CAAC,CAAC,YAAY,CAAC,gBAAgB,IAAI,CAClC,KAAC,IAAI,IAAC,EAAE,EAAE,iBAAiB,EAAE,OAAO,EAAC,WAAW,YAC7C,CAAC,CAAC,kBAAkB,EAAE,CAAC,YAAY,CAAC,gBAAgB,CAAC,EAAE;4BACtD,KAAK,EAAE,YAAY,CAAC,gBAAgB;yBACrC,CAAC,GACG,CACR,EACA,YAAY,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,CAAC,EAAE;wBAChC,OAAO,KAAC,yBAAyB,OAAoB,KAAK,IAAnB,KAAK,CAAC,EAAE,CAAe,CAAC;oBACjE,CAAC,CAAC,IACsB,CAC3B,CAAC;QACJ,CAAC;QAED,yBAAyB;QACzB,OAAO,YAAY;YACjB,CAAC,CAAC,aAAa,EAAE,GAAG,CAAC,CAAC,YAAY,EAAE,KAAK,EAAE,EAAE;gBACzC,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,IAAI,EAAE,GAAG,YAAY,CAAC;gBACxD,MAAM,SAAS,GAAG,KAAK,KAAK,WAAW,CAAC;gBACxC,OAAO,CACL,KAAC,iBAAiB,IAEhB,QAAQ,EAAE,GAAG,EAAE;wBACb,cAAc,CAAC,KAAK,CAAC,CAAC;wBACtB,IAAI,QAAQ;4BAAE,QAAQ,EAAE,CAAC;oBAC3B,CAAC,EACD,WAAW,EAAE,SAAS,KAClB,IAAI,IANH,YAAY,CAAC,EAAE,CAOpB,CACH,CAAC;YACJ,CAAC,CAAC;YACJ,CAAC,CAAC,aAAa,EAAE,GAAG,CAAC,YAAY,CAAC,EAAE;gBAChC,OAAO,KAAC,iBAAiB,OAA2B,YAAY,IAAjC,YAAY,CAAC,EAAE,CAAsB,CAAC;YACvE,CAAC,CAAC,CAAC;IACT,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,OACC,SAAS,EACb,EAAE,EAAE,gBAAgB,EACpB,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,kBAAkB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,EAC3E,GAAG,EAAE,GAAG,EACR,kBAAkB,EAAE,kBAAkB,aAErC,WAAW,IAAI,CACd,MAAC,IAAI,IACH,SAAS,EAAE;oBACT,UAAU,EAAE,QAAQ;oBACpB,OAAO,EAAE,SAAS;oBAClB,GAAG,EAAE,CAAC;iBACP,EACD,EAAE,EAAE,sBAAsB,aAE1B,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,EACpB,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YACf,WAAW,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,KAAK,WAAW,EAAE,OAAO,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,GAC3E,IACF,EACN,WAAW,EAAE,OAAO,IAChB,CACR,EACD,KAAC,2BAA2B,~~4BAAuB~~,~~CAAC,YAAY,YAC7D,~~mBAAmB,EAAE,~~GACM~~,~~IACzB~~,CACR,CAAC;AACJ,CAAC,~~CACF~~,CAAC;~~AAEF~~,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type { ~~FunctionComponent,~~ PropsWithoutRef } from 'react';\n\nimport { Flex, Icon, registerIcon, Text, useI18n } from '@pega/cosmos-react-core';\nimport type { ~~ForwardProps~~ } 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: ~~FunctionComponent~~<EmailShellProps ~~& ForwardProps~~> = forwardRef(\n function EmailShell(props: PropsWithoutRef<EmailShellProps>, ref: EmailShellProps['ref']) {\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\n singleConversation={singleConversation}\n showHeader={!!headerProps}\n ~~>\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 ~~aria-multiselectable=~~{~~!autoCollapse}>\n {~~renderConversations()}\n </StyledEmailConversationList>\n </Flex>\n );\n }\n);\n\nexport default EmailShell;\n"]}
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"]}

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

@@ -1,11 +1,7 @@
-import type { FunctionComponent } from 'react';
-import type { ForwardProps } from '@pega/cosmos-react-core';
+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>;
-interface StyledEmailSummaryItemProps extends EmailSummaryItemProps {
-    isEmailItemActive: boolean;
-}
-export declare const StyledEmailSummaryItem: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, StyledEmailSummaryItemProps & ForwardProps, never>;
-declare const EmailSummaryItem: FunctionComponent<EmailSummaryItemProps & ForwardProps>;
+export declare const StyledEmailSummaryItem: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {}, never>;
+declare const EmailSummaryItem: ForwardRefForwardPropsComponent<EmailSummaryItemProps>;
 export default EmailSummaryItem;
 //# sourceMappingURL=EmailSummaryItem.d.ts.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailSummaryItem.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"~~AACA~~,OAAO,KAAK,EAAE,~~iBAAiB,EAAa,MAAM,OAAO,CAAC;AAmB1D,OAAO,KAAK,~~EAAE,~~YAAY,EAAE,~~MAAM,yBAAyB,CAAC;~~AAG5D~~,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAkB3D,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;~~AAqBF~~,~~UAAU,2BAA4B,SAAQ,qBAAqB;IACjE,iBAAiB,EAAE,OAAO,CAAC;CAC5B;AAID,~~eAAO,MAAM,sBAAsB,~~gJAiClC~~,CAAC;~~AAMF~~,QAAA,MAAM,gBAAgB,EAAE,~~iBAAiB,~~CAAC,qBAAqB,~~GAAG~~,~~YAAY,CAqH7E,~~CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1	+ {"version":3,"file":"EmailSummaryItem.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryItem.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,yBAAyB,CAAC;AAG/E,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAkB3D,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAwBF,eAAO,MAAM,sBAAsB,wGA+BjC,CAAC;AAMH,QAAA,MAAM,gBAAgB,EAAE,+BAA+B,CAAC,qBAAqB,CAqH5E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/components/Email/EmailSummaryItem.js CHANGED Viewed

@@ -45,32 +45,32 @@ const StyledStatuses = styled.div ``;
 export const StyledEmailSummaryItem = styled.li(({ theme }) => {
     const hoverColor = tryCatch(() => mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive));
     return css `
-      width: 100%;
-      color: ${theme.base.palette['foreground-color']};
-      background-color: ${theme.base.palette['primary-background']};
-      padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});
-      outline: none;
-      cursor: pointer;
-      ${StyledMetaList}, ${StyledMessageAndDate}, ${StyledStatuses} {
-        margin-block-start: ${theme.base.spacing};
-      }
-      & + & {
-        margin-inline-start: 0;
-      }
+    width: 100%;
+    color: ${theme.base.palette['foreground-color']};
+    background-color: ${theme.base.palette['primary-background']};
+    padding: ${theme.base.spacing} calc(2 * ${theme.base.spacing});
+    outline: none;
+    cursor: pointer;
+    ${StyledMetaList}, ${StyledMessageAndDate}, ${StyledStatuses} {
+      margin-block-start: ${theme.base.spacing};
+    }
+    & + & {
+      margin-inline-start: 0;
+    }
-      &[aria-selected='true'],
-      &[data-current='true'] {
-        background-color: ${theme.base.palette['secondary-background']};
-      }
+    &[aria-selected='true'],
+    &[data-current='true'] {
+      background-color: ${theme.base.palette['secondary-background']};
+    }
-      &:hover,
-      &:focus-within {
-        background-color: ${hoverColor};
-      }
-      &:not(:last-child) {
-        border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};
-      }
-    `;
+    &:hover,
+    &:focus-within {
+      background-color: ${hoverColor};
+    }
+    &:not(:last-child) {
+      border-block-end: 0.0625rem solid ${theme.base.palette['border-line']};
+    }
+  `;
 });
 StyledEmailSummaryItem.defaultProps = defaultThemeProp;
 StyledParticipants.defaultProps = defaultThemeProp;
@@ -101,7 +101,7 @@ const EmailSummaryItem = forwardRef(function EmailSummaryItem({ id, activePartic
         return participants;
     }, [activeParticipants]);
     const itemStatus = `${unreadEmailCount ? `${t('unread')}, ` : ''}${undelivered ? `${t('undelivered')}, ` : ''}${drafts ? `${t('drafts')}, ` : ''}`;
-    return (_jsxs(StyledEmailSummaryItem, { ref: ref, ...restProps, id: id, onClick: () => onSelect(id), onKeyDown: (e) => {
+    return (_jsxs(StyledEmailSummaryItem, { ref: ref, ...restProps, id: id, onClick: () => onSelect(id), onKeyDown: e => {
             if (e.key === 'Enter') {
                 onSelect(id);
             }
@@ -109,7 +109,7 @@ const EmailSummaryItem = forwardRef(function EmailSummaryItem({ id, activePartic
                             ? replaceMatchWithElement(emailParticipants, createStringMatcher(searchQuery, 'contains', 'ig'), match => _jsx(Mark, { children: match }))
                             : 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', format: 'short' })] }), _jsx(MetaList, { items: items }), (undelivered || drafts) && (_jsxs(Flex, { container: {
+                }, 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',
                     gap: 1
                 }, as: StyledStatuses, children: [undelivered && _jsx(Status, { variant: 'urgent', children: t('undelivered') }), drafts && _jsx(Status, { variant: 'pending', children: t('draft', [], { count: Infinity }) })] }))] }));

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

	@@ -1 +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 { FunctionComponent, 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} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\nimport { StyledMetaList } from '@pega/cosmos-react-core/lib/components/MetaList/MetaList';\n\nimport type { EmailSummaryItemProps } from './Email.types';\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});\ninterface StyledEmailSummaryItemProps extends EmailSummaryItemProps {\n isEmailItemActive: boolean;\n}\n\nconst StyledStatuses = styled.div``;\n\nexport const StyledEmailSummaryItem = styled.li<StyledEmailSummaryItemProps & ForwardProps>(\n ({ 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);\n\nStyledEmailSummaryItem.defaultProps = defaultThemeProp;\nStyledParticipants.defaultProps = defaultThemeProp;\nStyledMessage.defaultProps = defaultThemeProp;\n\nconst EmailSummaryItem: FunctionComponent<EmailSummaryItemProps & ForwardProps> = 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 ...restProps\n },\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\n return itemList;\n }, [sentiment, topic, urgency]);\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 return (\n <StyledEmailSummaryItem\n ref={ref}\n {...restProps}\n id={id}\n onClick={() => onSelect(id)}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n onSelect(id);\n }\n }}\n aria-selected={active}\n aria-label={`${itemStatus}${emailParticipants}, ${message} ${timeStamp} ${topic} ${\n sentiment?.variant\n } ${t('priority')} ${urgency}`}\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' format='short' />\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"]}
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} from '@pega/cosmos-react-core';\nimport type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';\nimport { StyledMetaList } from '@pega/cosmos-react-core/lib/components/MetaList/MetaList';\n\nimport type { EmailSummaryItemProps } from './Email.types';\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 ...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\n return itemList;\n }, [sentiment, topic, urgency]);\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 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={`${itemStatus}${emailParticipants}, ${message} ${timeStamp} ${topic} ${\n sentiment?.variant\n } ${t('priority')} ${urgency}`}\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"]}

package/lib/components/Email/EmailSummaryList.d.ts CHANGED Viewed

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

package/lib/components/Email/EmailSummaryList.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailSummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"~~AACA~~,OAAO,KAAK,EAAE,~~iBAAiB,~~EAAE,MAAM,~~OAAO~~,CAAC;~~AAuB~~/C,OAAO,KAAK,~~EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAG5D,OAAO,KAAK,~~EAAyB,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAuDlF,QAAA,MAAM,gBAAgB,EAAE,~~iBAAiB,~~CAAC,qBAAqB,~~GAAG~~,~~YAAY,CAuJ7E,~~CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1	+ {"version":3,"file":"EmailSummaryList.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,yBAAyB,CAAC;AAG/E,OAAO,KAAK,EAAyB,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAuDlF,QAAA,MAAM,gBAAgB,EAAE,+BAA+B,CAAC,qBAAqB,CAiK5E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/components/Email/EmailSummaryList.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { createRef, useMemo, useState, useEffect, forwardRef, useCallback } from 'react';
 import styled, { css } from 'styled-components';
-import { Button, defaultThemeProp, Flex, Icon, registerIcon, MenuButton, useConsolidatedRef, useI18n, menuHelpers, Progress, useItemIntersection, usePrevious, VisuallyHiddenText, EmptyState, calculateFontSize, StyledText, useArrows, debounce } from '@pega/cosmos-react-core';
+import { Button, defaultThemeProp, Flex, Icon, registerIcon, MenuButton, useConsolidatedRef, useI18n, menuHelpers, Progress, useItemIntersection, usePrevious, EmptyState, calculateFontSize, StyledText, useArrows, debounce, useLiveLog } from '@pega/cosmos-react-core';
 import * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';
 import EmailSummaryItem from './EmailSummaryItem';
 import { StyledEmailSummaryList, StyledLoadMore } from './Email.styles';
@@ -48,6 +48,7 @@ const EmailSummaryList = forwardRef(function EmailSummaryList({ loading = false,
     const tablistRef = useConsolidatedRef(ref);
     const tabRefs = items.map(() => createRef());
     const prevEmail = usePrevious(items);
+    const { announcePolite } = useLiveLog();
     const countMessage = useMemo(() => {
         if (count) {
             const { total, unread } = count;
@@ -61,7 +62,7 @@ const EmailSummaryList = forwardRef(function EmailSummaryList({ loading = false,
         cycle: true,
         selector: ':scope > li',
         dir: 'up-down',
-        updateTabIndex: false
+        updateTabIndex: !currentItemId
     }, [items]);
     const buttonText = useMemo(() => {
         if (categories)
@@ -90,16 +91,23 @@ const EmailSummaryList = forwardRef(function EmailSummaryList({ loading = false,
             tabRefs[items.findIndex(item => item.id === currentItemId)]?.current?.focus();
         }
     }, [currentItemId]);
+    useEffect(() => {
+        if (announcement) {
+            announcePolite({
+                message: announcement
+            });
+        }
+    }, [announcement]);
     return (_jsxs(StyledEmailSummaryListContainer, { container: { direction: 'column' }, ...restProps, children: [!!(categories?.length || searchQuery) && (_jsx(StyledEmailSummaryListHeader, { children: _jsxs(StyledActionWrapper, { container: { justify: 'space-between', alignItems: 'center', gap: 0.5 }, children: [_jsx(Flex, { item: { shrink: 1 }, children: searchQuery ? (_jsx(StyledText, { variant: 'h3', children: t('search_results') })) : (_jsx(StyledWorklist, { text: buttonText, variant: 'text', popover: { portal: true }, menu: {
                                     mode: 'single-select',
                                     items: categories,
                                     onItemClick: onCategoryClick
-                                } })) }), countMessage && _jsx(StyledText, { variant: 'secondary', children: countMessage }), filters && (_jsx(StyledFilterButton, { variant: 'simple', label: t('email_filters'), icon: true, children: _jsx(Icon, { name: 'filter' }) }))] }) })), items.length > 0 ? (_jsxs(Flex, { role: selectable ? 'tablist' : undefined, container: { direction: 'column' }, as: StyledEmailSummaryList, ref: tablistRef, children: [_jsx(VisuallyHiddenText, { "aria-live": 'polite', children: announcement }), items.map((emailItem, i) => {
-                        const { id, ...emailItemProps } = emailItem;
-                        return (_jsx(EmailSummaryItem, { searchQuery: searchQuery, ref: tabRefs[i], id: id, ...emailItemProps, onSelect: (selectedItemId) => {
-                                onItemClick(selectedItemId);
-                            }, role: selectable ? 'tab' : undefined, active: selectable ? currentItemId === id : undefined }, id));
-                    }), loading && (_jsx(Flex, { container: { justify: 'center' }, as: StyledLoadMore, children: _jsx(Progress, { placement: 'inline' }) }))] })) : (_jsx(EmptyState, { message: emptyMessage }))] }));
+                                } })) }), countMessage && _jsx(StyledText, { variant: 'secondary', children: countMessage }), filters && (_jsx(StyledFilterButton, { variant: 'simple', label: t('email_filters'), icon: true, children: _jsx(Icon, { name: 'filter' }) }))] }) })), items.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(Flex, { role: selectable ? 'tablist' : undefined, container: { direction: 'column' }, as: StyledEmailSummaryList, ref: tablistRef, children: items.map((emailItem, i) => {
+                            const { id, ...emailItemProps } = emailItem;
+                            return (_jsx(EmailSummaryItem, { searchQuery: searchQuery, ref: tabRefs[i], id: id, ...emailItemProps, onSelect: (selectedItemId) => {
+                                    onItemClick(selectedItemId);
+                                }, role: selectable ? 'tab' : undefined, active: selectable ? currentItemId === id : undefined }, id));
+                        }) }), loading && (_jsx(Flex, { container: { justify: 'center' }, as: StyledLoadMore, children: _jsx(Progress, { placement: 'inline', message: t('loading_email') }) }))] })) : (_jsx(EmptyState, { message: emptyMessage }))] }));
 });
 export default EmailSummaryList;
 //# sourceMappingURL=EmailSummaryList.js.map

package/lib/components/Email/EmailSummaryList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailSummaryList.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createRef, useMemo, useState, useEffect, forwardRef, useCallback } from 'react';\nimport type { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n defaultThemeProp,\n Flex,\n Icon,\n registerIcon,\n MenuButton,\n useConsolidatedRef,\n useI18n,\n menuHelpers,\n Progress,\n useItemIntersection,\n usePrevious,\n VisuallyHiddenText,\n EmptyState,\n calculateFontSize,\n StyledText,\n useArrows,\n debounce\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\nimport * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';\n\nimport type { EmailSummaryItemProps, EmailSummaryListProps } from './Email.types';\nimport EmailSummaryItem from './EmailSummaryItem';\nimport { StyledEmailSummaryList, StyledLoadMore } from './Email.styles';\n\nregisterIcon(filterIcon);\n\nconst StyledEmailSummaryListContainer = styled(Flex)(({ theme }) => {\n return css`\n height: 100%;\n background-color: ${theme.base.palette['primary-background']};\n `;\n});\nStyledEmailSummaryListContainer.defaultProps = defaultThemeProp;\n\nconst StyledEmailSummaryListHeader = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n padding: ${spacing} calc(2 * ${spacing});\n `;\n }\n);\nStyledEmailSummaryListHeader.defaultProps = defaultThemeProp;\n\nconst StyledActionWrapper = styled(Flex)(({ theme }) => {\n return css`\n padding-block-start: ${theme.base.spacing};\n\n & > ${StyledText} {\n white-space: nowrap;\n }\n `;\n});\nStyledActionWrapper.defaultProps = defaultThemeProp;\n\nconst StyledFilterButton = styled(Button)`\n margin-inline-start: auto;\n`;\n\nconst StyledWorklist = styled(MenuButton)(({ theme }) => {\n const { 'font-size': fontSize, 'font-scale': fontScale } = theme.base;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n return css`\n ${StyledText} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n font-size: ${fontSizes.m};\n }\n `;\n});\n\nStyledWorklist.defaultProps = defaultThemeProp;\n\nconst EmailSummaryList: FunctionComponent<EmailSummaryListProps & ForwardProps> = forwardRef(\n function EmailSummaryList(\n {\n loading = false,\n onLoadMore,\n categories,\n onCategoryClick,\n items,\n count,\n filters,\n onFilterChange,\n onItemClick,\n emptyMessage,\n currentItemId,\n selectable = true,\n searchQuery,\n ...restProps\n },\n ref: EmailSummaryListProps['ref']\n ) {\n const t = useI18n();\n const tablistRef = useConsolidatedRef(ref);\n const tabRefs = items.map(() => createRef<HTMLLIElement>());\n const prevEmail = usePrevious(items);\n\n const countMessage = useMemo(() => {\n if (count) {\n const { total, unread } = count;\n return unread\n ? `${t('unread_email_count', [unread, total])}`\n : `${t('results_count', [total], { count: total })}`;\n }\n }, [count]);\n const [announcement, setAnnouncement] = useState('');\n useArrows(\n tablistRef,\n {\n cycle: true,\n selector: ':scope > li',\n dir: 'up-down',\n updateTabIndex: false\n },\n [items]\n );\n\n const buttonText = useMemo(() => {\n if (categories)\n return (\n menuHelpers.getSelected(categories)[0]?.primary ??\n menuHelpers.flatten(categories)[0].primary\n );\n }, [categories]);\n\n const handleLoadMore = useCallback(\n debounce(() => {\n if (!loading) {\n onLoadMore?.();\n }\n }, 200),\n [loading]\n );\n\n useItemIntersection(tablistRef, items.length - 1, handleLoadMore, ':scope > li');\n\n useEffect(() => {\n if (loading) setAnnouncement(t('loading_email'));\n }, [loading]);\n\n useEffect(() => {\n if (prevEmail) {\n const difference = items.length - prevEmail.length;\n if (difference) setAnnouncement(t('new_emails_count', [difference], { count: difference }));\n }\n }, [items]);\n\n useEffect(() => {\n if (tabRefs.length > 0 && currentItemId) {\n tabRefs[items.findIndex(item => item.id === currentItemId)]?.current?.focus();\n }\n }, [currentItemId]);\n\n return (\n <StyledEmailSummaryListContainer container={{ direction: 'column' }} {...restProps}>\n {!!(categories?.length \|\| searchQuery) && (\n <StyledEmailSummaryListHeader>\n <StyledActionWrapper\n container={{ justify: 'space-between', alignItems: 'center', gap: 0.5 }}\n >\n <Flex item={{ shrink: 1 }}>\n {searchQuery ? (\n <StyledText variant='h3'>{t('search_results')}</StyledText>\n ) : (\n <StyledWorklist\n text={buttonText}\n variant='text'\n popover={{ portal: true }}\n menu={{\n mode: 'single-select',\n items: categories,\n onItemClick: onCategoryClick\n }}\n />\n )}\n </Flex>\n {countMessage && <StyledText variant='secondary'>{countMessage}</StyledText>}\n {filters && (\n <StyledFilterButton variant='simple' label={t('email_filters')} icon>\n <Icon name='filter' />\n </StyledFilterButton>\n )}\n </StyledActionWrapper>\n </StyledEmailSummaryListHeader>\n )}\n\n {items.length > 0 ? (\n <Flex\n role={selectable ? 'tablist' : undefined}\n container={{ direction: 'column' }}\n as={StyledEmailSummaryList}\n ref={tablistRef}\n >\n <VisuallyHiddenText aria-live='polite'>{announcement}</VisuallyHiddenText>\n {items.map((emailItem, i) => {\n const { id, ...emailItemProps } = emailItem;\n return (\n <EmailSummaryItem\n searchQuery={searchQuery}\n ref={tabRefs[i]}\n id={id}\n key={id}\n {...emailItemProps}\n onSelect={(selectedItemId: EmailSummaryItemProps['id']) => {\n onItemClick(selectedItemId);\n }}\n role={selectable ? 'tab' : undefined}\n active={selectable ? currentItemId === id : undefined}\n />\n );\n })}\n {loading && (\n <Flex container={{ justify: 'center' }} as={StyledLoadMore}>\n <Progress placement='inline' />\n </Flex>\n )}\n </Flex>\n ) : (\n <EmptyState message={emptyMessage} />\n )}\n </StyledEmailSummaryListContainer>\n );\n }\n);\n\nexport default EmailSummaryList;\n"]}
1	+ {"version":3,"file":"EmailSummaryList.js","sourceRoot":"","sources":["../../../src/components/Email/EmailSummaryList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createRef, useMemo, useState, useEffect, forwardRef, useCallback } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n defaultThemeProp,\n Flex,\n Icon,\n registerIcon,\n MenuButton,\n useConsolidatedRef,\n useI18n,\n menuHelpers,\n Progress,\n useItemIntersection,\n usePrevious,\n EmptyState,\n calculateFontSize,\n StyledText,\n useArrows,\n debounce,\n useLiveLog\n} from '@pega/cosmos-react-core';\nimport type { ForwardRefForwardPropsComponent } from '@pega/cosmos-react-core';\nimport * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';\n\nimport type { EmailSummaryItemProps, EmailSummaryListProps } from './Email.types';\nimport EmailSummaryItem from './EmailSummaryItem';\nimport { StyledEmailSummaryList, StyledLoadMore } from './Email.styles';\n\nregisterIcon(filterIcon);\n\nconst StyledEmailSummaryListContainer = styled(Flex)(({ theme }) => {\n return css`\n height: 100%;\n background-color: ${theme.base.palette['primary-background']};\n `;\n});\nStyledEmailSummaryListContainer.defaultProps = defaultThemeProp;\n\nconst StyledEmailSummaryListHeader = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n padding: ${spacing} calc(2 * ${spacing});\n `;\n }\n);\nStyledEmailSummaryListHeader.defaultProps = defaultThemeProp;\n\nconst StyledActionWrapper = styled(Flex)(({ theme }) => {\n return css`\n padding-block-start: ${theme.base.spacing};\n\n & > ${StyledText} {\n white-space: nowrap;\n }\n `;\n});\nStyledActionWrapper.defaultProps = defaultThemeProp;\n\nconst StyledFilterButton = styled(Button)`\n margin-inline-start: auto;\n`;\n\nconst StyledWorklist = styled(MenuButton)(({ theme }) => {\n const { 'font-size': fontSize, 'font-scale': fontScale } = theme.base;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n return css`\n ${StyledText} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n font-size: ${fontSizes.m};\n }\n `;\n});\n\nStyledWorklist.defaultProps = defaultThemeProp;\n\nconst EmailSummaryList: ForwardRefForwardPropsComponent<EmailSummaryListProps> = forwardRef(\n function EmailSummaryList(\n {\n loading = false,\n onLoadMore,\n categories,\n onCategoryClick,\n items,\n count,\n filters,\n onFilterChange,\n onItemClick,\n emptyMessage,\n currentItemId,\n selectable = true,\n searchQuery,\n ...restProps\n }: PropsWithoutRef<EmailSummaryListProps>,\n ref: EmailSummaryListProps['ref']\n ) {\n const t = useI18n();\n const tablistRef = useConsolidatedRef(ref);\n const tabRefs = items.map(() => createRef<HTMLLIElement>());\n const prevEmail = usePrevious(items);\n const { announcePolite } = useLiveLog();\n\n const countMessage = useMemo(() => {\n if (count) {\n const { total, unread } = count;\n return unread\n ? `${t('unread_email_count', [unread, total])}`\n : `${t('results_count', [total], { count: total })}`;\n }\n }, [count]);\n const [announcement, setAnnouncement] = useState('');\n useArrows(\n tablistRef,\n {\n cycle: true,\n selector: ':scope > li',\n dir: 'up-down',\n updateTabIndex: !currentItemId\n },\n [items]\n );\n\n const buttonText = useMemo(() => {\n if (categories)\n return (\n menuHelpers.getSelected(categories)[0]?.primary ??\n menuHelpers.flatten(categories)[0].primary\n );\n }, [categories]);\n\n const handleLoadMore = useCallback(\n debounce(() => {\n if (!loading) {\n onLoadMore?.();\n }\n }, 200),\n [loading]\n );\n\n useItemIntersection(tablistRef, items.length - 1, handleLoadMore, ':scope > li');\n\n useEffect(() => {\n if (loading) setAnnouncement(t('loading_email'));\n }, [loading]);\n\n useEffect(() => {\n if (prevEmail) {\n const difference = items.length - prevEmail.length;\n if (difference) setAnnouncement(t('new_emails_count', [difference], { count: difference }));\n }\n }, [items]);\n\n useEffect(() => {\n if (tabRefs.length > 0 && currentItemId) {\n tabRefs[items.findIndex(item => item.id === currentItemId)]?.current?.focus();\n }\n }, [currentItemId]);\n\n useEffect(() => {\n if (announcement) {\n announcePolite({\n message: announcement\n });\n }\n }, [announcement]);\n\n return (\n <StyledEmailSummaryListContainer container={{ direction: 'column' }} {...restProps}>\n {!!(categories?.length \|\| searchQuery) && (\n <StyledEmailSummaryListHeader>\n <StyledActionWrapper\n container={{ justify: 'space-between', alignItems: 'center', gap: 0.5 }}\n >\n <Flex item={{ shrink: 1 }}>\n {searchQuery ? (\n <StyledText variant='h3'>{t('search_results')}</StyledText>\n ) : (\n <StyledWorklist\n text={buttonText}\n variant='text'\n popover={{ portal: true }}\n menu={{\n mode: 'single-select',\n items: categories,\n onItemClick: onCategoryClick\n }}\n />\n )}\n </Flex>\n {countMessage && <StyledText variant='secondary'>{countMessage}</StyledText>}\n {filters && (\n <StyledFilterButton variant='simple' label={t('email_filters')} icon>\n <Icon name='filter' />\n </StyledFilterButton>\n )}\n </StyledActionWrapper>\n </StyledEmailSummaryListHeader>\n )}\n\n {items.length > 0 ? (\n <>\n <Flex\n role={selectable ? 'tablist' : undefined}\n container={{ direction: 'column' }}\n as={StyledEmailSummaryList}\n ref={tablistRef}\n >\n {items.map((emailItem, i) => {\n const { id, ...emailItemProps } = emailItem;\n return (\n <EmailSummaryItem\n searchQuery={searchQuery}\n ref={tabRefs[i]}\n id={id}\n key={id}\n {...emailItemProps}\n onSelect={(selectedItemId: EmailSummaryItemProps['id']) => {\n onItemClick(selectedItemId);\n }}\n role={selectable ? 'tab' : undefined}\n active={selectable ? currentItemId === id : undefined}\n />\n );\n })}\n </Flex>\n {loading && (\n <Flex container={{ justify: 'center' }} as={StyledLoadMore}>\n <Progress placement='inline' message={t('loading_email')} />\n </Flex>\n )}\n </>\n ) : (\n <EmptyState message={emptyMessage} />\n )}\n </StyledEmailSummaryListContainer>\n );\n }\n);\n\nexport default EmailSummaryList;\n"]}

package/lib/components/Email/EntityList.d.ts CHANGED Viewed

@@ -1,6 +1,4 @@
-import type { FunctionComponent } from 'react';
-import type { ForwardProps } from '@pega/cosmos-react-core';
 import type { EntityListProps } from './Email.types';
-declare const EntityList: FunctionComponent<EntityListProps & ForwardProps>;
+declare const EntityList: import("react").ForwardRefExoticComponent<Omit<EntityListProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 export default EntityList;
 //# sourceMappingURL=EntityList.d.ts.map

package/lib/components/Email/EntityList.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EntityList.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EntityList.tsx"],"names":[],"mappings":"~~AACA~~,OAAO,KAAK,~~EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAe5E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAK5D,OAAO,KAAK,~~EAAoB,eAAe,EAAe,MAAM,eAAe,CAAC;AAEpF,QAAA,MAAM,UAAU,~~EAAE~~,~~iBAAiB,~~CAAC~~,eAAe,GAAG,YAAY,CAyGjE,CAAC~~;~~AAEF~~,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"EntityList.d.ts","sourceRoot":"","sources":["../../../src/components/Email/EntityList.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAoB,eAAe,EAAe,MAAM,eAAe,CAAC;AAEpF,QAAA,MAAM,UAAU,yHAuGd,CAAC;AAEH,eAAe,UAAU,CAAC"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EntityList.js","sourceRoot":"","sources":["../../../src/components/Email/EntityList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAG7E,OAAO,EACL,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,UAAU,EACV,WAAW,EACX,eAAe,EACf,UAAU,EACV,aAAa,EACb,UAAU,EACV,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;~~AAGjC~~,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,WAAW,MAAM,eAAe,CAAC;AAGxC,MAAM,UAAU,~~GAAsD~~,UAAU,~~CAC9E~~,SAAS,UAAU,~~CACjB~~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~~CACF~~,CAAC;~~AAEF~~,eAAe,UAAU,CAAC","sourcesContent":["import { forwardRef, useState, useEffect, useImperativeHandle } from 'react';\nimport type { ~~FunctionComponent,~~ 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';\~~nimport type { ForwardProps } 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: ~~FunctionComponent<EntityListProps & ForwardProps>~~ = forwardRef(\n 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);\n\nexport default EntityList;\n"]}
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"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EntityHighlighter.d.ts","sourceRoot":"","sources":["../../../../src/components/Email/utils/EntityHighlighter.ts"],"names":[],"mappings":"~~AAGA~~,OAAO,KAAK,EAAE,UAAU,EAA2B,MAAM,gBAAgB,CAAC;~~AAkS1E~~;;;;;GAKG;AACH,QAAA,MAAM,iBAAiB,SACf,MAAM,iBACG,UAAU,CAAC,wBAAwB,CAAC,KAClD,MAMF,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
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,SACf,MAAM,iBACG,UAAU,CAAC,wBAAwB,CAAC,KAClD,MAMF,CAAC;AAEF,eAAe,iBAAiB,CAAC"}