@pega/cosmos-react-social 4.0.0-dev.9.1 → 4.0.0

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 { TextNode, Element, Node, ParentNode, parse, serialize, Document } from 'parse5';\n\nimport { 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  if (\n    (range1.start >= range2.start && range1.end <= range2.end) ||\n    (range2.start >= range1.start && range2.end <= range1.end)\n  ) {\n    return true;\n  }\n\n  return false;\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  if (\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    return true;\n  }\n\n  return false;\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 = mapping.value.replace(/[-[\\]{}()*+?.,\\\\^$|#\\s]/g, '\\\\$&');\n    // TODO - look-behind is not supported in safari at this point\n    // So we miss the use case of matching entities staring with non word characters like .5\n    // The best regex for webkit browsers is (?<=\\\\W|^)${escapedValue}(?=(\\\\W|$))\n    const regExp = new RegExp(`\\\\b${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 { TextNode, Element, Node, ParentNode, parse, serialize, Document } from 'parse5';\n\nimport { 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 = mapping.value.replace(/[-[\\]{}()*+?.,\\\\^$|#\\s]/g, '\\\\$&');\n    // TODO - look-behind is not supported in safari at this point\n    // So we miss the use case of matching entities staring with non word characters like .5\n    // The best regex for webkit browsers is (?<=\\\\W|^)${escapedValue}(?=(\\\\W|$))\n    const regExp = new RegExp(`\\\\b${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"]}

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

@@ -1,6 +1,7 @@
 import { Dispatch, RefObject, SetStateAction } from 'react';
 import { InteractionRenderers, MDMap } from '@pega/cosmos-react-rte';
-import { MenuItemProps } from '@pega/cosmos-react-core';
+import { AvatarProps, MenuItemProps } from '@pega/cosmos-react-core';
+import { BaseDialogProps } from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.types';
 export interface FeedContextValue {
     searchTypes?: string[];
     onSearch?: (e: {
@@ -15,6 +16,8 @@ export interface FeedContextValue {
         id: string;
         text: string;
         type: string;
+        target?: BaseDialogProps['target'];
+        closeGlimpse?: () => void;
     }) => JSX.Element | undefined;
     onMentionPreview?: (e: {
         id: string;
@@ -28,6 +31,7 @@ export interface FeedContextValue {
         username: string;
         fullname: string;
         avatarSrc?: string;
+        userStatus?: AvatarProps['status'];
         meta?: string[];
         timeZone?: string;
     };

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

@@ -1 +1 @@
-{"version":3,"file":"Feed.context.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/Feed.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,EAAE,oBAAoB,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,MAAM,WAAW,gBAAgB;IAC/B,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,SAAS,GAAG,KAAK,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACzF,aAAa,CAAC,EAAE,aAAa,EAAE,CAAC;IAChC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,oBAAoB,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACzD,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,GAAG,CAAC,OAAO,GAAG,SAAS,CAAC;IAC5F,gBAAgB,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC3E,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oBAAoB,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAC9C,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,QAAQ,EAAE;QACR,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;QACjB,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;QAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAClE,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;CACrC;AAED,eAAO,MAAM,WAAW,2CAMtB,CAAC;AAEH,MAAM,WAAW,qBAAqB;IACpC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,eAAO,MAAM,gBAAgB,gDAA2C,CAAC"}
+{"version":3,"file":"Feed.context.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/Feed.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,EAAE,oBAAoB,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACrE,OAAO,EAAE,eAAe,EAAE,MAAM,4DAA4D,CAAC;AAE7F,MAAM,WAAW,gBAAgB;IAC/B,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,SAAS,GAAG,KAAK,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACzF,aAAa,CAAC,EAAE,aAAa,EAAE,CAAC;IAChC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,oBAAoB,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACzD,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE;QACnB,EAAE,EAAE,MAAM,CAAC;QACX,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;QACb,MAAM,CAAC,EAAE,eAAe,CAAC,QAAQ,CAAC,CAAC;QACnC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;KAC3B,KAAK,GAAG,CAAC,OAAO,GAAG,SAAS,CAAC;IAC9B,gBAAgB,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC3E,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oBAAoB,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAC9C,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,QAAQ,EAAE;QACR,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;QACjB,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,UAAU,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;QACnC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;QAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;IAClE,OAAO,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;CACrC;AAED,eAAO,MAAM,WAAW,2CAMtB,CAAC;AAEH,MAAM,WAAW,qBAAqB;IACpC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,eAAO,MAAM,gBAAgB,gDAA2C,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"Feed.context.js","sourceRoot":"","sources":["../../../src/components/Feed/Feed.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAuC,MAAM,OAAO,CAAC;AA2B3E,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAmB;IACzD,WAAW,EAAE,EAAE;IACf,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE;IACxC,QAAQ,EAAE,GAAG,EAAE;QACb,OAAO,CAAC,CAAwD,CAAC;IACnE,CAAC;CACF,CAAC,CAAC;AAMH,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAAwB,EAAE,CAAC,CAAC","sourcesContent":["import { createContext, Dispatch, RefObject, SetStateAction } from 'react';\n\nimport { InteractionRenderers, MDMap } from '@pega/cosmos-react-rte';\nimport { MenuItemProps } from '@pega/cosmos-react-core';\n\nexport interface FeedContextValue {\n  searchTypes?: string[];\n  onSearch?: (e: { type: 'mention' | 'tag'; search: string; mentionType: string }) => void;\n  searchResults?: MenuItemProps[];\n  showSearchResults?: boolean;\n  setShowSearchResults?: Dispatch<SetStateAction<boolean>>;\n  onMentionClick?: (e: { id: string; text: string; type: string }) => JSX.Element | undefined;\n  onMentionPreview?: (e: { id: string; text: string; type: string }) => void;\n  onTagClick?: (tag: string) => void;\n  interactionRenderers?: InteractionRenderers[];\n  markdownMap?: MDMap;\n  userInfo: {\n    username: string;\n    fullname: string;\n    avatarSrc?: string;\n    meta?: string[];\n    timeZone?: string;\n  };\n  announce: (announcement: string) => ReturnType<typeof setTimeout>;\n  feedRef?: RefObject<HTMLDivElement>;\n}\n\nexport const FeedContext = createContext<FeedContextValue>({\n  searchTypes: [],\n  userInfo: { username: '', fullname: '' },\n  announce: () => {\n    return -1 as unknown as ReturnType<FeedContextValue['announce']>;\n  }\n});\n\nexport interface FeedReplyContextValue {\n  onShowReplyInput?: () => void;\n}\n\nexport const FeedReplyContext = createContext<FeedReplyContextValue>({});\n"]}
+{"version":3,"file":"Feed.context.js","sourceRoot":"","sources":["../../../src/components/Feed/Feed.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAuC,MAAM,OAAO,CAAC;AAmC3E,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAmB;IACzD,WAAW,EAAE,EAAE;IACf,QAAQ,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE;IACxC,QAAQ,EAAE,GAAG,EAAE;QACb,OAAO,CAAC,CAAwD,CAAC;IACnE,CAAC;CACF,CAAC,CAAC;AAMH,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAAwB,EAAE,CAAC,CAAC","sourcesContent":["import { createContext, Dispatch, RefObject, SetStateAction } from 'react';\n\nimport { InteractionRenderers, MDMap } from '@pega/cosmos-react-rte';\nimport { AvatarProps, MenuItemProps } from '@pega/cosmos-react-core';\nimport { BaseDialogProps } from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.types';\n\nexport interface FeedContextValue {\n  searchTypes?: string[];\n  onSearch?: (e: { type: 'mention' | 'tag'; search: string; mentionType: string }) => void;\n  searchResults?: MenuItemProps[];\n  showSearchResults?: boolean;\n  setShowSearchResults?: Dispatch<SetStateAction<boolean>>;\n  onMentionClick?: (e: {\n    id: string;\n    text: string;\n    type: string;\n    target?: BaseDialogProps['target'];\n    closeGlimpse?: () => void;\n  }) => JSX.Element | undefined;\n  onMentionPreview?: (e: { id: string; text: string; type: string }) => void;\n  onTagClick?: (tag: string) => void;\n  interactionRenderers?: InteractionRenderers[];\n  markdownMap?: MDMap;\n  userInfo: {\n    username: string;\n    fullname: string;\n    avatarSrc?: string;\n    userStatus?: AvatarProps['status'];\n    meta?: string[];\n    timeZone?: string;\n  };\n  announce: (announcement: string) => ReturnType<typeof setTimeout>;\n  feedRef?: RefObject<HTMLDivElement>;\n}\n\nexport const FeedContext = createContext<FeedContextValue>({\n  searchTypes: [],\n  userInfo: { username: '', fullname: '' },\n  announce: () => {\n    return -1 as unknown as ReturnType<FeedContextValue['announce']>;\n  }\n});\n\nexport interface FeedReplyContextValue {\n  onShowReplyInput?: () => void;\n}\n\nexport const FeedReplyContext = createContext<FeedReplyContextValue>({});\n"]}

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

@@ -1,56 +1,6 @@
-import { ReactNode, FC } from 'react';
-import { ForwardProps, NoChildrenProp } from '@pega/cosmos-react-core';
-import { FeedContextValue } from './Feed.context';
-export interface Filter {
-    /** Sets DOM id for the control and associates label element via 'for' attribute. */
-    id: string;
-    /** Pass a string or a fragment with an Icon and string for the filter label. */
-    label: ReactNode;
-    /**
-     * Disables the filter.
-     * @default false
-     */
-    disabled?: boolean;
-    /**
-     * Sets on prop via onFilterChange.
-     * @default false
-     */
-    on?: boolean;
-}
-export interface FeedProps extends NoChildrenProp {
-    /** Title for the feed. */
-    title: string;
-    /** Information related to the user of the Feed. */
-    userInfo: FeedContextValue['userInfo'];
-    /** A set of search types that can be used to determine which data set to conduct a mention search on. */
-    searchTypes?: FeedContextValue['searchTypes'];
-    /** A callback that runs when a decorator search has been run inside of the feed. */
-    onDecoratorSearch?: FeedContextValue['onSearch'];
-    /** Results that will be shown in a Popover for a mention or tag search. */
-    searchResults?: FeedContextValue['searchResults'];
-    /** A callback that is triggered when a mention button is clicked. The callback sends back the id, text, and type of the mention. The callback should return a function component. */
-    onMentionClick?: FeedContextValue['onMentionClick'];
-    /** A callback that is triggered when a mention link is previewed. The callback sends back the id, text, and type of the mention. */
-    onMentionPreview?: FeedContextValue['onMentionPreview'];
-    /** A callback that is triggered when a hashtag is clicked. The callback sends back the test of the tag. */
-    onTagClick?: FeedContextValue['onTagClick'];
-    /** A list of configuration objects used to render custom components within Feed posts and replies based off of a given regex pattern. */
-    interactionRenderers?: FeedContextValue['interactionRenderers'];
-    /** A mapping for various element types to render custom components for within posts. */
-    markdownMap?: FeedContextValue['markdownMap'];
-    /** A set of filters to apply to the Feed. */
-    filters?: Filter[];
-    /** A callback that runs when the filter is toggled. */
-    onFilterChange?: (filterId: string, on: boolean) => void;
-    /** A callback that is triggered when the bottom of the Feed is scrolled into view so that additional posts may be displayed. */
-    onLoadMore?: () => void;
-    /** Indicates if the posts are being currently loading */
-    loadingPosts?: boolean;
-    /** A region to hold the new post component */
-    newPostRegion?: ReactNode;
-    /** A list of FeedPost components */
-    posts?: ReactNode[];
-}
+import { FC } from 'react';
+import { ForwardProps } from '@pega/cosmos-react-core';
+import { FeedProps } from './Feed.types';
 declare const Feed: FC<ForwardProps & FeedProps>;
 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":"AAAA,OAAO,EAEL,SAAS,EACT,EAAE,EAOH,MAAM,OAAO,CAAC;AAGf,OAAO,EAIL,YAAY,EAQZ,cAAc,EAIf,MAAM,yBAAyB,CAAC;AAKjC,OAAO,EAAe,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAQ/D,MAAM,WAAW,MAAM;IACrB,oFAAoF;IACpF,EAAE,EAAE,MAAM,CAAC;IACX,gFAAgF;IAChF,KAAK,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,OAAO,CAAC;CACd;AAED,MAAM,WAAW,SAAU,SAAQ,cAAc;IAC/C,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,QAAQ,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACvC,yGAAyG;IACzG,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,oFAAoF;IACpF,iBAAiB,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACjD,2EAA2E;IAC3E,aAAa,CAAC,EAAE,gBAAgB,CAAC,eAAe,CAAC,CAAC;IAClD,qLAAqL;IACrL,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,oIAAoI;IACpI,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;IACxD,2GAA2G;IAC3G,UAAU,CAAC,EAAE,gBAAgB,CAAC,YAAY,CAAC,CAAC;IAC5C,yIAAyI;IACzI,oBAAoB,CAAC,EAAE,gBAAgB,CAAC,sBAAsB,CAAC,CAAC;IAChE,wFAAwF;IACxF,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,uDAAuD;IACvD,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,KAAK,IAAI,CAAC;IACzD,gIAAgI;IAChI,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,yDAAyD;IACzD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,8CAA8C;IAC9C,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,oCAAoC;IACpC,KAAK,CAAC,EAAE,SAAS,EAAE,CAAC;CACrB;AAiDD,QAAA,MAAM,IAAI,EAAE,EAAE,CAAC,YAAY,GAAG,SAAS,CAgLtC,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Feed.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/Feed.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,EAAE,EAA6D,MAAM,OAAO,CAAC;AAGnG,OAAO,EAOL,YAAY,EAab,MAAM,yBAAyB,CAAC;AASjC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAkDzC,QAAA,MAAM,IAAI,EAAE,EAAE,CAAC,YAAY,GAAG,SAAS,CAsMrC,CAAC;AAEH,eAAe,IAAI,CAAC"}

package/lib/components/Feed/Feed.js

@@ -1,44 +1,44 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useRef, useEffect, useCallback, forwardRef } from 'react';
 import styled, { css } from 'styled-components';
-import { Button, defaultThemeProp, Flex, Icon, registerIcon, Popover, Switch, Text, Progress, usePrevious, useItemIntersection, useUID, useConsolidatedRef } from '@pega/cosmos-react-core';
+import { Button, Card, CardContent, CardHeader, defaultThemeProp, Flex, getFocusables, Icon, registerIcon, Popover, StyledCard, Switch, Text, Progress, usePrevious, useItemIntersection, useUID, useConsolidatedRef } from '@pega/cosmos-react-core';
 import { useArrows, useElement, useI18n, useOuterEvent } from '@pega/cosmos-react-core/lib/hooks';
 import * as filterIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter.icon';
 import * as filterOnIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/filter-on.icon';
+import { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';
 import { FeedContext } from './Feed.context';
-import { StyledFeedNewPost } from './FeedNewPost';
-import { StyledFeedPost } from './FeedPost';
 import FeedButton from './FeedButton';
 import FeedAnnouncer from './FeedAnnouncer';
 registerIcon(filterIcon, filterOnIcon);
-const StyledFeed = styled.div(props => {
-    return css `
-    ${StyledFeedNewPost}:not(:last-child), ${StyledFeedPost}:not(:last-child) {
-      margin-bottom: calc(2 * ${props.theme.base.spacing});
-    }
-  `;
-});
+const StyledFeed = styled.div `
+  ${StyledCardHeader}:not(${StyledCard} ${StyledCard} > ${StyledCardHeader}) {
+    padding-bottom: 0.25rem;
+  }
+`;
 StyledFeed.defaultProps = defaultThemeProp;
-const StyledHeading = styled.div(props => {
+const StyledFilterMenu = styled.div(({ theme }) => {
     return css `
-    margin: ${props.theme.base.spacing} 0;
-  `;
-});
-StyledHeading.defaultProps = defaultThemeProp;
-const StyledFilterMenu = styled.div(props => {
-    return css `
-    padding: calc(2 * ${props.theme.base.spacing});
-
     fieldset {
+      padding-block-end: calc(2 * ${theme.base.spacing});
       border: none;
+      max-height: inherit;
+
+      legend {
+        padding-block-start: calc(2 * ${theme.base.spacing});
+        padding-inline: calc(2 * ${theme.base.spacing});
+      }
     }
   `;
 });
 StyledFilterMenu.defaultProps = defaultThemeProp;
-const StyledFilterList = styled.ul `
-  list-style-type: none;
-  min-width: 10rem;
-`;
+const StyledFilterList = styled.ul(({ theme }) => {
+    return css `
+    list-style-type: none;
+    min-width: ${theme.base['content-width'].xs};
+    padding-inline: calc(2 * ${theme.base.spacing});
+    overflow: auto;
+  `;
+});
 StyledFilterList.defaultProps = defaultThemeProp;
 const StyledLoadMore = styled.div(({ theme }) => {
     return css `
@@ -48,7 +48,7 @@ const StyledLoadMore = styled.div(({ theme }) => {
   `;
 });
 StyledLoadMore.defaultProps = defaultThemeProp;
-const Feed = forwardRef((props, ref) => {
+const Feed = forwardRef(function Feed(props, ref) {
     const { loadingPosts = false, variant, children, userInfo, className, title, searchTypes, onDecoratorSearch, searchResults = [], onMentionClick, onMentionPreview, onTagClick, mentionContent, interactionRenderers = [], markdownMap, filters, onFilterChange, onLoadMore, newPostRegion, posts = [], ...restProps } = props;
     const t = useI18n();
     const [popoverEl, setPopoverEl] = useElement();
@@ -63,6 +63,9 @@ const Feed = forwardRef((props, ref) => {
     useOuterEvent('mousedown', [popoverEl, buttonEl], () => {
         setMountPopover(false);
     });
+    useOuterEvent('focusin', [popoverEl], () => {
+        setMountPopover(false);
+    });
     const onKeydown = ({ key }) => {
         if (key === 'Escape')
             setMountPopover(false);
@@ -76,7 +79,7 @@ const Feed = forwardRef((props, ref) => {
     const id = useUID();
     useItemIntersection({ current: null }, posts.length - 1, () => {
         onLoadMore?.();
-    }, `#${id} > div[role='region']`);
+    }, `#${id} > article[role='none']`);
     const announce = useCallback((announcement) => {
         setAnnouncementText('');
         return setTimeout(() => {
@@ -92,7 +95,7 @@ const Feed = forwardRef((props, ref) => {
     useEffect(() => {
         if (prevPosts) {
             let timeoutId;
-            const difference = posts.length - prevPosts?.length;
+            const difference = posts.length - prevPosts.length;
             if (difference < 0)
                 announce(t('feed_post_removed'));
             else if (difference > 0)
@@ -100,7 +103,19 @@ const Feed = forwardRef((props, ref) => {
             return () => clearTimeout(timeoutId);
         }
     }, [posts]);
-    return (_jsx(FeedContext.Provider, { value: {
+    useEffect(() => {
+        if (mountPopover) {
+            setTimeout(() => {
+                const focusables = getFocusables(filterRef);
+                focusables[0]?.focus();
+            }, 0);
+        }
+    }, [mountPopover]);
+    return (_jsx(FeedContext.Provider
+    // eslint-disable-next-line react/jsx-no-constructed-context-values
+    , { 
+        // eslint-disable-next-line react/jsx-no-constructed-context-values
+        value: {
             searchTypes,
             onSearch: e => {
                 if (onDecoratorSearch)
@@ -117,11 +132,16 @@ const Feed = forwardRef((props, ref) => {
             userInfo,
             announce,
             feedRef
-        }, children: _jsxs(StyledFeed, { ref: feedRef, ...restProps, children: [_jsx(FeedAnnouncer, { children: announcementText }), _jsxs(Flex, { container: { justify: 'between', alignItems: 'center' }, as: StyledHeading, children: [_jsx(Text, { variant: 'h2', children: title }), filters && filters.length > 0 && (_jsx(Button, { as: FeedButton, ref: setButtonEl, variant: 'simple', icon: true, onClick: () => setMountPopover(curr => !curr), label: `${title} ${t('filters').toLowerCase()}`, emphasized: true, children: _jsx(Icon, { name: filters?.map(filter => !!filter.on).reduce((acc, curr) => acc || curr)
-                                    ? 'filter-on'
-                                    : 'filter' }) }))] }), _jsx(Popover, { show: !!filters && mountPopover, ref: setPopoverEl, target: buttonEl, as: StyledFilterMenu, portal: feedRef.current ?? undefined, hideOnTargetHidden: true, children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, as: 'fieldset', children: [_jsx(Text, { variant: 'h3', as: 'legend', 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));
-                                }) })] }) }), _jsxs("div", { id: id, children: [newPostRegion, posts] }), loadingPosts && (_jsx(Flex, { container: { justify: 'center' }, as: StyledLoadMore, children: _jsx(Progress, { placement: 'inline' }) }))] }) }));
+        }, children: _jsxs(StyledFeed, { ref: feedRef, ...restProps, children: [_jsx(FeedAnnouncer, { children: announcementText }), _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: () => setMountPopover(curr => !curr), label: `${title} ${t('filters').toLowerCase()}`, emphasized: true, children: _jsx(Icon, { name: filters?.map(filter => !!filter.on).reduce((acc, curr) => acc || curr)
+                                            ? 'filter-on'
+                                            : 'filter' }) })), _jsx(Popover, { show: !!filters && mountPopover, ref: setPopoverEl, target: buttonEl, as: StyledFilterMenu, hideOnTargetHidden: true, onKeyDown: (event) => {
+                                        if (event.key === 'Tab') {
+                                            event.preventDefault();
+                                            buttonEl?.focus();
+                                        }
+                                    }, children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, as: 'fieldset', children: [_jsx(Text, { variant: 'h3', as: 'legend', 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' }) }))] }) }));
 });
 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 {\n  ChangeEvent,\n  ReactNode,\n  FC,\n  useState,\n  useRef,\n  useEffect,\n  useCallback,\n  forwardRef,\n  Ref\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  Button,\n  defaultThemeProp,\n  Flex,\n  ForwardProps,\n  Icon,\n  registerIcon,\n  Popover,\n  Switch,\n  Text,\n  Progress,\n  usePrevious,\n  NoChildrenProp,\n  useItemIntersection,\n  useUID,\n  useConsolidatedRef\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';\n\nimport { FeedContext, FeedContextValue } from './Feed.context';\nimport { StyledFeedNewPost } from './FeedNewPost';\nimport { StyledFeedPost } from './FeedPost';\nimport FeedButton from './FeedButton';\nimport FeedAnnouncer from './FeedAnnouncer';\n\nregisterIcon(filterIcon, filterOnIcon);\n\nexport interface Filter {\n  /** Sets DOM id for the control and associates label element via 'for' attribute. */\n  id: string;\n  /** Pass a string or a fragment with an Icon and string for the filter label. */\n  label: ReactNode;\n  /**\n   * Disables the filter.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Sets on prop via onFilterChange.\n   * @default false\n   */\n  on?: boolean;\n}\n\nexport interface FeedProps extends NoChildrenProp {\n  /** Title for the feed. */\n  title: string;\n  /** Information related to the user of the Feed. */\n  userInfo: FeedContextValue['userInfo'];\n  /** A set of search types that can be used to determine which data set to conduct a mention search on. */\n  searchTypes?: FeedContextValue['searchTypes'];\n  /** A callback that runs when a decorator search has been run inside of the feed. */\n  onDecoratorSearch?: FeedContextValue['onSearch'];\n  /** Results that will be shown in a Popover for a mention or tag search. */\n  searchResults?: FeedContextValue['searchResults'];\n  /** A callback that is triggered when a mention button is clicked. The callback sends back the id, text, and type of the mention. The callback should return a function component. */\n  onMentionClick?: FeedContextValue['onMentionClick'];\n  /** A callback that is triggered when a mention link is previewed. The callback sends back the id, text, and type of the mention. */\n  onMentionPreview?: FeedContextValue['onMentionPreview'];\n  /** A callback that is triggered when a hashtag is clicked. The callback sends back the test of the tag. */\n  onTagClick?: FeedContextValue['onTagClick'];\n  /** A list of configuration objects used to render custom components within Feed posts and replies based off of a given regex pattern. */\n  interactionRenderers?: FeedContextValue['interactionRenderers'];\n  /** A mapping for various element types to render custom components for within posts. */\n  markdownMap?: FeedContextValue['markdownMap'];\n  /** A set of filters to apply to the Feed. */\n  filters?: Filter[];\n  /** A callback that runs when the filter is toggled. */\n  onFilterChange?: (filterId: string, on: boolean) => void;\n  /** A callback that is triggered when the bottom of the Feed is scrolled into view so that additional posts may be displayed. */\n  onLoadMore?: () => void;\n  /** Indicates if the posts are being currently loading */\n  loadingPosts?: boolean;\n  /** A region to hold the new post component */\n  newPostRegion?: ReactNode;\n  /** A list of FeedPost components */\n  posts?: ReactNode[];\n}\n\nconst StyledFeed = styled.div(props => {\n  return css`\n    ${StyledFeedNewPost}:not(:last-child), ${StyledFeedPost}:not(:last-child) {\n      margin-bottom: calc(2 * ${props.theme.base.spacing});\n    }\n  `;\n});\n\nStyledFeed.defaultProps = defaultThemeProp;\n\nconst StyledHeading = styled.div(props => {\n  return css`\n    margin: ${props.theme.base.spacing} 0;\n  `;\n});\n\nStyledHeading.defaultProps = defaultThemeProp;\n\nconst StyledFilterMenu = styled.div(props => {\n  return css`\n    padding: calc(2 * ${props.theme.base.spacing});\n\n    fieldset {\n      border: none;\n    }\n  `;\n});\n\nStyledFilterMenu.defaultProps = defaultThemeProp;\n\nconst StyledFilterList = styled.ul`\n  list-style-type: none;\n  min-width: 10rem;\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: FC<ForwardProps & FeedProps> = forwardRef(\n  (props: ForwardProps & FeedProps, ref: Ref<HTMLDivElement>) => {\n    const {\n      loadingPosts = false,\n      variant,\n      children,\n      userInfo,\n      className,\n      title,\n      searchTypes,\n      onDecoratorSearch,\n      searchResults = [],\n      onMentionClick,\n      onMentionPreview,\n      onTagClick,\n      mentionContent,\n      interactionRenderers = [],\n      markdownMap,\n      filters,\n      onFilterChange,\n      onLoadMore,\n      newPostRegion,\n      posts = [],\n      ...restProps\n    } = props;\n    const t = useI18n();\n    const [popoverEl, setPopoverEl] = useElement<HTMLElement>();\n    const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n    const [mountPopover, setMountPopover] = useState(false);\n    const [showSearchResults, setShowSearchResults] = useState(false);\n    const prevPosts = usePrevious(posts);\n    const [announcementText, setAnnouncementText] = useState('');\n\n    const feedRef = useConsolidatedRef(ref);\n\n    const filterRef = useRef(null);\n    useArrows(filterRef);\n\n    useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n      setMountPopover(false);\n    });\n\n    const onKeydown = ({ key }: KeyboardEvent) => {\n      if (key === 'Escape') setMountPopover(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} > div[role='region']`\n    );\n\n    const announce = useCallback((announcement: string) => {\n      setAnnouncementText('');\n      return setTimeout(() => {\n        setAnnouncementText(announcement);\n      }, 0);\n    }, []);\n\n    useEffect(() => {\n      if (loadingPosts) {\n        const timeoutId = announce(t('loading_post'));\n        return () => clearTimeout(timeoutId);\n      }\n    }, [loadingPosts]);\n\n    useEffect(() => {\n      if (prevPosts) {\n        let timeoutId: ReturnType<typeof setTimeout>;\n        const difference = posts.length - prevPosts?.length;\n        if (difference < 0) announce(t('feed_post_removed'));\n        else if (difference > 0)\n          announce(t('feed_new_post_added', [difference], { count: difference }));\n\n        return () => clearTimeout(timeoutId);\n      }\n    }, [posts]);\n\n    return (\n      <FeedContext.Provider\n        value={{\n          searchTypes,\n          onSearch: e => {\n            if (onDecoratorSearch) onDecoratorSearch(e);\n          },\n          searchResults,\n          showSearchResults,\n          setShowSearchResults,\n          onMentionClick,\n          onMentionPreview,\n          onTagClick,\n          interactionRenderers,\n          markdownMap,\n          userInfo,\n          announce,\n          feedRef\n        }}\n      >\n        <StyledFeed ref={feedRef} {...restProps}>\n          <FeedAnnouncer>{announcementText}</FeedAnnouncer>\n          <Flex container={{ justify: 'between', alignItems: 'center' }} as={StyledHeading}>\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={() => setMountPopover(curr => !curr)}\n                label={`${title} ${t('filters').toLowerCase()}`}\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          </Flex>\n          <Popover\n            show={!!filters && mountPopover}\n            ref={setPopoverEl}\n            target={buttonEl}\n            as={StyledFilterMenu}\n            portal={feedRef.current ?? undefined}\n            hideOnTargetHidden\n          >\n            <Flex container={{ direction: 'column', gap: 2 }} as='fieldset'>\n              <Text variant='h3' as='legend'>\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          </Popover>\n\n          <div id={id}>\n            {newPostRegion}\n            {posts}\n          </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":"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","sourcesContent":["import { ChangeEvent, FC, useState, useRef, useEffect, useCallback, forwardRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  defaultThemeProp,\n  Flex,\n  ForwardProps,\n  getFocusables,\n  Icon,\n  registerIcon,\n  Popover,\n  StyledCard,\n  Switch,\n  Text,\n  Progress,\n  usePrevious,\n  useItemIntersection,\n  useUID,\n  useConsolidatedRef\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';\n\nimport { FeedContext } from './Feed.context';\nimport FeedButton from './FeedButton';\nimport FeedAnnouncer from './FeedAnnouncer';\nimport { 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\nconst StyledFilterMenu = styled.div(({ theme }) => {\n  return css`\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\nStyledFilterMenu.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: FC<ForwardProps & FeedProps> = forwardRef(function Feed(\n  props: ForwardProps & FeedProps,\n  ref: Ref<HTMLDivElement>\n) {\n  const {\n    loadingPosts = false,\n    variant,\n    children,\n    userInfo,\n    className,\n    title,\n    searchTypes,\n    onDecoratorSearch,\n    searchResults = [],\n    onMentionClick,\n    onMentionPreview,\n    onTagClick,\n    mentionContent,\n    interactionRenderers = [],\n    markdownMap,\n    filters,\n    onFilterChange,\n    onLoadMore,\n    newPostRegion,\n    posts = [],\n    ...restProps\n  } = props;\n  const t = useI18n();\n  const [popoverEl, setPopoverEl] = useElement<HTMLElement>();\n  const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n  const [mountPopover, setMountPopover] = useState(false);\n  const [showSearchResults, setShowSearchResults] = useState(false);\n  const prevPosts = usePrevious(posts);\n  const [announcementText, setAnnouncementText] = useState('');\n\n  const feedRef = useConsolidatedRef(ref);\n\n  const filterRef = useRef(null);\n  useArrows(filterRef);\n\n  useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n    setMountPopover(false);\n  });\n\n  useOuterEvent('focusin', [popoverEl], () => {\n    setMountPopover(false);\n  });\n\n  const onKeydown = ({ key }: KeyboardEvent) => {\n    if (key === 'Escape') setMountPopover(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  );\n\n  const announce = useCallback((announcement: string) => {\n    setAnnouncementText('');\n    return setTimeout(() => {\n      setAnnouncementText(announcement);\n    }, 0);\n  }, []);\n\n  useEffect(() => {\n    if (loadingPosts) {\n      const timeoutId = announce(t('loading_post'));\n      return () => clearTimeout(timeoutId);\n    }\n  }, [loadingPosts]);\n\n  useEffect(() => {\n    if (prevPosts) {\n      let timeoutId: ReturnType<typeof setTimeout>;\n      const difference = posts.length - prevPosts.length;\n      if (difference < 0) announce(t('feed_post_removed'));\n      else if (difference > 0)\n        announce(t('feed_new_post_added', [difference], { count: difference }));\n\n      return () => clearTimeout(timeoutId);\n    }\n  }, [posts]);\n\n  useEffect(() => {\n    if (mountPopover) {\n      setTimeout(() => {\n        const focusables = getFocusables(filterRef);\n        focusables[0]?.focus();\n      }, 0);\n    }\n  }, [mountPopover]);\n\n  return (\n    <FeedContext.Provider\n      // eslint-disable-next-line react/jsx-no-constructed-context-values\n      value={{\n        searchTypes,\n        onSearch: e => {\n          if (onDecoratorSearch) onDecoratorSearch(e);\n        },\n        searchResults,\n        showSearchResults,\n        setShowSearchResults,\n        onMentionClick,\n        onMentionPreview,\n        onTagClick,\n        interactionRenderers,\n        markdownMap,\n        userInfo,\n        announce,\n        feedRef\n      }}\n    >\n      <StyledFeed ref={feedRef} {...restProps}>\n        <FeedAnnouncer>{announcementText}</FeedAnnouncer>\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={() => setMountPopover(curr => !curr)}\n                label={`${title} ${t('filters').toLowerCase()}`}\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            <Popover\n              show={!!filters && mountPopover}\n              ref={setPopoverEl}\n              target={buttonEl}\n              as={StyledFilterMenu}\n              hideOnTargetHidden\n              onKeyDown={(event: KeyboardEvent) => {\n                if (event.key === 'Tab') {\n                  event.preventDefault();\n                  buttonEl?.focus();\n                }\n              }}\n            >\n              <Flex container={{ direction: 'column', gap: 2 }} as='fieldset'>\n                <Text variant='h3' as='legend'>\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            </Popover>\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\nexport default Feed;\n"]}