@pega/cosmos-react-demos 3.0.0-dev.3.0 → 3.0.0-dev.30.0

package/jsx/social/Feed/FeedPost.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"FeedPost.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/FeedPost.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta } from '@storybook/react';\nimport { useState } from 'react';\n\nimport {\n  Avatar,\n  CardContent,\n  Link,\n  MenuItemProps,\n  Popover,\n  SummaryListItem,\n  Table,\n  ColumnProps,\n  useUID\n} from '@pega/cosmos-react-core';\nimport {\n  HashtagButtonConfig,\n  MentionButtonConfig,\n  Feed,\n  FeedPost,\n  AttachedFiles\n} from '@pega/cosmos-react-social';\nimport { Glimpse, GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { FeedReplyDemo } from './FeedReply.stories';\nimport {\n  generatedLikes,\n  caseMentions,\n  userMentions,\n  availableRecipients,\n  FeedPostDemoProps\n} from './Feed.mocks';\n\nexport default {\n  title: 'Social/Feed/FeedPost',\n  component: FeedPost\n} as Meta;\n\nexport const FeedPostDemo = ({\n  fullname = 'Katie Smith',\n  username = 'katie_smith',\n  content,\n  postType,\n  recipients,\n  attachments: postAttachments,\n  replies,\n  timeElapsed: time,\n  userStatus,\n  likes: userLikes,\n  likeCount: userLikeCount,\n  onDelete = () => {},\n  renderFeed = true\n}: FeedPostDemoProps) => {\n  const defaultContent = postAttachments\n    ? ''\n    : 'This post mentions @deans:Seth DeAngelo:user: and also contains a tag! #cosmos:';\n\n  const defaultReplies = Array.from(Array(12).keys(), index => {\n    return (\n      <FeedReplyDemo\n        key={`reply-story-${index + 1}`}\n        fullname={fullname}\n        content={`This is reply number ${index + 1}!`}\n        renderFeed={false}\n      />\n    );\n  });\n\n  const key = useUID();\n  const [postContent, setPostContent] = useState(content || defaultContent);\n  const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n\n  const [likes, setLikes] = useState<SummaryListItem[]>([]);\n  const [liked, setLiked] = useState(false);\n  const [likeCount, setLikeCount] = useState<number>(\n    userLikeCount || (renderFeed ? generatedLikes.length : 0)\n  );\n  const [recipientsList, setRecipientsList] = useState<MenuItemProps[]>([]);\n  const [edited, setEdited] = useState(false);\n  const [timeElapsed, setTimeElapsed] = useState(time || '4 days ago');\n\n  const [popoverOpen, setPopoverOpen] = useState(false);\n  const [popoverTarget, setPopoverTarget] = useState<Element>();\n\n  const [extraReplies, setExtraReplies] = useState<any[]>([]);\n  const [replyAttachments, setReplyAttachments] = useState<AttachedFiles[]>([]);\n  const [replyCount, setReplyCount] = useState<number>(\n    replies ? replies.length : defaultReplies.length\n  );\n  const [repliesLoading, setRepliesLoading] = useState(false);\n  const [repliesShown, setRepliesShown] = useState(3);\n\n  const [additionalLikeAdded, setAdditionalLikeAdded] = useState(false);\n  const [allRecipientsVisible, setAllRecipientsVisible] = useState(false);\n\n  const onShowMoreReplies = () => {\n    setRepliesLoading(true);\n    setTimeout(() => {\n      setRepliesShown(curr => {\n        if (curr + 3 <= defaultReplies.length) return curr + 3;\n        return defaultReplies.length;\n      });\n      setRepliesLoading(false);\n    }, 1000);\n  };\n\n  const onShowLessReplies = () => {\n    setRepliesLoading(true);\n    setTimeout(() => {\n      setRepliesShown(3);\n      setRepliesLoading(false);\n    }, 1000);\n  };\n\n  const onSearch = ({\n    type,\n    search,\n    mentionType\n  }: {\n    type: 'mention' | 'tag';\n    search: string;\n    mentionType: string;\n  }) => {\n    if (type === 'mention') {\n      const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n      const mentions: MenuItemProps[] = availableMentions\n        .filter((user: GlimpseProps) => {\n          const names = user.primary.toLowerCase().split(' ');\n          const searchWords = search.toLowerCase().split(' ');\n          return !!searchWords.every((word: string) =>\n            names.find((name: string) => name.startsWith(word))\n          );\n        })\n        .map(({ id, primary, secondary, visual }) => {\n          return {\n            id,\n            primary,\n            secondary,\n            visual\n          };\n        });\n      setSearchResults(mentions);\n    } else {\n      setSearchResults(\n        ['cosmos', 'hashtag', 'pega']\n          .filter(tag => {\n            return tag.toLowerCase().includes(search.toLowerCase());\n          })\n          .map(tag => ({ id: tag, primary: tag }))\n      );\n    }\n  };\n\n  const onFilesAdded = (files: AttachedFiles[]) => {\n    files.forEach(file => {\n      if (file.type.split('/')[0] === 'image') file.thumbnail = URL.createObjectURL(file);\n\n      file.onDelete = () => {\n        setReplyAttachments?.(current => {\n          return current.filter(x => x.name !== file.name);\n        });\n      };\n    });\n\n    setReplyAttachments(files);\n  };\n\n  const getInitialLikes = () => {\n    if (likes.length) return;\n\n    setLikes(userLikes || (renderFeed ? generatedLikes : []));\n  };\n\n  const generateNewLike = () => {\n    setTimeout(() => {\n      setLikes(oldLikes => [\n        ...oldLikes,\n        {\n          primary: 'Generated Like',\n          secondary: ['This like was added after the onLoadMore callback triggered'],\n          visual: <Avatar size='l' name='Generated Like' />,\n          id: 'generatedLike'\n        }\n      ]);\n      setAdditionalLikeAdded(true);\n    }, 1000);\n  };\n\n  const getInitialRecipients = () => {\n    if (recipientsList.length) return;\n\n    setRecipientsList(\n      recipients ||\n        availableRecipients.slice(0, !allRecipientsVisible ? 10 : availableRecipients.length)\n    );\n  };\n\n  const getAllRecipients = () => {\n    setTimeout(() => {\n      setAllRecipientsVisible(true);\n      setRecipientsList(recipients || availableRecipients);\n    }, 1000);\n  };\n\n  const onMentionClick = ({ id, type }: { id: string; type: string }) => {\n    if (type === 'user') {\n      const user = userMentions.find(mention => mention.id === id);\n      if (user) return <Glimpse {...user} />;\n    }\n  };\n\n  const post = (\n    <>\n      <FeedPost\n        id={key}\n        key={key}\n        info={{\n          fullname,\n          username,\n          timeElapsed,\n          content: postContent,\n          postType,\n          recipients: recipientsList,\n          recipientsCount: recipients ? recipients.length : availableRecipients.length,\n          attachments: postAttachments,\n          liked,\n          postContext: renderFeed ? (\n            <Link href='https://www.pega.com' target='_blank'>\n              Pega\n            </Link>\n          ) : undefined,\n          userStatus\n        }}\n        interactionInfo={{\n          likeLabel: 'Like',\n          likes,\n          likeCount: likeCount >= 10 ? likeCount + 1 : likeCount,\n          commentLabel: 'Comment'\n        }}\n        maxContentHeight={80}\n        onLikeClick={({ user }) => {\n          const userLikedIndex = likes.findIndex(x => x.id === user.id);\n          if (userLikedIndex !== -1) {\n            setLikes(oldLikes => {\n              const oldLikesArr = [...oldLikes];\n              oldLikesArr.splice(userLikedIndex, 1);\n              return oldLikesArr;\n            });\n            setLikeCount(curr => curr - 1);\n          } else {\n            setLikes(oldLikes => [user, ...oldLikes]);\n            setLikeCount(curr => curr + 1);\n          }\n          setLiked(curr => !curr);\n        }}\n        onLikeCountInteraction={getInitialLikes}\n        onLoadMoreLikes={!additionalLikeAdded ? generateNewLike : undefined}\n        onRecipientInteraction={getInitialRecipients}\n        onLoadMoreRecipients={!allRecipientsVisible ? getAllRecipients : undefined}\n        onUserClick={(_, clickEvent) => {\n          if (clickEvent) {\n            setPopoverTarget(clickEvent.target as Element);\n            setPopoverOpen(curr => !curr);\n          }\n        }}\n        menuItems={[\n          { primary: 'Custom action', id: 'custom', onClick: () => {} },\n          { primary: 'Delete', id: 'delete', onClick: onDelete }\n        ]}\n        onEditSubmit={({ value }) => {\n          setPostContent(value);\n          setEdited(true);\n          setTimeElapsed('Just now');\n        }}\n        edited={edited}\n        replies={\n          replies\n            ? [...replies, ...extraReplies]\n            : [...defaultReplies.slice(-repliesShown), ...extraReplies]\n        }\n        replyCount={replyCount}\n        repliesLoading={repliesLoading}\n        onShowMoreReplies={onShowMoreReplies}\n        onShowLessReplies={repliesShown > 3 ? onShowLessReplies : undefined}\n        replyInput={{\n          commentLabel: 'Send Comment',\n          attachments: replyAttachments,\n          onFilesAdded,\n          onSubmit: replyEvent => {\n            setReplyAttachments([]);\n\n            replyEvent.attachments.forEach(file => {\n              delete file.onDelete;\n              file.onPreview = () => {};\n              file.onDownload = () => {};\n            });\n\n            setExtraReplies(oldReplies => [\n              ...oldReplies,\n              <FeedReplyDemo\n                key={`replies-${oldReplies.length}`}\n                fullname='Demo User'\n                username='demo_user'\n                content={replyEvent.value}\n                attachments={replyEvent.attachments}\n                timeElapsed='Just now'\n                renderFeed={false}\n              />\n            ]);\n            setReplyCount(oldReplyCount => oldReplyCount + 1);\n            replyEvent.clear();\n          },\n          placeholder: 'Add a comment'\n        }}\n      />\n      {popoverTarget && (\n        <Popover show={popoverOpen} target={popoverTarget} placement='bottom' portal>\n          <CardContent>{fullname}</CardContent>\n        </Popover>\n      )}\n    </>\n  );\n\n  return renderFeed ? (\n    <Feed\n      searchTypes={['user', 'case']}\n      onDecoratorSearch={onSearch}\n      searchResults={searchResults}\n      onMentionClick={onMentionClick}\n      interactionRenderers={[MentionButtonConfig, HashtagButtonConfig]}\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      posts={[post]}\n    />\n  ) : (\n    post\n  );\n};\n\nexport const FeedPostWithPresence = () => {\n  return <FeedPostDemo userStatus='active' />;\n};\n\nexport const FeedPostWithJSX = () => {\n  const data = [\n    {\n      id: '123',\n      name: 'Jane Smith',\n      dob: '12/31/1990',\n      address: 'Boston, MA',\n      email: 'jsmith@email.com',\n      balance: '$2,200'\n    },\n    {\n      id: '456',\n      name: 'Joe Smith',\n      dob: '01/01/1980',\n      address: '',\n      email: 'joe.smith@email.com',\n      balance: '$1,350'\n    },\n    {\n      id: '789',\n      name: 'Mirian Lou',\n      dob: '02/29/1985',\n      address: (\n        <>\n          <div>100 Main St.</div>\n          <div>Cambridge, MA</div>\n        </>\n      ),\n      email: '',\n      balance: '$10'\n    }\n  ];\n\n  const columns: ColumnProps<typeof data[number]>[] = [\n    { renderer: 'name', label: 'Name' },\n    { renderer: 'dob', label: 'Date of Birth' },\n    { renderer: 'address', label: 'Address' },\n    { renderer: 'email', label: 'Email' },\n    { renderer: 'balance', label: 'Account Balance', align: 'right' }\n  ];\n\n  return (\n    <Feed\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      posts={[<FeedPostDemo content={<Table columns={columns} data={data} />} replies={[]} />]}\n    />\n  );\n};\n"]}
+{"version":3,"file":"FeedPost.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/FeedPost.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useCallback, useState } from 'react';\n\nimport {\n  Avatar,\n  CardContent,\n  Link,\n  MenuItemProps,\n  Popover,\n  SummaryListItem,\n  Table,\n  ColumnProps,\n  useUID\n} from '@pega/cosmos-react-core';\nimport {\n  HashtagButtonConfig,\n  MentionButtonConfig,\n  Feed,\n  FeedPost,\n  AttachedFiles\n} from '@pega/cosmos-react-social';\nimport { Glimpse, GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { FeedReplyDemo } from './FeedReply.stories';\nimport {\n  generatedLikes,\n  caseMentions,\n  userMentions,\n  availableRecipients,\n  FeedPostDemoProps\n} from './Feed.mocks';\n\nexport default {\n  title: 'Social/Feed/FeedPost',\n  component: FeedPost\n} as Meta;\n\nexport const FeedPostDemo: Story<FeedPostDemoProps> = ({\n  fullname = 'Demo User',\n  username = 'demo_user',\n  content,\n  postType,\n  recipients,\n  attachments: postAttachments,\n  replies,\n  postTimestamp = new Date(2022, 0, 1),\n  userStatus,\n  likes: userLikes,\n  likeCount: userLikeCount,\n  onDelete = () => {},\n  renderFeed = true\n}: FeedPostDemoProps) => {\n  const defaultContent = postAttachments\n    ? ''\n    : 'This post mentions @[deans]:[Seth DeAngelo]:[user]: and also contains a tag! #cosmos:';\n\n  const defaultReplies = Array.from(Array(12).keys(), index => {\n    return (\n      <FeedReplyDemo\n        key={`reply-story-${index + 1}`}\n        fullname={fullname}\n        content={`This is reply number ${index + 1}!`}\n        renderFeed={false}\n      />\n    );\n  });\n\n  const key = useUID();\n  const [postContent, setPostContent] = useState(content || defaultContent);\n  const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n\n  const [likes, setLikes] = useState<SummaryListItem[]>([]);\n  const [liked, setLiked] = useState(false);\n  const [likeCount, setLikeCount] = useState<number>(\n    userLikeCount || (renderFeed ? generatedLikes.length : 0)\n  );\n  const [recipientsList, setRecipientsList] = useState<MenuItemProps[]>([]);\n  const [edited, setEdited] = useState(false);\n  const [editTimestamp, setEditTimestamp] = useState(new Date());\n\n  const [popoverOpen, setPopoverOpen] = useState(false);\n  const [popoverTarget, setPopoverTarget] = useState<Element>();\n\n  const [extraReplies, setExtraReplies] = useState<any[]>([]);\n  const [replyAttachments, setReplyAttachments] = useState<AttachedFiles[]>([]);\n  const [replyCount, setReplyCount] = useState<number>(\n    replies ? replies.length : defaultReplies.length\n  );\n  const [repliesLoading, setRepliesLoading] = useState(false);\n  const [repliesShown, setRepliesShown] = useState(3);\n\n  const [additionalLikeAdded, setAdditionalLikeAdded] = useState(false);\n  const [allRecipientsVisible, setAllRecipientsVisible] = useState(false);\n\n  const onShowMoreReplies = () => {\n    setRepliesLoading(true);\n    setTimeout(() => {\n      setRepliesShown(curr => {\n        if (curr + 3 <= defaultReplies.length) return curr + 3;\n        return defaultReplies.length;\n      });\n      setRepliesLoading(false);\n    }, 1000);\n  };\n\n  const onShowLessReplies = () => {\n    setRepliesLoading(true);\n    setTimeout(() => {\n      setRepliesShown(3);\n      setRepliesLoading(false);\n    }, 1000);\n  };\n\n  const onSearch = ({\n    type,\n    search,\n    mentionType\n  }: {\n    type: 'mention' | 'tag';\n    search: string;\n    mentionType: string;\n  }) => {\n    if (type === 'mention') {\n      const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n      const mentions: MenuItemProps[] = availableMentions\n        .filter((user: GlimpseProps) => {\n          const names = user.primary.toLowerCase().split(' ');\n          const searchWords = search.toLowerCase().split(' ');\n          return !!searchWords.every((word: string) =>\n            names.find((name: string) => name.startsWith(word))\n          );\n        })\n        .map(({ id, primary, secondary, visual, href }) => {\n          return {\n            id,\n            primary,\n            secondary,\n            visual,\n            href\n          };\n        });\n      setSearchResults(mentions);\n    } else {\n      setSearchResults(\n        ['cosmos', 'hashtag', 'pega']\n          .filter(tag => {\n            return tag.toLowerCase().includes(search.toLowerCase());\n          })\n          .map(tag => ({ id: tag, primary: tag }))\n      );\n    }\n  };\n\n  const onFilesAdded = (files: AttachedFiles[]) => {\n    files.forEach(file => {\n      if (file.type.split('/')[0] === 'image') file.thumbnail = URL.createObjectURL(file);\n\n      file.onDelete = () => {\n        setReplyAttachments?.(current => {\n          return current.filter(x => x.name !== file.name);\n        });\n      };\n    });\n\n    setReplyAttachments(files);\n  };\n\n  const getInitialLikes = () => {\n    if (likes.length) return;\n\n    setLikes(userLikes || (renderFeed ? generatedLikes : []));\n  };\n\n  const [likesLoading, setLikesLoading] = useState(false);\n\n  const generateNewLike = useCallback(() => {\n    if (!likesLoading) {\n      setLikesLoading(true);\n      setTimeout(() => {\n        setLikesLoading(false);\n        setLikes(oldLikes => [\n          ...oldLikes,\n          {\n            primary: 'Generated Like',\n            secondary: ['This like was added after the onLoadMore callback triggered'],\n            visual: <Avatar size='l' name='Generated Like' />,\n            id: 'generatedLike'\n          }\n        ]);\n        setAdditionalLikeAdded(true);\n      }, 1000);\n    }\n  }, [likesLoading]);\n\n  const getInitialRecipients = () => {\n    if (recipientsList.length) return;\n\n    setRecipientsList(\n      recipients ||\n        availableRecipients.slice(0, !allRecipientsVisible ? 10 : availableRecipients.length)\n    );\n  };\n\n  const [recipientsLoading, setRecipientsLoading] = useState(false);\n\n  const getAllRecipients = () => {\n    if (!recipientsLoading) {\n      setRecipientsLoading(true);\n      setTimeout(() => {\n        setRecipientsLoading(false);\n        setAllRecipientsVisible(true);\n        setRecipientsList(recipients || availableRecipients);\n      }, 1000);\n    }\n  };\n\n  const onMentionClick = ({ id, type }: { id: string; type: string }) => {\n    if (type === 'user') {\n      const user = userMentions.find(mention => mention.id === id);\n      if (user) return <Glimpse {...user} />;\n    }\n  };\n\n  const post = (\n    <>\n      <FeedPost\n        id={key}\n        key={key}\n        info={{\n          fullname,\n          username,\n          postTimestamp,\n          content: postContent,\n          postType,\n          recipients: recipientsList,\n          recipientsCount: recipients ? recipients.length : availableRecipients.length,\n          attachments: postAttachments,\n          liked,\n          postContext: renderFeed ? (\n            <Link href='https://www.pega.com' target='_blank'>\n              Pega\n            </Link>\n          ) : undefined,\n          userStatus\n        }}\n        interactionInfo={{\n          likeLabel: 'Like',\n          likes,\n          likeCount: likeCount >= 10 ? likeCount + 1 : likeCount,\n          commentLabel: 'Comment'\n        }}\n        maxContentHeight={80}\n        onLikeClick={({ user }) => {\n          const userLikedIndex = likes.findIndex(x => x.id === user.id);\n          if (userLikedIndex !== -1) {\n            setLikes(oldLikes => {\n              const oldLikesArr = [...oldLikes];\n              oldLikesArr.splice(userLikedIndex, 1);\n              return oldLikesArr;\n            });\n            setLikeCount(curr => curr - 1);\n          } else {\n            setLikes(oldLikes => [user, ...oldLikes]);\n            setLikeCount(curr => curr + 1);\n          }\n          setLiked(curr => !curr);\n        }}\n        onLikeCountInteraction={getInitialLikes}\n        likesLoading={likesLoading}\n        onLoadMoreLikes={!additionalLikeAdded ? generateNewLike : undefined}\n        onRecipientInteraction={getInitialRecipients}\n        recipientsLoading={recipientsLoading}\n        onLoadMoreRecipients={!allRecipientsVisible ? getAllRecipients : undefined}\n        onUserClick={(_, clickEvent) => {\n          if (clickEvent) {\n            setPopoverTarget(clickEvent.target as Element);\n            setPopoverOpen(curr => !curr);\n          }\n        }}\n        menuItems={[\n          { primary: 'Custom action', id: 'custom', onClick: () => {} },\n          { primary: 'Delete', id: 'delete', onClick: onDelete }\n        ]}\n        onEditSubmit={({ value }) => {\n          setPostContent(value);\n          setEdited(true);\n          setEditTimestamp(new Date());\n        }}\n        edited={edited}\n        editTimestamp={editTimestamp}\n        replies={\n          replies\n            ? [...replies, ...extraReplies]\n            : [...defaultReplies.slice(-repliesShown), ...extraReplies]\n        }\n        replyCount={replyCount}\n        repliesLoading={repliesLoading}\n        onShowMoreReplies={onShowMoreReplies}\n        onShowLessReplies={repliesShown > 3 ? onShowLessReplies : undefined}\n        replyInput={{\n          commentLabel: 'Send Comment',\n          attachments: replyAttachments,\n          onFilesAdded,\n          onSubmit: replyEvent => {\n            setReplyAttachments([]);\n\n            replyEvent.attachments.forEach(file => {\n              delete file.onDelete;\n              file.onPreview = () => {};\n              file.onDownload = () => {};\n            });\n\n            setExtraReplies(oldReplies => [\n              ...oldReplies,\n              <FeedReplyDemo\n                key={`replies-${oldReplies.length}`}\n                fullname='Demo User'\n                username='demo_user'\n                content={replyEvent.value}\n                attachments={replyEvent.attachments}\n                postTimestamp={new Date()}\n                renderFeed={false}\n              />\n            ]);\n            setReplyCount(oldReplyCount => oldReplyCount + 1);\n            replyEvent.clear();\n          },\n          placeholder: 'Add a comment'\n        }}\n      />\n      {popoverTarget && (\n        <Popover show={popoverOpen} target={popoverTarget} placement='bottom' portal>\n          <CardContent>{fullname}</CardContent>\n        </Popover>\n      )}\n    </>\n  );\n\n  return renderFeed ? (\n    <Feed\n      title='Pulse'\n      searchTypes={['user', 'case']}\n      onDecoratorSearch={onSearch}\n      searchResults={searchResults}\n      onMentionClick={onMentionClick}\n      interactionRenderers={[MentionButtonConfig, HashtagButtonConfig]}\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      posts={[post]}\n    />\n  ) : (\n    post\n  );\n};\n\nexport const FeedPostWithPresence: Story = () => {\n  return <FeedPostDemo userStatus='active' />;\n};\n\nexport const FeedPostWithJSX: Story = () => {\n  const data = [\n    {\n      id: '123',\n      name: 'Jane Smith',\n      dob: '12/31/1990',\n      address: 'Boston, MA',\n      email: 'jsmith@email.com',\n      balance: '$2,200'\n    },\n    {\n      id: '456',\n      name: 'Joe Smith',\n      dob: '01/01/1980',\n      address: '',\n      email: 'joe.smith@email.com',\n      balance: '$1,350'\n    },\n    {\n      id: '789',\n      name: 'Mirian Lou',\n      dob: '02/29/1985',\n      address: (\n        <>\n          <div>100 Main St.</div>\n          <div>Cambridge, MA</div>\n        </>\n      ),\n      email: '',\n      balance: '$10'\n    }\n  ];\n\n  const columns: ColumnProps<typeof data[number]>[] = [\n    { renderer: 'name', label: 'Name' },\n    { renderer: 'dob', label: 'Date of Birth' },\n    { renderer: 'address', label: 'Address' },\n    { renderer: 'email', label: 'Email' },\n    { renderer: 'balance', label: 'Account Balance', align: 'right' }\n  ];\n\n  return (\n    <Feed\n      title='Pulse'\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      posts={[<FeedPostDemo content={<Table columns={columns} data={data} />} replies={[]} />]}\n    />\n  );\n};\n"]}

package/jsx/social/Feed/FeedReply.stories.d.ts

@@ -1,16 +1,16 @@
-/// <reference types="react" />
-import { Meta } from '@storybook/react';
+import { Meta, Story } from '@storybook/react';
 import { FeedReplyProps } from '@pega/cosmos-react-social';
 declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
-export declare const FeedReplyDemo: ({ fullname, username, content, attachments, timeElapsed: time, userStatus, renderFeed }: {
-    fullname?: string | undefined;
-    username?: string | undefined;
-    content?: string | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | undefined;
+interface FeedReplyDemoProps {
+    fullname?: FeedReplyProps['info']['fullname'];
+    username?: FeedReplyProps['info']['username'];
+    content?: FeedReplyProps['info']['content'];
     attachments?: FeedReplyProps['info']['attachments'];
-    timeElapsed?: string | undefined;
+    postTimestamp?: FeedReplyProps['info']['postTimestamp'];
     userStatus?: FeedReplyProps['info']['userStatus'];
-    renderFeed?: boolean | undefined;
-}) => JSX.Element;
-export declare const FeedReplyWithPresence: () => JSX.Element;
+    renderFeed?: boolean;
+}
+export declare const FeedReplyDemo: Story<FeedReplyDemoProps>;
+export declare const FeedReplyWithPresence: Story;
 //# sourceMappingURL=FeedReply.stories.d.ts.map

package/jsx/social/Feed/FeedReply.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FeedReply.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/FeedReply.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAIxC,OAAO,EAGL,cAAc,EAGf,MAAM,2BAA2B,CAAC;;AAKnC,wBAGU;AAEV,eAAO,MAAM,aAAa;;;;kBAYV,cAAc,CAAC,MAAM,CAAC,CAAC,aAAa,CAAC;;iBAEtC,cAAc,CAAC,MAAM,CAAC,CAAC,YAAY,CAAC;;iBAsHlD,CAAC;AAEF,eAAO,MAAM,qBAAqB,mBAEjC,CAAC"}
+{"version":3,"file":"FeedReply.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/FeedReply.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAI/C,OAAO,EAGL,cAAc,EAGf,MAAM,2BAA2B,CAAC;;AAKnC,wBAGU;AAEV,UAAU,kBAAkB;IAC1B,QAAQ,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAC;IAC9C,QAAQ,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,CAAC;IAC5C,WAAW,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,aAAa,CAAC,CAAC;IACpD,aAAa,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,eAAe,CAAC,CAAC;IACxD,UAAU,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,YAAY,CAAC,CAAC;IAClD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,kBAAkB,CAqInD,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAEnC,CAAC"}

package/jsx/social/Feed/FeedReply.stories.jsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState, useCallback } from 'react';
 import { Avatar, CardContent, Popover, useUID } from '@pega/cosmos-react-core';
 import { Feed, FeedReply, HashtagButtonConfig, MentionButtonConfig } from '@pega/cosmos-react-social';
 import { Glimpse } from '@pega/cosmos-react-work';
@@ -7,17 +7,17 @@ export default {
     title: 'Social/Feed/FeedReply',
     component: FeedReply
 };
-export const FeedReplyDemo = ({ fullname = 'Katie Smith', username = 'katie_smith', content, attachments, timeElapsed: time, userStatus, renderFeed = true }) => {
+export const FeedReplyDemo = ({ fullname = 'Demo User', username = 'demo_user', content, attachments, postTimestamp = new Date(2022, 0, 1), userStatus, renderFeed = true }) => {
     const defaultContent = attachments
         ? ''
-        : 'This reply mentions @deans:Seth DeAngelo:user: and also contains a tag! #cosmos:';
+        : 'This reply mentions @[deans]:[Seth DeAngelo]:[user]: and also contains a tag! #cosmos:';
     const key = useUID();
     const [likes, setLikes] = useState([]);
     const [liked, setLiked] = useState(false);
     const [likeCount, setLikeCount] = useState(renderFeed ? generatedLikes.length : 0);
     const [replyContent, setReplyContent] = useState(content || defaultContent);
     const [edited, setEdited] = useState(false);
-    const [timeElapsed, setTimeElapsed] = useState(time || '3 days ago');
+    const [editTimestamp, setEditTimestamp] = useState(new Date());
     const [popoverOpen, setPopoverOpen] = useState(false);
     const [popoverTarget, setPopoverTarget] = useState();
     const [additionalLikeAdded, setAdditionalLikeAdded] = useState(false);
@@ -26,20 +26,25 @@ export const FeedReplyDemo = ({ fullname = 'Katie Smith', username = 'katie_smit
             return;
         setLikes(renderFeed ? generatedLikes : []);
     };
-    const generateNewLike = () => {
-        setTimeout(() => {
-            setLikes(oldLikes => [
-                ...oldLikes,
-                {
-                    primary: 'Generated Like',
-                    secondary: ['This like was added after the onLoadMore callback triggered'],
-                    visual: <Avatar size='l' name='Generated Like'/>,
-                    id: 'generatedLike'
-                }
-            ]);
-            setAdditionalLikeAdded(true);
-        }, 1000);
-    };
+    const [likesLoading, setLikesLoading] = useState(false);
+    const generateNewLike = useCallback(() => {
+        if (!likesLoading) {
+            setLikesLoading(true);
+            setTimeout(() => {
+                setLikesLoading(false);
+                setLikes(oldLikes => [
+                    ...oldLikes,
+                    {
+                        primary: 'Generated Like',
+                        secondary: ['This like was added after the onLoadMore callback triggered'],
+                        visual: <Avatar size='l' name='Generated Like'/>,
+                        id: 'generatedLike'
+                    }
+                ]);
+                setAdditionalLikeAdded(true);
+            }, 1000);
+        }
+    }, [likesLoading]);
     const onMentionClick = ({ id, type }) => {
         if (type === 'user') {
             const user = userMentions.find(mention => mention.id === id);
@@ -49,7 +54,7 @@ export const FeedReplyDemo = ({ fullname = 'Katie Smith', username = 'katie_smit
     };
     const reply = (<>
       <FeedReply id={key} key={key} info={{
-            timeElapsed,
+            postTimestamp,
             content: replyContent,
             attachments,
             username,
@@ -65,8 +70,8 @@ export const FeedReplyDemo = ({ fullname = 'Katie Smith', username = 'katie_smit
         }} maxContentHeight={40} menuItems={[{ primary: 'Custom action', id: 'custom', onClick: () => { } }]} onEditSubmit={({ value }) => {
             setReplyContent(value);
             setEdited(true);
-            setTimeElapsed('Just now');
-        }} edited={edited} onCommentClick={() => { }} onLikeClick={({ user }) => {
+            setEditTimestamp(new Date());
+        }} edited={edited} editTimestamp={editTimestamp} onCommentClick={() => { }} onLikeClick={({ user }) => {
             const userLikedIndex = likes.findIndex(x => x.id === user.id);
             if (userLikedIndex !== -1) {
                 setLikes(oldLikes => {
@@ -81,7 +86,7 @@ export const FeedReplyDemo = ({ fullname = 'Katie Smith', username = 'katie_smit
                 setLikeCount(curr => curr + 1);
             }
             setLiked(curr => !curr);
-        }} onLikeCountInteraction={getInitialLikes} onLoadMoreLikes={!additionalLikeAdded ? generateNewLike : undefined} onUserClick={(_, clickEvent) => {
+        }} onLikeCountInteraction={getInitialLikes} onLoadMoreLikes={!additionalLikeAdded ? generateNewLike : undefined} likesLoading={likesLoading} onUserClick={(_, clickEvent) => {
             if (clickEvent) {
                 setPopoverTarget(clickEvent.target);
                 setPopoverOpen(curr => !curr);
@@ -91,7 +96,7 @@ export const FeedReplyDemo = ({ fullname = 'Katie Smith', username = 'katie_smit
           <CardContent>{fullname}</CardContent>
         </Popover>)}
     </>);
-    return renderFeed ? (<Feed onMentionClick={onMentionClick} interactionRenderers={[MentionButtonConfig, HashtagButtonConfig]} userInfo={{ username: 'demo_user', fullname: 'Demo User' }} posts={[reply]}/>) : (reply);
+    return renderFeed ? (<Feed title='Pulse' onMentionClick={onMentionClick} interactionRenderers={[MentionButtonConfig, HashtagButtonConfig]} userInfo={{ username: 'demo_user', fullname: 'Demo User' }} posts={[reply]}/>) : (reply);
 };
 export const FeedReplyWithPresence = () => {
     return <FeedReplyDemo userStatus='active'/>;

package/jsx/social/Feed/FeedReply.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"FeedReply.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/FeedReply.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { Avatar, CardContent, Popover, SummaryListItem, useUID } from '@pega/cosmos-react-core';\nimport {\n  Feed,\n  FeedReply,\n  FeedReplyProps,\n  HashtagButtonConfig,\n  MentionButtonConfig\n} from '@pega/cosmos-react-social';\nimport { Glimpse } from '@pega/cosmos-react-work';\n\nimport { generatedLikes, userMentions } from './Feed.mocks';\n\nexport default {\n  title: 'Social/Feed/FeedReply',\n  component: FeedReply\n} as Meta;\n\nexport const FeedReplyDemo = ({\n  fullname = 'Katie Smith',\n  username = 'katie_smith',\n  content,\n  attachments,\n  timeElapsed: time,\n  userStatus,\n  renderFeed = true\n}: {\n  fullname?: FeedReplyProps['info']['fullname'];\n  username?: FeedReplyProps['info']['username'];\n  content?: FeedReplyProps['info']['content'];\n  attachments?: FeedReplyProps['info']['attachments'];\n  timeElapsed?: FeedReplyProps['info']['timeElapsed'];\n  userStatus?: FeedReplyProps['info']['userStatus'];\n  renderFeed?: boolean;\n}) => {\n  const defaultContent = attachments\n    ? ''\n    : 'This reply mentions @deans:Seth DeAngelo:user: and also contains a tag! #cosmos:';\n\n  const key = useUID();\n  const [likes, setLikes] = useState<SummaryListItem[]>([]);\n  const [liked, setLiked] = useState(false);\n  const [likeCount, setLikeCount] = useState(renderFeed ? generatedLikes.length : 0);\n  const [replyContent, setReplyContent] = useState(content || defaultContent);\n  const [edited, setEdited] = useState(false);\n  const [timeElapsed, setTimeElapsed] = useState(time || '3 days ago');\n  const [popoverOpen, setPopoverOpen] = useState(false);\n  const [popoverTarget, setPopoverTarget] = useState<Element>();\n  const [additionalLikeAdded, setAdditionalLikeAdded] = useState(false);\n\n  const getInitialLikes = () => {\n    if (likes.length) return;\n\n    setLikes(renderFeed ? generatedLikes : []);\n  };\n\n  const generateNewLike = () => {\n    setTimeout(() => {\n      setLikes(oldLikes => [\n        ...oldLikes,\n        {\n          primary: 'Generated Like',\n          secondary: ['This like was added after the onLoadMore callback triggered'],\n          visual: <Avatar size='l' name='Generated Like' />,\n          id: 'generatedLike'\n        }\n      ]);\n      setAdditionalLikeAdded(true);\n    }, 1000);\n  };\n\n  const onMentionClick = ({ id, type }: { id: string; type: string }) => {\n    if (type === 'user') {\n      const user = userMentions.find(mention => mention.id === id);\n      if (user) return <Glimpse {...user} />;\n    }\n  };\n\n  const reply = (\n    <>\n      <FeedReply\n        id={key}\n        key={key}\n        info={{\n          timeElapsed,\n          content: replyContent,\n          attachments,\n          username,\n          fullname,\n          fullnameLabel: `${fullname}'s Profile`,\n          liked,\n          userStatus\n        }}\n        interactionInfo={{\n          likes,\n          likeCount: likeCount >= 10 ? likeCount + 1 : likeCount,\n          likeLabel: 'Like',\n          commentLabel: 'Comment'\n        }}\n        maxContentHeight={40}\n        menuItems={[{ primary: 'Custom action', id: 'custom', onClick: () => {} }]}\n        onEditSubmit={({ value }) => {\n          setReplyContent(value);\n          setEdited(true);\n          setTimeElapsed('Just now');\n        }}\n        edited={edited}\n        onCommentClick={() => {}}\n        onLikeClick={({ user }) => {\n          const userLikedIndex = likes.findIndex(x => x.id === user.id);\n          if (userLikedIndex !== -1) {\n            setLikes(oldLikes => {\n              const oldLikesArr = [...oldLikes];\n              oldLikesArr.splice(userLikedIndex, 1);\n              return oldLikesArr;\n            });\n            setLikeCount(curr => curr - 1);\n          } else {\n            setLikes(oldLikes => [user, ...oldLikes]);\n            setLikeCount(curr => curr + 1);\n          }\n          setLiked(curr => !curr);\n        }}\n        onLikeCountInteraction={getInitialLikes}\n        onLoadMoreLikes={!additionalLikeAdded ? generateNewLike : undefined}\n        onUserClick={(_, clickEvent) => {\n          if (clickEvent) {\n            setPopoverTarget(clickEvent.target as Element);\n            setPopoverOpen(curr => !curr);\n          }\n        }}\n      />\n      {popoverTarget && (\n        <Popover show={popoverOpen} target={popoverTarget} placement='bottom' portal>\n          <CardContent>{fullname}</CardContent>\n        </Popover>\n      )}\n    </>\n  );\n\n  return renderFeed ? (\n    <Feed\n      onMentionClick={onMentionClick}\n      interactionRenderers={[MentionButtonConfig, HashtagButtonConfig]}\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      posts={[reply]}\n    />\n  ) : (\n    reply\n  );\n};\n\nexport const FeedReplyWithPresence = () => {\n  return <FeedReplyDemo userStatus='active' />;\n};\n"]}
+{"version":3,"file":"FeedReply.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/FeedReply.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,OAAO,EAAmB,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAChG,OAAO,EACL,IAAI,EACJ,SAAS,EAET,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAElD,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE5D,eAAe;IACb,KAAK,EAAE,uBAAuB;IAC9B,SAAS,EAAE,SAAS;CACb,CAAC;AAYV,MAAM,CAAC,MAAM,aAAa,GAA8B,CAAC,EACvD,QAAQ,GAAG,WAAW,EACtB,QAAQ,GAAG,WAAW,EACtB,OAAO,EACP,WAAW,EACX,aAAa,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,EACpC,UAAU,EACV,UAAU,GAAG,IAAI,EACE,EAAE,EAAE;IACvB,MAAM,cAAc,GAAG,WAAW;QAChC,CAAC,CAAC,EAAE;QACJ,CAAC,CAAC,wFAAwF,CAAC;IAE7F,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAoB,EAAE,CAAC,CAAC;IAC1D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACnF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,OAAO,IAAI,cAAc,CAAC,CAAC;IAC5E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;IAC/D,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAAW,CAAC;IAC9D,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtE,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,IAAI,KAAK,CAAC,MAAM;YAAE,OAAO;QAEzB,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IAC7C,CAAC,CAAC;IAEF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,EAAE;QACvC,IAAI,CAAC,YAAY,EAAE;YACjB,eAAe,CAAC,IAAI,CAAC,CAAC;YACtB,UAAU,CAAC,GAAG,EAAE;gBACd,eAAe,CAAC,KAAK,CAAC,CAAC;gBACvB,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC;oBACnB,GAAG,QAAQ;oBACX;wBACE,OAAO,EAAE,gBAAgB;wBACzB,SAAS,EAAE,CAAC,6DAA6D,CAAC;wBAC1E,MAAM,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,gBAAgB,EAAG;wBACjD,EAAE,EAAE,eAAe;qBACpB;iBACF,CAAC,CAAC;gBACH,sBAAsB,CAAC,IAAI,CAAC,CAAC;YAC/B,CAAC,EAAE,IAAI,CAAC,CAAC;SACV;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,cAAc,GAAG,CAAC,EAAE,EAAE,EAAE,IAAI,EAAgC,EAAE,EAAE;QACpE,IAAI,IAAI,KAAK,MAAM,EAAE;YACnB,MAAM,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;YAC7D,IAAI,IAAI;gBAAE,OAAO,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,EAAG,CAAC;SACxC;IACH,CAAC,CAAC;IAEF,MAAM,KAAK,GAAG,CACZ,EACE;MAAA,CAAC,SAAS,CACR,EAAE,CAAC,CAAC,GAAG,CAAC,CACR,GAAG,CAAC,CAAC,GAAG,CAAC,CACT,IAAI,CAAC,CAAC;YACJ,aAAa;YACb,OAAO,EAAE,YAAY;YACrB,WAAW;YACX,QAAQ;YACR,QAAQ;YACR,aAAa,EAAE,GAAG,QAAQ,YAAY;YACtC,KAAK;YACL,UAAU;SACX,CAAC,CACF,eAAe,CAAC,CAAC;YACf,KAAK;YACL,SAAS,EAAE,SAAS,IAAI,EAAE,CAAC,CAAC,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS;YACtD,SAAS,EAAE,MAAM;YACjB,YAAY,EAAE,SAAS;SACxB,CAAC,CACF,gBAAgB,CAAC,CAAC,EAAE,CAAC,CACrB,SAAS,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,eAAe,EAAE,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,CAAC,CAAC,CAC3E,YAAY,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;YAC1B,eAAe,CAAC,KAAK,CAAC,CAAC;YACvB,SAAS,CAAC,IAAI,CAAC,CAAC;YAChB,gBAAgB,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;QAC/B,CAAC,CAAC,CACF,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,aAAa,CAAC,CAAC,aAAa,CAAC,CAC7B,cAAc,CAAC,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CACzB,WAAW,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;YACxB,MAAM,cAAc,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC;YAC9D,IAAI,cAAc,KAAK,CAAC,CAAC,EAAE;gBACzB,QAAQ,CAAC,QAAQ,CAAC,EAAE;oBAClB,MAAM,WAAW,GAAG,CAAC,GAAG,QAAQ,CAAC,CAAC;oBAClC,WAAW,CAAC,MAAM,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC;oBACtC,OAAO,WAAW,CAAC;gBACrB,CAAC,CAAC,CAAC;gBACH,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC;aAChC;iBAAM;gBACL,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC;gBAC1C,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC;aAChC;YACD,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;QAC1B,CAAC,CAAC,CACF,sBAAsB,CAAC,CAAC,eAAe,CAAC,CACxC,eAAe,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,CAAC,CACpE,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,EAAE;YAC7B,IAAI,UAAU,EAAE;gBACd,gBAAgB,CAAC,UAAU,CAAC,MAAiB,CAAC,CAAC;gBAC/C,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC;aAC/B;QACH,CAAC,CAAC,EAEJ;MAAA,CAAC,aAAa,IAAI,CAChB,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,aAAa,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAC1E;UAAA,CAAC,WAAW,CAAC,CAAC,QAAQ,CAAC,EAAE,WAAW,CACtC;QAAA,EAAE,OAAO,CAAC,CACX,CACH;IAAA,GAAG,CACJ,CAAC;IAEF,OAAO,UAAU,CAAC,CAAC,CAAC,CAClB,CAAC,IAAI,CACH,KAAK,CAAC,OAAO,CACb,cAAc,CAAC,CAAC,cAAc,CAAC,CAC/B,oBAAoB,CAAC,CAAC,CAAC,mBAAmB,EAAE,mBAAmB,CAAC,CAAC,CACjE,QAAQ,CAAC,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC,CAC3D,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,EACf,CACH,CAAC,CAAC,CAAC,CACF,KAAK,CACN,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAU,GAAG,EAAE;IAC/C,OAAO,CAAC,aAAa,CAAC,UAAU,CAAC,QAAQ,EAAG,CAAC;AAC/C,CAAC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState, useCallback } from 'react';\n\nimport { Avatar, CardContent, Popover, SummaryListItem, useUID } from '@pega/cosmos-react-core';\nimport {\n  Feed,\n  FeedReply,\n  FeedReplyProps,\n  HashtagButtonConfig,\n  MentionButtonConfig\n} from '@pega/cosmos-react-social';\nimport { Glimpse } from '@pega/cosmos-react-work';\n\nimport { generatedLikes, userMentions } from './Feed.mocks';\n\nexport default {\n  title: 'Social/Feed/FeedReply',\n  component: FeedReply\n} as Meta;\n\ninterface FeedReplyDemoProps {\n  fullname?: FeedReplyProps['info']['fullname'];\n  username?: FeedReplyProps['info']['username'];\n  content?: FeedReplyProps['info']['content'];\n  attachments?: FeedReplyProps['info']['attachments'];\n  postTimestamp?: FeedReplyProps['info']['postTimestamp'];\n  userStatus?: FeedReplyProps['info']['userStatus'];\n  renderFeed?: boolean;\n}\n\nexport const FeedReplyDemo: Story<FeedReplyDemoProps> = ({\n  fullname = 'Demo User',\n  username = 'demo_user',\n  content,\n  attachments,\n  postTimestamp = new Date(2022, 0, 1),\n  userStatus,\n  renderFeed = true\n}: FeedReplyDemoProps) => {\n  const defaultContent = attachments\n    ? ''\n    : 'This reply mentions @[deans]:[Seth DeAngelo]:[user]: and also contains a tag! #cosmos:';\n\n  const key = useUID();\n  const [likes, setLikes] = useState<SummaryListItem[]>([]);\n  const [liked, setLiked] = useState(false);\n  const [likeCount, setLikeCount] = useState(renderFeed ? generatedLikes.length : 0);\n  const [replyContent, setReplyContent] = useState(content || defaultContent);\n  const [edited, setEdited] = useState(false);\n  const [editTimestamp, setEditTimestamp] = useState(new Date());\n  const [popoverOpen, setPopoverOpen] = useState(false);\n  const [popoverTarget, setPopoverTarget] = useState<Element>();\n  const [additionalLikeAdded, setAdditionalLikeAdded] = useState(false);\n\n  const getInitialLikes = () => {\n    if (likes.length) return;\n\n    setLikes(renderFeed ? generatedLikes : []);\n  };\n\n  const [likesLoading, setLikesLoading] = useState(false);\n\n  const generateNewLike = useCallback(() => {\n    if (!likesLoading) {\n      setLikesLoading(true);\n      setTimeout(() => {\n        setLikesLoading(false);\n        setLikes(oldLikes => [\n          ...oldLikes,\n          {\n            primary: 'Generated Like',\n            secondary: ['This like was added after the onLoadMore callback triggered'],\n            visual: <Avatar size='l' name='Generated Like' />,\n            id: 'generatedLike'\n          }\n        ]);\n        setAdditionalLikeAdded(true);\n      }, 1000);\n    }\n  }, [likesLoading]);\n\n  const onMentionClick = ({ id, type }: { id: string; type: string }) => {\n    if (type === 'user') {\n      const user = userMentions.find(mention => mention.id === id);\n      if (user) return <Glimpse {...user} />;\n    }\n  };\n\n  const reply = (\n    <>\n      <FeedReply\n        id={key}\n        key={key}\n        info={{\n          postTimestamp,\n          content: replyContent,\n          attachments,\n          username,\n          fullname,\n          fullnameLabel: `${fullname}'s Profile`,\n          liked,\n          userStatus\n        }}\n        interactionInfo={{\n          likes,\n          likeCount: likeCount >= 10 ? likeCount + 1 : likeCount,\n          likeLabel: 'Like',\n          commentLabel: 'Comment'\n        }}\n        maxContentHeight={40}\n        menuItems={[{ primary: 'Custom action', id: 'custom', onClick: () => {} }]}\n        onEditSubmit={({ value }) => {\n          setReplyContent(value);\n          setEdited(true);\n          setEditTimestamp(new Date());\n        }}\n        edited={edited}\n        editTimestamp={editTimestamp}\n        onCommentClick={() => {}}\n        onLikeClick={({ user }) => {\n          const userLikedIndex = likes.findIndex(x => x.id === user.id);\n          if (userLikedIndex !== -1) {\n            setLikes(oldLikes => {\n              const oldLikesArr = [...oldLikes];\n              oldLikesArr.splice(userLikedIndex, 1);\n              return oldLikesArr;\n            });\n            setLikeCount(curr => curr - 1);\n          } else {\n            setLikes(oldLikes => [user, ...oldLikes]);\n            setLikeCount(curr => curr + 1);\n          }\n          setLiked(curr => !curr);\n        }}\n        onLikeCountInteraction={getInitialLikes}\n        onLoadMoreLikes={!additionalLikeAdded ? generateNewLike : undefined}\n        likesLoading={likesLoading}\n        onUserClick={(_, clickEvent) => {\n          if (clickEvent) {\n            setPopoverTarget(clickEvent.target as Element);\n            setPopoverOpen(curr => !curr);\n          }\n        }}\n      />\n      {popoverTarget && (\n        <Popover show={popoverOpen} target={popoverTarget} placement='bottom' portal>\n          <CardContent>{fullname}</CardContent>\n        </Popover>\n      )}\n    </>\n  );\n\n  return renderFeed ? (\n    <Feed\n      title='Pulse'\n      onMentionClick={onMentionClick}\n      interactionRenderers={[MentionButtonConfig, HashtagButtonConfig]}\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      posts={[reply]}\n    />\n  ) : (\n    reply\n  );\n};\n\nexport const FeedReplyWithPresence: Story = () => {\n  return <FeedReplyDemo userStatus='active' />;\n};\n"]}

package/jsx/social/Feed/FeedReplyInput.stories.d.ts

@@ -1,15 +1,10 @@
-/// <reference types="react" />
-import { Meta } from '@storybook/react';
-import { FeedReplyInputProps, AttachedFiles } from '@pega/cosmos-react-social';
+import { Meta, Story } from '@storybook/react';
+import { FeedReplyInputProps } from '@pega/cosmos-react-social';
 declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
-export declare const FeedReplyInputDemo: ({ onSubmit, renderFeed }: {
-    onSubmit?: ((event: {
-        replyId: string;
-        value: string;
-        attachments: AttachedFiles[];
-        clear: () => void;
-    }) => void) | undefined;
-    renderFeed?: boolean | undefined;
-}) => JSX.Element;
+interface FeedReplyInputDemoProps {
+    onSubmit?: FeedReplyInputProps['onSubmit'];
+    renderFeed?: boolean;
+}
+export declare const FeedReplyInputDemo: Story<FeedReplyInputDemoProps>;
 //# sourceMappingURL=FeedReplyInput.stories.d.ts.map

package/jsx/social/Feed/FeedReplyInput.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FeedReplyInput.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/FeedReplyInput.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAIxC,OAAO,EAGL,mBAAmB,EACnB,aAAa,EACd,MAAM,2BAA2B,CAAC;;AAKnC,wBAGU;AAEV,eAAO,MAAM,kBAAkB;;;;;;;;iBA2F9B,CAAC"}
+{"version":3,"file":"FeedReplyInput.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/FeedReplyInput.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAI/C,OAAO,EAGL,mBAAmB,EAEpB,MAAM,2BAA2B,CAAC;;AAKnC,wBAGU;AAEV,UAAU,uBAAuB;IAC/B,QAAQ,CAAC,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;IAC3C,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,uBAAuB,CA0F7D,CAAC"}

package/jsx/social/Feed/FeedReplyInput.stories.jsx

@@ -19,12 +19,13 @@ export const FeedReplyInputDemo = ({ onSubmit, renderFeed = true }) => {
                 const searchWords = search.toLowerCase().split(' ');
                 return !!searchWords.every((word) => names.find((name) => name.startsWith(word)));
             })
-                .map(({ id, primary, secondary, visual }) => {
+                .map(({ id, primary, secondary, visual, href }) => {
                 return {
                     id,
                     primary,
                     secondary,
-                    visual
+                    visual,
+                    href
                 };
             });
             setSearchResults(mentions);
@@ -54,6 +55,6 @@ export const FeedReplyInputDemo = ({ onSubmit, renderFeed = true }) => {
             setAttachments([]);
             replyEvent.clear();
         }}/>);
-    return renderFeed ? (<Feed searchTypes={['user', 'case']} onDecoratorSearch={onSearch} searchResults={searchResults} userInfo={{ username: 'demo_user', fullname: 'Demo User' }} posts={[replyInput]}/>) : (replyInput);
+    return renderFeed ? (<Feed title='Pulse' searchTypes={['user', 'case']} onDecoratorSearch={onSearch} searchResults={searchResults} userInfo={{ username: 'demo_user', fullname: 'Demo User' }} posts={[replyInput]}/>) : (replyInput);
 };
 //# sourceMappingURL=FeedReplyInput.stories.jsx.map

package/jsx/social/Feed/FeedReplyInput.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"FeedReplyInput.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/FeedReplyInput.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAiB,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EACL,IAAI,EACJ,cAAc,EAGf,MAAM,2BAA2B,CAAC;AAGnC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE1D,eAAe;IACb,KAAK,EAAE,4BAA4B;IACnC,SAAS,EAAE,cAAc;CAClB,CAAC;AAEV,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EACjC,QAAQ,EACR,UAAU,GAAG,IAAI,EAIlB,EAAE,EAAE;IACH,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAkB,EAAE,CAAC,CAAC;IACxE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAkB,EAAE,CAAC,CAAC;IAEpE,MAAM,QAAQ,GAAG,CAAC,EAChB,IAAI,EACJ,MAAM,EACN,WAAW,EAKZ,EAAE,EAAE;QACH,IAAI,IAAI,KAAK,SAAS,EAAE;YACtB,MAAM,iBAAiB,GAAG,WAAW,KAAK,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC;YAE/E,MAAM,QAAQ,GAAoB,iBAAiB;iBAChD,MAAM,CAAC,CAAC,IAAkB,EAAE,EAAE;gBAC7B,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;gBACpD,MAAM,WAAW,GAAG,MAAM,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;gBACpD,OAAO,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,IAAY,EAAE,EAAE,CAC1C,KAAK,CAAC,IAAI,CAAC,CAAC,IAAY,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CACpD,CAAC;YACJ,CAAC,CAAC;iBACD,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE;gBAC1C,OAAO;oBACL,EAAE;oBACF,OAAO;oBACP,SAAS;oBACT,MAAM;iBACP,CAAC;YACJ,CAAC,CAAC,CAAC;YACL,gBAAgB,CAAC,QAAQ,CAAC,CAAC;SAC5B;aAAM;YACL,gBAAgB,CACd,CAAC,QAAQ,EAAE,SAAS,EAAE,MAAM,CAAC;iBAC1B,MAAM,CAAC,GAAG,CAAC,EAAE;gBACZ,OAAO,GAAG,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,CAAC;YAC1D,CAAC,CAAC;iBACD,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,CAC3C,CAAC;SACH;IACH,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,KAAsB,EAAE,EAAE;QAC9C,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YACnB,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,OAAO;gBAAE,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;YAEpF,IAAI,CAAC,QAAQ,GAAG,GAAG,EAAE;gBACnB,cAAc,CAAC,OAAO,CAAC,EAAE;oBACvB,OAAO,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC;gBACnD,CAAC,CAAC,CAAC;YACL,CAAC,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,cAAc,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CACjB,CAAC,cAAc,CACb,EAAE,CAAC,CAAC,GAAG,CAAC,CACR,YAAY,CAAC,cAAc,CAC3B,WAAW,CAAC,CAAC,WAAW,CAAC,CACzB,WAAW,CAAC,eAAe,CAC3B,YAAY,CAAC,CAAC,YAAY,CAAC,CAC3B,QAAQ,CAAC,CAAC,UAAU,CAAC,EAAE;YACrB,QAAQ,EAAE,CAAC,UAAU,CAAC,CAAC;YACvB,cAAc,CAAC,EAAE,CAAC,CAAC;YACnB,UAAU,CAAC,KAAK,EAAE,CAAC;QACrB,CAAC,CAAC,EACF,CACH,CAAC;IAEF,OAAO,UAAU,CAAC,CAAC,CAAC,CAClB,CAAC,IAAI,CACH,WAAW,CAAC,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAC9B,iBAAiB,CAAC,CAAC,QAAQ,CAAC,CAC5B,aAAa,CAAC,CAAC,aAAa,CAAC,CAC7B,QAAQ,CAAC,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC,CAC3D,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,EACpB,CACH,CAAC,CAAC,CAAC,CACF,UAAU,CACX,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Meta } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { MenuItemProps, useUID } from '@pega/cosmos-react-core';\nimport {\n  Feed,\n  FeedReplyInput,\n  FeedReplyInputProps,\n  AttachedFiles\n} from '@pega/cosmos-react-social';\nimport { GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { caseMentions, userMentions } from './Feed.mocks';\n\nexport default {\n  title: 'Social/Feed/FeedReplyInput',\n  component: FeedReplyInput\n} as Meta;\n\nexport const FeedReplyInputDemo = ({\n  onSubmit,\n  renderFeed = true\n}: {\n  onSubmit?: FeedReplyInputProps['onSubmit'];\n  renderFeed?: boolean;\n}) => {\n  const key = useUID();\n  const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n  const [attachments, setAttachments] = useState<AttachedFiles[]>([]);\n\n  const onSearch = ({\n    type,\n    search,\n    mentionType\n  }: {\n    type: 'mention' | 'tag';\n    search: string;\n    mentionType: string;\n  }) => {\n    if (type === 'mention') {\n      const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n      const mentions: MenuItemProps[] = availableMentions\n        .filter((user: GlimpseProps) => {\n          const names = user.primary.toLowerCase().split(' ');\n          const searchWords = search.toLowerCase().split(' ');\n          return !!searchWords.every((word: string) =>\n            names.find((name: string) => name.startsWith(word))\n          );\n        })\n        .map(({ id, primary, secondary, visual }) => {\n          return {\n            id,\n            primary,\n            secondary,\n            visual\n          };\n        });\n      setSearchResults(mentions);\n    } else {\n      setSearchResults(\n        ['cosmos', 'hashtag', 'pega']\n          .filter(tag => {\n            return tag.toLowerCase().includes(search.toLowerCase());\n          })\n          .map(tag => ({ id: tag, primary: tag }))\n      );\n    }\n  };\n\n  const onFilesAdded = (files: AttachedFiles[]) => {\n    files.forEach(file => {\n      if (file.type.split('/')[0] === 'image') file.thumbnail = URL.createObjectURL(file);\n\n      file.onDelete = () => {\n        setAttachments(current => {\n          return current.filter(x => x.name !== file.name);\n        });\n      };\n    });\n\n    setAttachments(files);\n  };\n\n  const replyInput = (\n    <FeedReplyInput\n      id={key}\n      commentLabel='Send Comment'\n      attachments={attachments}\n      placeholder='Add a comment'\n      onFilesAdded={onFilesAdded}\n      onSubmit={replyEvent => {\n        onSubmit?.(replyEvent);\n        setAttachments([]);\n        replyEvent.clear();\n      }}\n    />\n  );\n\n  return renderFeed ? (\n    <Feed\n      searchTypes={['user', 'case']}\n      onDecoratorSearch={onSearch}\n      searchResults={searchResults}\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      posts={[replyInput]}\n    />\n  ) : (\n    replyInput\n  );\n};\n"]}
+{"version":3,"file":"FeedReplyInput.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/FeedReplyInput.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { MenuItemProps, useUID } from '@pega/cosmos-react-core';\nimport {\n  Feed,\n  FeedReplyInput,\n  FeedReplyInputProps,\n  AttachedFiles\n} from '@pega/cosmos-react-social';\nimport { GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { caseMentions, userMentions } from './Feed.mocks';\n\nexport default {\n  title: 'Social/Feed/FeedReplyInput',\n  component: FeedReplyInput\n} as Meta;\n\ninterface FeedReplyInputDemoProps {\n  onSubmit?: FeedReplyInputProps['onSubmit'];\n  renderFeed?: boolean;\n}\n\nexport const FeedReplyInputDemo: Story<FeedReplyInputDemoProps> = ({\n  onSubmit,\n  renderFeed = true\n}: FeedReplyInputDemoProps) => {\n  const key = useUID();\n  const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n  const [attachments, setAttachments] = useState<AttachedFiles[]>([]);\n\n  const onSearch = ({\n    type,\n    search,\n    mentionType\n  }: {\n    type: 'mention' | 'tag';\n    search: string;\n    mentionType: string;\n  }) => {\n    if (type === 'mention') {\n      const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n      const mentions: MenuItemProps[] = availableMentions\n        .filter((user: GlimpseProps) => {\n          const names = user.primary.toLowerCase().split(' ');\n          const searchWords = search.toLowerCase().split(' ');\n          return !!searchWords.every((word: string) =>\n            names.find((name: string) => name.startsWith(word))\n          );\n        })\n        .map(({ id, primary, secondary, visual, href }) => {\n          return {\n            id,\n            primary,\n            secondary,\n            visual,\n            href\n          };\n        });\n      setSearchResults(mentions);\n    } else {\n      setSearchResults(\n        ['cosmos', 'hashtag', 'pega']\n          .filter(tag => {\n            return tag.toLowerCase().includes(search.toLowerCase());\n          })\n          .map(tag => ({ id: tag, primary: tag }))\n      );\n    }\n  };\n\n  const onFilesAdded = (files: AttachedFiles[]) => {\n    files.forEach(file => {\n      if (file.type.split('/')[0] === 'image') file.thumbnail = URL.createObjectURL(file);\n\n      file.onDelete = () => {\n        setAttachments(current => {\n          return current.filter(x => x.name !== file.name);\n        });\n      };\n    });\n\n    setAttachments(files);\n  };\n\n  const replyInput = (\n    <FeedReplyInput\n      id={key}\n      commentLabel='Send Comment'\n      attachments={attachments}\n      placeholder='Add a comment'\n      onFilesAdded={onFilesAdded}\n      onSubmit={replyEvent => {\n        onSubmit?.(replyEvent);\n        setAttachments([]);\n        replyEvent.clear();\n      }}\n    />\n  );\n\n  return renderFeed ? (\n    <Feed\n      title='Pulse'\n      searchTypes={['user', 'case']}\n      onDecoratorSearch={onSearch}\n      searchResults={searchResults}\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      posts={[replyInput]}\n    />\n  ) : (\n    replyInput\n  );\n};\n"]}

package/jsx/tools/Clipboard/Clipboard.mocks.d.ts

@@ -0,0 +1,6 @@
+import { FieldSummaryProps } from '@pega/cosmos-react-tools';
+import { StandardTreeProps } from '@pega/cosmos-react-core';
+export declare const allNodes: StandardTreeProps['nodes'];
+export declare const childNodes: StandardTreeProps['nodes'];
+export declare const getDetailsData: (id: string, cb?: (id: string) => void) => FieldSummaryProps | undefined;
+//# sourceMappingURL=Clipboard.mocks.d.ts.map

package/jsx/tools/Clipboard/Clipboard.mocks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Clipboard.mocks.d.ts","sourceRoot":"","sources":["../../../src/tools/Clipboard/Clipboard.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAAyB,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAEnF,eAAO,MAAM,QAAQ,EAAE,iBAAiB,CAAC,OAAO,CAsB/C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,iBAAiB,CAAC,OAAO,CAajD,CAAC;AAUF,eAAO,MAAM,cAAc,EAAE,CAC3B,EAAE,EAAE,MAAM,EACV,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,KACtB,iBAAiB,GAAG,SA0CxB,CAAC"}

package/jsx/tools/Clipboard/Clipboard.mocks.jsx

@@ -0,0 +1,81 @@
+import { Actions, Button, Flex } from '@pega/cosmos-react-core';
+export const allNodes = [
+    {
+        id: 'dataPage',
+        label: 'Data Pages',
+        nodes: [
+            {
+                id: 'D_pzPreferenceStore',
+                label: 'D_pzPreferenceStore',
+                nodes: []
+            },
+            {
+                id: 'D_creditScore',
+                label: 'D_Credit Score',
+                nodes: []
+            }
+        ]
+    },
+    {
+        id: 'systemPage',
+        label: 'System Pages',
+        nodes: []
+    }
+];
+export const childNodes = [
+    {
+        id: 'pxDPParameters',
+        label: 'pxDPParameters'
+    },
+    {
+        id: 'pyDevicePreviewSettings',
+        label: 'pyDevicePreviewSettings'
+    },
+    {
+        id: 'pySourcePage',
+        label: 'pySourcePage'
+    }
+];
+const primaryData = [
+    { id: 'field1', name: 'pxCommitDateTime', value: '20220303T121437.913 GMT' },
+    { id: 'field2', name: 'pxInsName', value: 'John.smith' },
+    { id: 'field3', name: 'pxObjClass', value: 'Data-Preference-Operator' },
+    { id: 'field4', name: 'pzInsKey', value: 'DATA-PREFERENCE-OPERATOR JOHN SMITH' }
+];
+export const getDetailsData = (id, cb) => {
+    const embeddedData = [
+        { id: 'pxDPParameters', name: 'pxDPParameters', onClick: cb },
+        { id: 'pyDevicePreviewSettings', name: 'pyDevicePreviewSettings', onClick: cb },
+        { id: 'pySourcePage', name: 'pySourcePage', onClick: cb }
+    ];
+    const response = {
+        primary: id,
+        secondary: [
+            { id: '1', name: 'ID', value: 'InterestRate' },
+            { id: '2', name: 'Rule type', value: 'Field' },
+            {
+                id: '3',
+                name: 'Scope',
+                value: 'O1XPTI-CCompass-Work-MortgageRequest'
+            },
+            { id: '4', name: 'Application', value: 'XCompass' }
+        ],
+        actions: (<Flex container>
+        <Button aria-label={`${id}-Secondary action`} variant='secondary'>
+          Secondary action
+        </Button>
+        <Button aria-label={`${id}-Primary action`} variant='primary'>
+          Primary action
+        </Button>
+        <Actions menuAt={1} items={[
+                {
+                    id: '1',
+                    text: 'Secondary action 2'
+                }
+            ]}/>
+      </Flex>),
+        fields: id === 'D_pzPreferenceStore' ? [...primaryData, ...embeddedData] : primaryData
+    };
+    return id === 'systemPage' || id === 'dataPage' ? undefined : response;
+};
+//# sourceMappingURL=Clipboard.mocks.jsx.map

package/jsx/tools/Clipboard/Clipboard.mocks.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Clipboard.mocks.jsx","sourceRoot":"","sources":["../../../src/tools/Clipboard/Clipboard.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FieldSummaryProps } from '@pega/cosmos-react-tools';\nimport { Actions, Button, Flex, StandardTreeProps } from '@pega/cosmos-react-core';\n\nexport const allNodes: StandardTreeProps['nodes'] = [\n  {\n    id: 'dataPage',\n    label: 'Data Pages',\n    nodes: [\n      {\n        id: 'D_pzPreferenceStore',\n        label: 'D_pzPreferenceStore',\n        nodes: []\n      },\n      {\n        id: 'D_creditScore',\n        label: 'D_Credit Score',\n        nodes: []\n      }\n    ]\n  },\n  {\n    id: 'systemPage',\n    label: 'System Pages',\n    nodes: []\n  }\n];\n\nexport const childNodes: StandardTreeProps['nodes'] = [\n  {\n    id: 'pxDPParameters',\n    label: 'pxDPParameters'\n  },\n  {\n    id: 'pyDevicePreviewSettings',\n    label: 'pyDevicePreviewSettings'\n  },\n  {\n    id: 'pySourcePage',\n    label: 'pySourcePage'\n  }\n];\n\nconst primaryData = [\n  { id: 'field1', name: 'pxCommitDateTime', value: '20220303T121437.913 GMT' },\n  { id: 'field2', name: 'pxInsName', value: 'John.smith' },\n  { id: 'field3', name: 'pxObjClass', value: 'Data-Preference-Operator' },\n  { id: 'field4', name: 'pzInsKey', value: 'DATA-PREFERENCE-OPERATOR JOHN SMITH' }\n];\n\n// cSpell:words XPTI\nexport const getDetailsData: (\n  id: string,\n  cb?: (id: string) => void\n) => FieldSummaryProps | undefined = (id, cb) => {\n  const embeddedData = [\n    { id: 'pxDPParameters', name: 'pxDPParameters', onClick: cb },\n    { id: 'pyDevicePreviewSettings', name: 'pyDevicePreviewSettings', onClick: cb },\n    { id: 'pySourcePage', name: 'pySourcePage', onClick: cb }\n  ];\n\n  const response = {\n    primary: id,\n    secondary: [\n      { id: '1', name: 'ID', value: 'InterestRate' },\n      { id: '2', name: 'Rule type', value: 'Field' },\n      {\n        id: '3',\n        name: 'Scope',\n        value: 'O1XPTI-CCompass-Work-MortgageRequest'\n      },\n      { id: '4', name: 'Application', value: 'XCompass' }\n    ],\n    actions: (\n      <Flex container>\n        <Button aria-label={`${id}-Secondary action`} variant='secondary'>\n          Secondary action\n        </Button>\n        <Button aria-label={`${id}-Primary action`} variant='primary'>\n          Primary action\n        </Button>\n        <Actions\n          menuAt={1}\n          items={[\n            {\n              id: '1',\n              text: 'Secondary action 2'\n            }\n          ]}\n        />\n      </Flex>\n    ),\n    fields: id === 'D_pzPreferenceStore' ? [...primaryData, ...embeddedData] : primaryData\n  };\n\n  return id === 'systemPage' || id === 'dataPage' ? undefined : response;\n};\n"]}

package/jsx/tools/Clipboard/Clipboard.stories.d.ts

@@ -0,0 +1,6 @@
+import { Story, Meta } from '@storybook/react';
+import { ClipboardProps } from '@pega/cosmos-react-tools';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const ClipboardViewerDemo: Story<ClipboardProps>;
+//# sourceMappingURL=Clipboard.stories.d.ts.map

package/jsx/tools/Clipboard/Clipboard.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Clipboard.stories.d.ts","sourceRoot":"","sources":["../../../src/tools/Clipboard/Clipboard.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAa,cAAc,EAAqB,MAAM,0BAA0B,CAAC;;AAKxF,wBAMU;AAEV,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,cAAc,CAuFrD,CAAC"}

package/jsx/tools/Clipboard/Clipboard.stories.jsx

@@ -0,0 +1,69 @@
+import { useState, useEffect } from 'react';
+import { Clipboard } from '@pega/cosmos-react-tools';
+import { treeHelpers } from '@pega/cosmos-react-core';
+import { allNodes, childNodes, getDetailsData } from './Clipboard.mocks';
+export default {
+    title: 'Tools/Clipboard',
+    component: Clipboard,
+    parameters: {
+        layout: 'fullscreen'
+    }
+};
+export const ClipboardViewerDemo = () => {
+    const [nodes, setNodes] = useState(allNodes);
+    const [currentNodeId, setCurrentNodeId] = useState(allNodes[0].id);
+    const [pageDetails, setPageDetails] = useState();
+    const timeouts = [];
+    useEffect(() => {
+        return () => {
+            timeouts.forEach((timeout) => {
+                clearTimeout(timeout);
+            });
+        };
+    }, []);
+    const updatePageDetails = (id, cb) => {
+        setPageDetails({ primary: '', fields: [], loading: true });
+        const response = getDetailsData(id, cb);
+        timeouts.push(setTimeout(() => setPageDetails(response), 1300));
+    };
+    const updateActiveParentNode = (id) => {
+        setNodes(tree => treeHelpers.mapNode(tree, id, node => {
+            return {
+                ...node,
+                expanded: !node.expanded,
+                loading: node.nodes?.length === 0
+            };
+        }));
+    };
+    const loadChildNodes = (id) => {
+        timeouts.push(setTimeout(() => {
+            setNodes(tree => treeHelpers.mapNode(tree, id, node => node.nodes?.length === 0
+                ? {
+                    ...node,
+                    loading: false,
+                    nodes: id === 'D_pzPreferenceStore' ? childNodes : undefined
+                }
+                : node));
+        }, 1000));
+    };
+    const onNodeClick = (nodeId, e) => {
+        const node = treeHelpers.getNode(nodes, nodeId);
+        setCurrentNodeId(nodeId);
+        if (node?.nodes && node?.nodes?.length >= 0) {
+            updateActiveParentNode(nodeId);
+        }
+        loadChildNodes(nodeId);
+        if (['ArrowRight', 'ArrowLeft'].includes(e.key))
+            return;
+        updatePageDetails(nodeId, id => {
+            onNodeClick(id, e);
+            setNodes(tree => treeHelpers.expandTo(tree, nodeId));
+        });
+    };
+    return (<Clipboard navigation={{
+            nodes,
+            currentNodeId,
+            onNodeClick
+        }} content={pageDetails} lastUpdated='Last updated: Less than a minute ago'/>);
+};
+//# sourceMappingURL=Clipboard.stories.jsx.map

package/jsx/tools/Clipboard/Clipboard.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"Clipboard.stories.jsx","sourceRoot":"","sources":["../../../src/tools/Clipboard/Clipboard.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Story, Meta } from '@storybook/react';\nimport { useState, MouseEvent, KeyboardEvent, useEffect } from 'react';\n\nimport { Clipboard, ClipboardProps, FieldSummaryProps } from '@pega/cosmos-react-tools';\nimport { treeHelpers } from '@pega/cosmos-react-core';\n\nimport { allNodes, childNodes, getDetailsData } from './Clipboard.mocks';\n\nexport default {\n  title: 'Tools/Clipboard',\n  component: Clipboard,\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\nexport const ClipboardViewerDemo: Story<ClipboardProps> = () => {\n  const [nodes, setNodes] = useState(allNodes);\n  const [currentNodeId, setCurrentNodeId] = useState(allNodes[0].id);\n  const [pageDetails, setPageDetails] = useState<FieldSummaryProps | undefined>();\n  const timeouts: ReturnType<typeof setTimeout>[] = [];\n\n  useEffect(() => {\n    return () => {\n      timeouts.forEach((timeout: ReturnType<typeof setTimeout>) => {\n        clearTimeout(timeout);\n      });\n    };\n  }, []);\n\n  // Update main content based on id\n  const updatePageDetails = (id: string, cb?: (id: string) => void) => {\n    setPageDetails({ primary: '', fields: [], loading: true });\n    const response = getDetailsData(id, cb);\n    timeouts.push(setTimeout(() => setPageDetails(response), 1300));\n  };\n\n  // set loading and expanded to selected node if it is a parent\n  const updateActiveParentNode = (id: string) => {\n    setNodes(tree =>\n      treeHelpers.mapNode(tree, id, node => {\n        return {\n          ...node,\n          expanded: !node.expanded,\n          loading: node.nodes?.length === 0\n        };\n      })\n    );\n  };\n\n  // get child nodes for the parent and set loading to false\n  const loadChildNodes = (id: string) => {\n    timeouts.push(\n      setTimeout(() => {\n        setNodes(tree =>\n          treeHelpers.mapNode(tree, id, node =>\n            node.nodes?.length === 0\n              ? {\n                  ...node,\n                  loading: false,\n                  nodes: id === 'D_pzPreferenceStore' ? childNodes : undefined\n                }\n              : node\n          )\n        );\n      }, 1000)\n    );\n  };\n\n  const onNodeClick = (nodeId: string, e: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => {\n    // get clicked node details and set it as active\n    const node = treeHelpers.getNode(nodes, nodeId);\n    setCurrentNodeId(nodeId);\n\n    // expand node if it is a parent and shows loading indicator for child\n    if (node?.nodes && node?.nodes?.length >= 0) {\n      updateActiveParentNode(nodeId);\n    }\n\n    // get child nodes and set new nodes to state\n    loadChildNodes(nodeId);\n\n    // Do not change maincontent if tree is navigated using arrow buttons\n    if (['ArrowRight', 'ArrowLeft'].includes((e as KeyboardEvent).key)) return;\n\n    // set main content based on active node\n    updatePageDetails(nodeId, id => {\n      onNodeClick(id, e);\n      setNodes(tree => treeHelpers.expandTo(tree, nodeId));\n    });\n  };\n\n  return (\n    <Clipboard\n      navigation={{\n        nodes,\n        currentNodeId,\n        onNodeClick\n      }}\n      content={pageDetails}\n      lastUpdated='Last updated: Less than a minute ago'\n    />\n  );\n};\n"]}

package/jsx/tools/DevTools/DevTools.mocks.d.ts

@@ -0,0 +1,3 @@
+import { footerMenuMock, footerTabsMockContent, footerTabsMock } from '../PreviewShell/PreviewShell.mocks';
+export { footerMenuMock, footerTabsMockContent, footerTabsMock };
+//# sourceMappingURL=DevTools.mocks.d.ts.map

package/jsx/tools/DevTools/DevTools.mocks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DevTools.mocks.d.ts","sourceRoot":"","sources":["../../../src/tools/DevTools/DevTools.mocks.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,qBAAqB,EACrB,cAAc,EACf,MAAM,oCAAoC,CAAC;AAE5C,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,cAAc,EAAE,CAAC"}

package/jsx/tools/DevTools/DevTools.mocks.js

@@ -0,0 +1,3 @@
+import { footerMenuMock, footerTabsMockContent, footerTabsMock } from '../PreviewShell/PreviewShell.mocks';
+export { footerMenuMock, footerTabsMockContent, footerTabsMock };
+//# sourceMappingURL=DevTools.mocks.js.map