@ynput/ayon-frontend-shared 0.2.28 → 0.2.30

package/dist/shared/src/containers/Feed/components/ActivityComment/ActivityComment.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityComment.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useCallback, useMemo } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport emoji from 'remark-emoji'\nimport remarkGfm from 'remark-gfm'\nimport remarkDirective from 'remark-directive'\nimport remarkDirectiveRehype from 'remark-directive-rehype'\n\nimport CommentInput from '../CommentInput/CommentInput'\nimport Reactions from '../ReactionContainer/Reactions'\nimport { Reaction } from '../ReactionContainer/types'\nimport useReferenceTooltip from '../../hooks/useReferenceTooltip'\nimport FilesGrid, { FilesGridProps } from '../FilesGrid/FilesGrid'\n\nimport { getTextRefs } from '../CommentInput/quillToMarkdown'\nimport * as Styled from './ActivityComment.styled'\nimport CommentWrapper from './CommentWrapper'\nimport { aTag, blockquoteTag, codeTag, inputTag } from './ActivityMarkdownComponents'\nimport { mapGraphQLReactions } from './mappers'\nimport { Icon } from '@ynput/ayon-react-components'\nimport ActivityStatus from '../ActivityStatus/ActivityStatus'\nimport { useFeedContext } from '../../context/FeedContext'\nimport { confirmDelete } from '../../../../util'\nimport ActivityHeader, { ActivityHeaderProps } from '../ActivityHeader/ActivityHeader'\nimport type { Status } from '../../../ProjectTreeTable/types/project'\nimport { SavedAnnotationMetadata } from '../../index'\nimport { useDetailsPanelContext } from '@shared/context'\n\ntype Props = {\n  activity: any\n  onCheckChange?: Function\n  onDelete?: (activityId: string, entityId: string, refs: any) => Promise<void>\n  onUpdate?: Function\n  projectInfo: any\n  editProps?: {\n    disabled: boolean\n    isLoading: boolean\n  }\n  projectName: string\n  entityType: string\n  onReferenceClick?: ActivityHeaderProps['onReferenceClick']\n  onFileExpand?: FilesGridProps['onExpand']\n  showOrigin?: boolean\n  isHighlighted?: boolean\n  readOnly?: boolean\n  statuses: Status[]\n}\n\nconst ActivityComment = ({\n  activity = {},\n  onCheckChange,\n  onDelete,\n  onUpdate,\n  projectInfo,\n  editProps,\n  projectName,\n  entityType,\n  onReferenceClick,\n  onFileExpand,\n  showOrigin,\n  isHighlighted,\n  readOnly,\n  statuses = [],\n}: Props) => {\n  const { userName, createReaction, deleteReaction } = useFeedContext()\n\n  let {\n    body,\n    authorName,\n    authorFullName,\n    createdAt,\n    referenceType,\n    entityId,\n    activityId,\n    author,\n    isOwner,\n    files = [],\n    origin,\n  } = activity\n  if (!authorName) authorName = author?.name || ''\n  if (!authorFullName) authorFullName = author?.fullName || authorName\n\n  const { editingId, setEditingId } = useFeedContext()\n  const { onGoToFrame, setHighlightedActivities } = useDetailsPanelContext()\n\n  const handleEditComment = () => {\n    setEditingId(activityId)\n  }\n\n  const handleEditCancel = () => {\n    // close the edit comment\n    setEditingId(null)\n  }\n\n  const handleSave = async (value: any, files: any) => {\n    await onUpdate?.(value, files)\n    setEditingId(null)\n  }\n\n  const isEditing = editingId === activityId\n\n  const isRef = referenceType !== 'origin' || showOrigin\n\n  const handleDelete = async () => {\n    const refs = getTextRefs(body)\n\n    // if the comment is a reference, (it's origin is not the entity)\n    // we need to delete the reference from the origin as well\n    // add it to the refs to delete\n    if (isRef && origin) {\n      refs.push({ id: origin.id, type: origin.type })\n    }\n\n    // note: body is used to match other refs to delete\n    onDelete && (await onDelete(activityId, entityId, refs))\n  }\n\n  const deleteConfirmation = () => {\n    confirmDelete({\n      title: 'Delete comment',\n      message: 'Are you sure you want to delete this comment?',\n      accept: async () => {\n        await handleDelete()\n      },\n    })\n  }\n\n  const [, setRefTooltip] = useReferenceTooltip()\n\n  const mappedReactions = useMemo(\n    () => mapGraphQLReactions(activity.reactions, userName),\n    [[...(activity.reactions || [])]],\n  )\n\n  const reactionChangeHandler = (reaction: Reaction) => {\n    if (reaction.isActive) {\n      createReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        createReactionModel: {\n          reaction: reaction.type,\n        },\n      })\n    } else {\n      deleteReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        reaction: reaction.type,\n      })\n    }\n  }\n\n  const onAnnotationClick = useCallback(\n    (file: any) => {\n      if (!file.annotation) return\n      // annotation frame numbers are 1-based\n      onGoToFrame?.((file.annotation as SavedAnnotationMetadata).range[0])\n      setHighlightedActivities([activityId])\n    },\n    [onGoToFrame],\n  )\n\n  return (\n    <>\n      <Styled.Comment\n        className={clsx('comment', { isOwner, isEditing, isHighlighted })}\n        id={activityId}\n      >\n        <ActivityHeader\n          name={authorName}\n          fullName={authorFullName}\n          date={createdAt}\n          isRef={isRef}\n          activity={activity}\n          // projectInfo={projectInfo}\n          projectName={projectName}\n          entityType={entityType}\n          onReferenceClick={onReferenceClick}\n          onReferenceTooltip={setRefTooltip}\n          children={undefined}\n        />\n        <Styled.Body className={clsx('comment-body', { isEditing })}>\n          {!readOnly && (\n            <Styled.Tools className={'tools'}>\n              {isOwner && onDelete && (\n                <Styled.ToolButton\n                  icon=\"delete\"\n                  onClick={deleteConfirmation}\n                  tooltip=\"Delete comment\"\n                />\n              )}\n              {isOwner && handleEditComment && (\n                <Styled.ToolButton icon=\"edit_square\" onClick={handleEditComment} />\n              )}\n            </Styled.Tools>\n          )}\n          {isEditing ? (\n            <CommentInput\n              initValue={body}\n              initFiles={files}\n              isEditing\n              onClose={handleEditCancel}\n              onSubmit={handleSave}\n              isOpen={true}\n              {...editProps}\n            />\n          ) : (\n            <>\n              <CommentWrapper>\n                <ReactMarkdown\n                  remarkPlugins={[remarkGfm, emoji, remarkDirective, remarkDirectiveRehype]}\n                  urlTransform={(url) => url}\n                  components={{\n                    // a links\n                    // @ts-ignore\n                    a: (props) =>\n                      // @ts-ignore\n                      aTag(props, {\n                        entityId,\n                        projectName,\n                        projectInfo,\n                        onReferenceClick,\n                        onReferenceTooltip: setRefTooltip,\n                        activityId,\n                      }),\n                    // checkbox inputs\n                    // @ts-ignore\n                    input: (props) => inputTag(props, { activity, onCheckChange }),\n                    // code syntax highlighting\n                    // eslint-disable-next-line\n                    // @ts-ignore\n                    code: (props) => codeTag(props),\n                    // @ts-ignore\n                    blockquote: (props) => blockquoteTag(props),\n                    // @ts-ignore\n                    tip: (props) => (\n                      <Styled.Tip>\n                        <Icon icon=\"info\" />\n                        {props.children}\n                      </Styled.Tip>\n                    ),\n                    // @ts-ignore\n                    status: (props) => {\n                      return (\n                        <ActivityStatus name={props.id} statuses={statuses}>\n                          {props.children}\n                        </ActivityStatus>\n                      )\n                    },\n                  }}\n                >\n                  {body}\n                </ReactMarkdown>\n              </CommentWrapper>\n              {/* file uploads */}\n              {/* @ts-ignore */}\n              <FilesGrid\n                files={files}\n                isCompact={files.length > 6}\n                activityId={activityId}\n                projectName={projectName}\n                isDownloadable\n                onExpand={onFileExpand}\n                onAnnotationClick={onAnnotationClick}\n                onRemove={undefined}\n              />\n            </>\n          )}\n\n          {!isEditing && (\n            <div style={{ marginTop: '16px' }}>\n              {mappedReactions && (\n                <Reactions\n                  reactions={mappedReactions}\n                  changeHandler={reactionChangeHandler}\n                  readOnly={readOnly}\n                />\n              )}\n            </div>\n          )}\n        </Styled.Body>\n      </Styled.Comment>\n    </>\n  )\n}\n\nexport default ActivityComment\n"],"names":["ActivityComment","activity","onCheckChange","onDelete","onUpdate","projectInfo","editProps","projectName","entityType","onReferenceClick","onFileExpand","showOrigin","isHighlighted","readOnly","statuses","userName","createReaction","deleteReaction","useFeedContext","body","authorName","authorFullName","createdAt","referenceType","entityId","activityId","author","isOwner","files","origin","editingId","setEditingId","onGoToFrame","setHighlightedActivities","useDetailsPanelContext","handleEditComment","handleEditCancel","handleSave","value","isEditing","isRef","handleDelete","refs","getTextRefs","deleteConfirmation","confirmDelete","setRefTooltip","useReferenceTooltip","mappedReactions","useMemo","mapGraphQLReactions","reactionChangeHandler","reaction","onAnnotationClick","useCallback","file","jsx","Fragment","jsxs","Styled.Comment","clsx","ActivityHeader","Styled.Body","Styled.Tools","Styled.ToolButton","CommentInput","CommentWrapper","ReactMarkdown","remarkGfm","emoji","remarkDirective","remarkDirectiveRehype","url","props","aTag","inputTag","codeTag","blockquoteTag","Styled.Tip","Icon","ActivityStatus","FilesGrid","Reactions"],"mappings":"6lDAgDA,MAAMA,GAAkB,CAAC,CACvB,SAAAC,EAAW,CAAC,EACZ,cAAAC,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,GACA,UAAAC,EACA,YAAAC,EACA,WAAAC,EACA,iBAAAC,EACA,aAAAC,EACA,WAAAC,EACA,cAAAC,EACA,SAAAC,EACA,SAAAC,EAAW,CAAA,CACb,IAAa,CACX,KAAM,CAAE,SAAAC,EAAU,eAAAC,EAAgB,eAAAC,CAAA,EAAmBC,EAAAA,eAAe,EAEhE,GAAA,CACF,KAAAC,EACA,WAAAC,EACA,eAAAC,EACA,UAAAC,EACA,cAAAC,EACA,SAAAC,EACA,WAAAC,EACA,OAAAC,EACA,QAAAC,EACA,MAAAC,EAAQ,CAAC,EACT,OAAAC,CAAA,EACE5B,EACCmB,IAAyBA,GAAAM,GAAA,YAAAA,EAAQ,OAAQ,IACzCL,IAAiCA,GAAAK,GAAA,YAAAA,EAAQ,WAAYN,GAE1D,KAAM,CAAE,UAAAU,EAAW,aAAAC,CAAa,EAAIb,iBAAe,EAC7C,CAAE,YAAAc,EAAa,yBAAAC,CAAyB,EAAIC,0BAAuB,EAEnEC,EAAoB,IAAM,CAC9BJ,EAAaN,CAAU,CACzB,EAEMW,EAAmB,IAAM,CAE7BL,EAAa,IAAI,CACnB,EAEMM,EAAa,MAAOC,EAAYV,IAAe,CAC7C,MAAAxB,GAAA,YAAAA,EAAWkC,EAAOV,IACxBG,EAAa,IAAI,CACnB,EAEMQ,EAAYT,IAAcL,EAE1Be,EAAQjB,IAAkB,UAAYZ,EAEtC8B,EAAe,SAAY,CACzB,MAAAC,EAAOC,eAAYxB,CAAI,EAKzBqB,GAASX,GACNa,EAAA,KAAK,CAAE,GAAIb,EAAO,GAAI,KAAMA,EAAO,KAAM,EAIhD1B,GAAa,MAAMA,EAASsB,EAAYD,EAAUkB,CAAI,CACxD,EAEME,EAAqB,IAAM,CACjBC,iBAAA,CACZ,MAAO,iBACP,QAAS,gDACT,OAAQ,SAAY,CAClB,MAAMJ,EAAa,CAAA,CACrB,CACD,CACH,EAEM,CAAG,CAAAK,CAAa,EAAIC,GAAoB,EAExCC,EAAkBC,EAAA,QACtB,IAAMC,uBAAoBjD,EAAS,UAAWc,CAAQ,EACtD,CAAC,CAAC,GAAId,EAAS,WAAa,EAAG,CAAC,CAClC,EAEMkD,EAAyBC,GAAuB,CAChDA,EAAS,SACIpC,EAAA,CACb,YAAAT,EAEA,SAAAQ,EACA,WAAAU,EACA,oBAAqB,CACnB,SAAU2B,EAAS,IAAA,CACrB,CACD,EAEcnC,EAAA,CACb,YAAAV,EAEA,SAAAQ,EACA,WAAAU,EACA,SAAU2B,EAAS,IAAA,CACpB,CAEL,EAEMC,EAAoBC,EAAA,YACvBC,GAAc,CACRA,EAAK,aAEVvB,GAAA,MAAAA,EAAeuB,EAAK,WAAuC,MAAM,CAAC,GACzCtB,EAAA,CAACR,CAAU,CAAC,EACvC,EACA,CAACO,CAAW,CACd,EAEA,OAEIwB,wBAAAC,EAAAA,kBAAAA,SAAA,CAAA,SAAAC,EAAA,kBAAA,KAACC,EAAO,QAAP,CACC,UAAWC,EAAK,UAAW,CAAE,QAAAjC,EAAS,UAAAY,EAAW,cAAA3B,EAAe,EAChE,GAAIa,EAEJ,SAAA,CAAA+B,EAAA,kBAAA,IAACK,GAAA,CACC,KAAMzC,EACN,SAAUC,EACV,KAAMC,EACN,MAAAkB,EACA,SAAAvC,EAEA,YAAAM,EACA,WAAAC,EACA,iBAAAC,EACA,mBAAoBqC,EACpB,SAAU,MAAA,CACZ,EACAY,yBAACI,EAAAA,KAAA,CAAY,UAAWF,EAAK,eAAgB,CAAE,UAAArB,EAAW,EACvD,SAAA,CAAA,CAAC1B,GACC6C,EAAAA,kBAAAA,KAAAK,EAAAA,MAAA,CAAa,UAAW,QACtB,SAAA,CAAApC,GAAWxB,GACVqD,EAAA,kBAAA,IAACQ,EAAO,WAAP,CACC,KAAK,SACL,QAASpB,EACT,QAAQ,gBAAA,CACV,EAEDjB,GAAWQ,GACTqB,EAAAA,kBAAAA,IAAAQ,aAAA,CAAkB,KAAK,cAAc,QAAS7B,CAAmB,CAAA,CAAA,EAEtE,EAEDI,EACCiB,EAAA,kBAAA,IAACS,GAAA,QAAA,CACC,UAAW9C,EACX,UAAWS,EACX,UAAS,GACT,QAASQ,EACT,SAAUC,EACV,OAAQ,GACP,GAAG/B,CAAA,CAAA,EAIJoD,EAAA,kBAAA,KAAAD,6BAAA,CAAA,SAAA,CAAAD,wBAACU,GACC,CAAA,SAAAV,EAAA,kBAAA,IAACW,EAAA,CACC,cAAe,CAACC,EAAWC,EAAOC,EAAiBC,EAAqB,EACxE,aAAeC,GAAQA,EACvB,WAAY,CAGV,EAAIC,GAEFC,EAAAA,KAAKD,EAAO,CACV,SAAAjD,EACA,YAAAjB,EAEA,iBAAAE,EACA,mBAAoBqC,EACpB,WAAArB,CACD,CAAA,EAGH,MAAQgD,GAAUE,EAAA,SAASF,EAAO,CAAE,SAAAxE,EAAU,cAAAC,EAAe,EAI7D,KAAOuE,GAAUG,EAAA,QAAQH,CAAK,EAE9B,WAAaA,GAAUI,EAAA,cAAcJ,CAAK,EAE1C,IAAMA,GACHf,EAAA,kBAAA,KAAAoB,MAAA,CACC,SAAA,CAACtB,EAAAA,kBAAAA,IAAAuB,GAAA,KAAA,CAAK,KAAK,MAAO,CAAA,EACjBN,EAAM,QAAA,EACT,EAGF,OAASA,2BAEJO,GAAe,CAAA,KAAMP,EAAM,GAAI,SAAA3D,EAC7B,WAAM,SACT,CAGN,EAEC,SAAAK,CAAA,CAAA,EAEL,EAGAqC,EAAA,kBAAA,IAACyB,GAAA,CACC,MAAArD,EACA,UAAWA,EAAM,OAAS,EAC1B,WAAAH,EACA,YAAAlB,EACA,eAAc,GACd,SAAUG,EACV,kBAAA2C,EACA,SAAU,MAAA,CAAA,CACZ,EACF,EAGD,CAACd,GACCiB,EAAAA,kBAAAA,IAAA,MAAA,CAAI,MAAO,CAAE,UAAW,MAAO,EAC7B,SACCR,GAAAQ,EAAA,kBAAA,IAAC0B,GAAA,CACC,UAAWlC,EACX,cAAeG,EACf,SAAAtC,CAAA,CAAA,CAGN,CAAA,CAAA,CAEJ,CAAA,CAAA,CAAA,CAAA,EAEJ,CAEJ"}
+{"version":3,"file":"ActivityComment.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useCallback, useMemo } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport emoji from 'remark-emoji'\nimport remarkGfm from 'remark-gfm'\nimport remarkDirective from 'remark-directive'\nimport remarkDirectiveRehype from 'remark-directive-rehype'\n\nimport CommentInput from '../CommentInput/CommentInput'\nimport Reactions from '../ReactionContainer/Reactions'\nimport { Reaction } from '../ReactionContainer/types'\nimport useReferenceTooltip from '../../hooks/useReferenceTooltip'\nimport FilesGrid, { FilesGridProps } from '../FilesGrid/FilesGrid'\n\nimport { getTextRefs } from '../CommentInput/quillToMarkdown'\nimport * as Styled from './ActivityComment.styled'\nimport CommentWrapper from './CommentWrapper'\nimport { aTag, blockquoteTag, codeTag, inputTag } from './ActivityMarkdownComponents'\nimport { mapGraphQLReactions } from './mappers'\nimport { Icon } from '@ynput/ayon-react-components'\nimport ActivityStatus from '../ActivityStatus/ActivityStatus'\nimport { useFeedContext } from '../../context/FeedContext'\nimport { confirmDelete } from '../../../../util'\nimport ActivityHeader, { ActivityHeaderProps } from '../ActivityHeader/ActivityHeader'\nimport type { Status } from '../../../ProjectTreeTable/types/project'\nimport { SavedAnnotationMetadata } from '../../index'\nimport { useDetailsPanelContext } from '@shared/context'\n\ntype Props = {\n  activity: any\n  onCheckChange?: Function\n  onDelete?: (activityId: string, entityId: string, refs: any) => Promise<void>\n  onUpdate?: Function\n  projectInfo: any\n  editProps?: {\n    disabled: boolean\n    isLoading: boolean\n  }\n  projectName: string\n  entityType: string\n  onReferenceClick?: ActivityHeaderProps['onReferenceClick']\n  onFileExpand?: FilesGridProps['onExpand']\n  showOrigin?: boolean\n  isHighlighted?: boolean\n  readOnly?: boolean\n  statuses: Status[]\n}\n\nconst ActivityComment = ({\n  activity = {},\n  onCheckChange,\n  onDelete,\n  onUpdate,\n  projectInfo,\n  editProps,\n  projectName,\n  entityType,\n  onReferenceClick,\n  onFileExpand,\n  showOrigin,\n  isHighlighted,\n  readOnly,\n  statuses = [],\n}: Props) => {\n  const { userName, createReaction, deleteReaction } = useFeedContext()\n\n  let {\n    body,\n    authorName,\n    authorFullName,\n    createdAt,\n    referenceType,\n    entityId,\n    activityId,\n    author,\n    isOwner,\n    files = [],\n    origin,\n  } = activity\n  if (!authorName) authorName = author?.name || ''\n  if (!authorFullName) authorFullName = author?.fullName || authorName\n\n  const { editingId, setEditingId } = useFeedContext()\n  const { onGoToFrame, setHighlightedActivities } = useDetailsPanelContext()\n\n  const handleEditComment = () => {\n    setEditingId(activityId)\n  }\n\n  const handleEditCancel = () => {\n    // close the edit comment\n    setEditingId(null)\n  }\n\n  const handleSave = async (value: any, files: any) => {\n    await onUpdate?.(value, files)\n    setEditingId(null)\n  }\n\n  const isEditing = editingId === activityId\n\n  const isRef = referenceType !== 'origin' || showOrigin\n\n  const handleDelete = async () => {\n    const refs = getTextRefs(body)\n\n    // if the comment is a reference, (it's origin is not the entity)\n    // we need to delete the reference from the origin as well\n    // add it to the refs to delete\n    if (isRef && origin) {\n      refs.push({ id: origin.id, type: origin.type })\n    }\n\n    // note: body is used to match other refs to delete\n    onDelete && (await onDelete(activityId, entityId, refs))\n  }\n\n  const deleteConfirmation = () => {\n    confirmDelete({\n      title: 'Delete comment',\n      message: 'Are you sure you want to delete this comment?',\n      accept: async () => {\n        await handleDelete()\n      },\n    })\n  }\n\n  const [, setRefTooltip] = useReferenceTooltip()\n\n  const mappedReactions = useMemo(\n    () => mapGraphQLReactions(activity.reactions, userName),\n    [[...(activity.reactions || [])]],\n  )\n\n  const reactionChangeHandler = (reaction: Reaction) => {\n    if (reaction.isActive) {\n      createReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        createReactionModel: {\n          reaction: reaction.type,\n        },\n      })\n    } else {\n      deleteReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        reaction: reaction.type,\n      })\n    }\n  }\n\n  const onAnnotationClick = useCallback(\n    (file: any) => {\n      if (!file.annotation) return\n      // annotation frame numbers are 1-based\n      onGoToFrame?.((file.annotation as SavedAnnotationMetadata).range[0])\n      setHighlightedActivities([activityId])\n    },\n    [onGoToFrame],\n  )\n\n  return (\n    <>\n      <Styled.Comment\n        className={clsx('comment', { isOwner, isEditing, isHighlighted })}\n        id={activityId}\n      >\n        <ActivityHeader\n          name={authorName}\n          fullName={authorFullName}\n          date={createdAt}\n          isRef={isRef}\n          activity={activity}\n          // projectInfo={projectInfo}\n          projectName={projectName}\n          entityType={entityType}\n          onReferenceClick={onReferenceClick}\n          onReferenceTooltip={setRefTooltip}\n          children={undefined}\n        />\n        <Styled.Body className={clsx('comment-body', { isEditing })}>\n          {!readOnly && (\n            <Styled.Tools className={'tools'}>\n              {isOwner && onDelete && (\n                <Styled.ToolButton\n                  icon=\"delete\"\n                  onClick={deleteConfirmation}\n                  tooltip=\"Delete comment\"\n                />\n              )}\n              {isOwner && handleEditComment && (\n                <Styled.ToolButton icon=\"edit_square\" onClick={handleEditComment} />\n              )}\n            </Styled.Tools>\n          )}\n          {isEditing ? (\n            <CommentInput\n              initValue={body}\n              initFiles={files}\n              isEditing\n              onClose={handleEditCancel}\n              onSubmit={handleSave}\n              isOpen={true}\n              {...editProps}\n            />\n          ) : (\n            <>\n              <CommentWrapper>\n                <ReactMarkdown\n                  remarkPlugins={[remarkGfm, emoji, remarkDirective, remarkDirectiveRehype]}\n                  urlTransform={(url) => url}\n                  components={{\n                    // a links\n                    // @ts-ignore\n                    a: (props) =>\n                      // @ts-ignore\n                      aTag(props, {\n                        entityId,\n                        projectName,\n                        projectInfo,\n                        onReferenceClick,\n                        onReferenceTooltip: setRefTooltip,\n                        activityId,\n                      }),\n                    // checkbox inputs\n                    // @ts-ignore\n                    input: (props) => inputTag(props, { activity, onCheckChange }),\n                    // code syntax highlighting\n                    // eslint-disable-next-line\n                    // @ts-ignore\n                    code: (props) => codeTag(props),\n                    // @ts-ignore\n                    blockquote: (props) => blockquoteTag(props),\n                    // @ts-ignore\n                    tip: (props) => (\n                      <Styled.Tip>\n                        <Icon icon=\"info\" />\n                        {props.children}\n                      </Styled.Tip>\n                    ),\n                    // @ts-ignore\n                    status: (props) => {\n                      return (\n                        <ActivityStatus name={props.id} statuses={statuses}>\n                          {props.children}\n                        </ActivityStatus>\n                      )\n                    },\n                  }}\n                >\n                  {body}\n                </ReactMarkdown>\n              </CommentWrapper>\n              {/* file uploads */}\n              {/* @ts-ignore */}\n              <FilesGrid\n                files={files}\n                isCompact={files.length > 6}\n                activityId={activityId}\n                projectName={projectName}\n                isDownloadable\n                onExpand={onFileExpand}\n                onAnnotationClick={onAnnotationClick}\n                onRemove={undefined}\n              />\n            </>\n          )}\n\n          {!isEditing && (\n            <div style={{ marginTop: '16px' }}>\n              {mappedReactions && (\n                <Reactions\n                  reactions={mappedReactions}\n                  changeHandler={reactionChangeHandler}\n                  readOnly={readOnly}\n                />\n              )}\n            </div>\n          )}\n        </Styled.Body>\n      </Styled.Comment>\n    </>\n  )\n}\n\nexport default ActivityComment\n"],"names":["ActivityComment","activity","onCheckChange","onDelete","onUpdate","projectInfo","editProps","projectName","entityType","onReferenceClick","onFileExpand","showOrigin","isHighlighted","readOnly","statuses","userName","createReaction","deleteReaction","useFeedContext","body","authorName","authorFullName","createdAt","referenceType","entityId","activityId","author","isOwner","files","origin","editingId","setEditingId","onGoToFrame","setHighlightedActivities","useDetailsPanelContext","handleEditComment","handleEditCancel","handleSave","value","isEditing","isRef","handleDelete","refs","getTextRefs","deleteConfirmation","confirmDelete","setRefTooltip","useReferenceTooltip","mappedReactions","useMemo","mapGraphQLReactions","reactionChangeHandler","reaction","onAnnotationClick","useCallback","file","jsx","Fragment","jsxs","Styled.Comment","clsx","ActivityHeader","Styled.Body","Styled.Tools","Styled.ToolButton","CommentInput","CommentWrapper","ReactMarkdown","remarkGfm","emoji","remarkDirective","remarkDirectiveRehype","url","props","aTag","inputTag","codeTag","blockquoteTag","Styled.Tip","Icon","ActivityStatus","FilesGrid","Reactions"],"mappings":"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"}

package/dist/shared/src/containers/Feed/components/ActivityComment/ActivityComment.es.js

@@ -35,7 +35,8 @@ import "../../../../context/AddonProjectContext.es.js";
 import "../../../../context/AddonContext.es.js";
 import "../../../../context/PowerpackContext.es.js";
 import "../../../../context/MoveEntityContext.es.js";
-const nt = ({
+import "../../../../context/MenuContext.es.js";
+const mt = ({
   activity: r = {},
   onCheckChange: E,
   onDelete: c,
@@ -219,6 +220,6 @@ const nt = ({
   ) });
 };
 export {
-  nt as default
+  mt as default
 };
 //# sourceMappingURL=ActivityComment.es.js.map

package/dist/shared/src/containers/Feed/components/ActivityComment/ActivityComment.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityComment.es.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useCallback, useMemo } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport emoji from 'remark-emoji'\nimport remarkGfm from 'remark-gfm'\nimport remarkDirective from 'remark-directive'\nimport remarkDirectiveRehype from 'remark-directive-rehype'\n\nimport CommentInput from '../CommentInput/CommentInput'\nimport Reactions from '../ReactionContainer/Reactions'\nimport { Reaction } from '../ReactionContainer/types'\nimport useReferenceTooltip from '../../hooks/useReferenceTooltip'\nimport FilesGrid, { FilesGridProps } from '../FilesGrid/FilesGrid'\n\nimport { getTextRefs } from '../CommentInput/quillToMarkdown'\nimport * as Styled from './ActivityComment.styled'\nimport CommentWrapper from './CommentWrapper'\nimport { aTag, blockquoteTag, codeTag, inputTag } from './ActivityMarkdownComponents'\nimport { mapGraphQLReactions } from './mappers'\nimport { Icon } from '@ynput/ayon-react-components'\nimport ActivityStatus from '../ActivityStatus/ActivityStatus'\nimport { useFeedContext } from '../../context/FeedContext'\nimport { confirmDelete } from '../../../../util'\nimport ActivityHeader, { ActivityHeaderProps } from '../ActivityHeader/ActivityHeader'\nimport type { Status } from '../../../ProjectTreeTable/types/project'\nimport { SavedAnnotationMetadata } from '../../index'\nimport { useDetailsPanelContext } from '@shared/context'\n\ntype Props = {\n  activity: any\n  onCheckChange?: Function\n  onDelete?: (activityId: string, entityId: string, refs: any) => Promise<void>\n  onUpdate?: Function\n  projectInfo: any\n  editProps?: {\n    disabled: boolean\n    isLoading: boolean\n  }\n  projectName: string\n  entityType: string\n  onReferenceClick?: ActivityHeaderProps['onReferenceClick']\n  onFileExpand?: FilesGridProps['onExpand']\n  showOrigin?: boolean\n  isHighlighted?: boolean\n  readOnly?: boolean\n  statuses: Status[]\n}\n\nconst ActivityComment = ({\n  activity = {},\n  onCheckChange,\n  onDelete,\n  onUpdate,\n  projectInfo,\n  editProps,\n  projectName,\n  entityType,\n  onReferenceClick,\n  onFileExpand,\n  showOrigin,\n  isHighlighted,\n  readOnly,\n  statuses = [],\n}: Props) => {\n  const { userName, createReaction, deleteReaction } = useFeedContext()\n\n  let {\n    body,\n    authorName,\n    authorFullName,\n    createdAt,\n    referenceType,\n    entityId,\n    activityId,\n    author,\n    isOwner,\n    files = [],\n    origin,\n  } = activity\n  if (!authorName) authorName = author?.name || ''\n  if (!authorFullName) authorFullName = author?.fullName || authorName\n\n  const { editingId, setEditingId } = useFeedContext()\n  const { onGoToFrame, setHighlightedActivities } = useDetailsPanelContext()\n\n  const handleEditComment = () => {\n    setEditingId(activityId)\n  }\n\n  const handleEditCancel = () => {\n    // close the edit comment\n    setEditingId(null)\n  }\n\n  const handleSave = async (value: any, files: any) => {\n    await onUpdate?.(value, files)\n    setEditingId(null)\n  }\n\n  const isEditing = editingId === activityId\n\n  const isRef = referenceType !== 'origin' || showOrigin\n\n  const handleDelete = async () => {\n    const refs = getTextRefs(body)\n\n    // if the comment is a reference, (it's origin is not the entity)\n    // we need to delete the reference from the origin as well\n    // add it to the refs to delete\n    if (isRef && origin) {\n      refs.push({ id: origin.id, type: origin.type })\n    }\n\n    // note: body is used to match other refs to delete\n    onDelete && (await onDelete(activityId, entityId, refs))\n  }\n\n  const deleteConfirmation = () => {\n    confirmDelete({\n      title: 'Delete comment',\n      message: 'Are you sure you want to delete this comment?',\n      accept: async () => {\n        await handleDelete()\n      },\n    })\n  }\n\n  const [, setRefTooltip] = useReferenceTooltip()\n\n  const mappedReactions = useMemo(\n    () => mapGraphQLReactions(activity.reactions, userName),\n    [[...(activity.reactions || [])]],\n  )\n\n  const reactionChangeHandler = (reaction: Reaction) => {\n    if (reaction.isActive) {\n      createReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        createReactionModel: {\n          reaction: reaction.type,\n        },\n      })\n    } else {\n      deleteReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        reaction: reaction.type,\n      })\n    }\n  }\n\n  const onAnnotationClick = useCallback(\n    (file: any) => {\n      if (!file.annotation) return\n      // annotation frame numbers are 1-based\n      onGoToFrame?.((file.annotation as SavedAnnotationMetadata).range[0])\n      setHighlightedActivities([activityId])\n    },\n    [onGoToFrame],\n  )\n\n  return (\n    <>\n      <Styled.Comment\n        className={clsx('comment', { isOwner, isEditing, isHighlighted })}\n        id={activityId}\n      >\n        <ActivityHeader\n          name={authorName}\n          fullName={authorFullName}\n          date={createdAt}\n          isRef={isRef}\n          activity={activity}\n          // projectInfo={projectInfo}\n          projectName={projectName}\n          entityType={entityType}\n          onReferenceClick={onReferenceClick}\n          onReferenceTooltip={setRefTooltip}\n          children={undefined}\n        />\n        <Styled.Body className={clsx('comment-body', { isEditing })}>\n          {!readOnly && (\n            <Styled.Tools className={'tools'}>\n              {isOwner && onDelete && (\n                <Styled.ToolButton\n                  icon=\"delete\"\n                  onClick={deleteConfirmation}\n                  tooltip=\"Delete comment\"\n                />\n              )}\n              {isOwner && handleEditComment && (\n                <Styled.ToolButton icon=\"edit_square\" onClick={handleEditComment} />\n              )}\n            </Styled.Tools>\n          )}\n          {isEditing ? (\n            <CommentInput\n              initValue={body}\n              initFiles={files}\n              isEditing\n              onClose={handleEditCancel}\n              onSubmit={handleSave}\n              isOpen={true}\n              {...editProps}\n            />\n          ) : (\n            <>\n              <CommentWrapper>\n                <ReactMarkdown\n                  remarkPlugins={[remarkGfm, emoji, remarkDirective, remarkDirectiveRehype]}\n                  urlTransform={(url) => url}\n                  components={{\n                    // a links\n                    // @ts-ignore\n                    a: (props) =>\n                      // @ts-ignore\n                      aTag(props, {\n                        entityId,\n                        projectName,\n                        projectInfo,\n                        onReferenceClick,\n                        onReferenceTooltip: setRefTooltip,\n                        activityId,\n                      }),\n                    // checkbox inputs\n                    // @ts-ignore\n                    input: (props) => inputTag(props, { activity, onCheckChange }),\n                    // code syntax highlighting\n                    // eslint-disable-next-line\n                    // @ts-ignore\n                    code: (props) => codeTag(props),\n                    // @ts-ignore\n                    blockquote: (props) => blockquoteTag(props),\n                    // @ts-ignore\n                    tip: (props) => (\n                      <Styled.Tip>\n                        <Icon icon=\"info\" />\n                        {props.children}\n                      </Styled.Tip>\n                    ),\n                    // @ts-ignore\n                    status: (props) => {\n                      return (\n                        <ActivityStatus name={props.id} statuses={statuses}>\n                          {props.children}\n                        </ActivityStatus>\n                      )\n                    },\n                  }}\n                >\n                  {body}\n                </ReactMarkdown>\n              </CommentWrapper>\n              {/* file uploads */}\n              {/* @ts-ignore */}\n              <FilesGrid\n                files={files}\n                isCompact={files.length > 6}\n                activityId={activityId}\n                projectName={projectName}\n                isDownloadable\n                onExpand={onFileExpand}\n                onAnnotationClick={onAnnotationClick}\n                onRemove={undefined}\n              />\n            </>\n          )}\n\n          {!isEditing && (\n            <div style={{ marginTop: '16px' }}>\n              {mappedReactions && (\n                <Reactions\n                  reactions={mappedReactions}\n                  changeHandler={reactionChangeHandler}\n                  readOnly={readOnly}\n                />\n              )}\n            </div>\n          )}\n        </Styled.Body>\n      </Styled.Comment>\n    </>\n  )\n}\n\nexport default ActivityComment\n"],"names":["ActivityComment","activity","onCheckChange","onDelete","onUpdate","projectInfo","editProps","projectName","entityType","onReferenceClick","onFileExpand","showOrigin","isHighlighted","readOnly","statuses","userName","createReaction","deleteReaction","useFeedContext","body","authorName","authorFullName","createdAt","referenceType","entityId","activityId","author","isOwner","files","origin","editingId","setEditingId","onGoToFrame","setHighlightedActivities","useDetailsPanelContext","handleEditComment","handleEditCancel","handleSave","value","isEditing","isRef","handleDelete","refs","getTextRefs","deleteConfirmation","confirmDelete","setRefTooltip","useReferenceTooltip","mappedReactions","useMemo","mapGraphQLReactions","reactionChangeHandler","reaction","onAnnotationClick","useCallback","file","jsx","Fragment","jsxs","Styled.Comment","clsx","ActivityHeader","Styled.Body","Styled.Tools","Styled.ToolButton","CommentInput","CommentWrapper","ReactMarkdown","remarkGfm","emoji","remarkDirective","remarkDirectiveRehype","url","props","aTag","inputTag","codeTag","blockquoteTag","Styled.Tip","Icon","ActivityStatus","FilesGrid","Reactions"],"mappings":"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"}
+{"version":3,"file":"ActivityComment.es.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useCallback, useMemo } from 'react'\nimport ReactMarkdown from 'react-markdown'\nimport emoji from 'remark-emoji'\nimport remarkGfm from 'remark-gfm'\nimport remarkDirective from 'remark-directive'\nimport remarkDirectiveRehype from 'remark-directive-rehype'\n\nimport CommentInput from '../CommentInput/CommentInput'\nimport Reactions from '../ReactionContainer/Reactions'\nimport { Reaction } from '../ReactionContainer/types'\nimport useReferenceTooltip from '../../hooks/useReferenceTooltip'\nimport FilesGrid, { FilesGridProps } from '../FilesGrid/FilesGrid'\n\nimport { getTextRefs } from '../CommentInput/quillToMarkdown'\nimport * as Styled from './ActivityComment.styled'\nimport CommentWrapper from './CommentWrapper'\nimport { aTag, blockquoteTag, codeTag, inputTag } from './ActivityMarkdownComponents'\nimport { mapGraphQLReactions } from './mappers'\nimport { Icon } from '@ynput/ayon-react-components'\nimport ActivityStatus from '../ActivityStatus/ActivityStatus'\nimport { useFeedContext } from '../../context/FeedContext'\nimport { confirmDelete } from '../../../../util'\nimport ActivityHeader, { ActivityHeaderProps } from '../ActivityHeader/ActivityHeader'\nimport type { Status } from '../../../ProjectTreeTable/types/project'\nimport { SavedAnnotationMetadata } from '../../index'\nimport { useDetailsPanelContext } from '@shared/context'\n\ntype Props = {\n  activity: any\n  onCheckChange?: Function\n  onDelete?: (activityId: string, entityId: string, refs: any) => Promise<void>\n  onUpdate?: Function\n  projectInfo: any\n  editProps?: {\n    disabled: boolean\n    isLoading: boolean\n  }\n  projectName: string\n  entityType: string\n  onReferenceClick?: ActivityHeaderProps['onReferenceClick']\n  onFileExpand?: FilesGridProps['onExpand']\n  showOrigin?: boolean\n  isHighlighted?: boolean\n  readOnly?: boolean\n  statuses: Status[]\n}\n\nconst ActivityComment = ({\n  activity = {},\n  onCheckChange,\n  onDelete,\n  onUpdate,\n  projectInfo,\n  editProps,\n  projectName,\n  entityType,\n  onReferenceClick,\n  onFileExpand,\n  showOrigin,\n  isHighlighted,\n  readOnly,\n  statuses = [],\n}: Props) => {\n  const { userName, createReaction, deleteReaction } = useFeedContext()\n\n  let {\n    body,\n    authorName,\n    authorFullName,\n    createdAt,\n    referenceType,\n    entityId,\n    activityId,\n    author,\n    isOwner,\n    files = [],\n    origin,\n  } = activity\n  if (!authorName) authorName = author?.name || ''\n  if (!authorFullName) authorFullName = author?.fullName || authorName\n\n  const { editingId, setEditingId } = useFeedContext()\n  const { onGoToFrame, setHighlightedActivities } = useDetailsPanelContext()\n\n  const handleEditComment = () => {\n    setEditingId(activityId)\n  }\n\n  const handleEditCancel = () => {\n    // close the edit comment\n    setEditingId(null)\n  }\n\n  const handleSave = async (value: any, files: any) => {\n    await onUpdate?.(value, files)\n    setEditingId(null)\n  }\n\n  const isEditing = editingId === activityId\n\n  const isRef = referenceType !== 'origin' || showOrigin\n\n  const handleDelete = async () => {\n    const refs = getTextRefs(body)\n\n    // if the comment is a reference, (it's origin is not the entity)\n    // we need to delete the reference from the origin as well\n    // add it to the refs to delete\n    if (isRef && origin) {\n      refs.push({ id: origin.id, type: origin.type })\n    }\n\n    // note: body is used to match other refs to delete\n    onDelete && (await onDelete(activityId, entityId, refs))\n  }\n\n  const deleteConfirmation = () => {\n    confirmDelete({\n      title: 'Delete comment',\n      message: 'Are you sure you want to delete this comment?',\n      accept: async () => {\n        await handleDelete()\n      },\n    })\n  }\n\n  const [, setRefTooltip] = useReferenceTooltip()\n\n  const mappedReactions = useMemo(\n    () => mapGraphQLReactions(activity.reactions, userName),\n    [[...(activity.reactions || [])]],\n  )\n\n  const reactionChangeHandler = (reaction: Reaction) => {\n    if (reaction.isActive) {\n      createReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        createReactionModel: {\n          reaction: reaction.type,\n        },\n      })\n    } else {\n      deleteReaction({\n        projectName: projectName,\n        // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update\n        userName: userName,\n        activityId: activityId,\n        reaction: reaction.type,\n      })\n    }\n  }\n\n  const onAnnotationClick = useCallback(\n    (file: any) => {\n      if (!file.annotation) return\n      // annotation frame numbers are 1-based\n      onGoToFrame?.((file.annotation as SavedAnnotationMetadata).range[0])\n      setHighlightedActivities([activityId])\n    },\n    [onGoToFrame],\n  )\n\n  return (\n    <>\n      <Styled.Comment\n        className={clsx('comment', { isOwner, isEditing, isHighlighted })}\n        id={activityId}\n      >\n        <ActivityHeader\n          name={authorName}\n          fullName={authorFullName}\n          date={createdAt}\n          isRef={isRef}\n          activity={activity}\n          // projectInfo={projectInfo}\n          projectName={projectName}\n          entityType={entityType}\n          onReferenceClick={onReferenceClick}\n          onReferenceTooltip={setRefTooltip}\n          children={undefined}\n        />\n        <Styled.Body className={clsx('comment-body', { isEditing })}>\n          {!readOnly && (\n            <Styled.Tools className={'tools'}>\n              {isOwner && onDelete && (\n                <Styled.ToolButton\n                  icon=\"delete\"\n                  onClick={deleteConfirmation}\n                  tooltip=\"Delete comment\"\n                />\n              )}\n              {isOwner && handleEditComment && (\n                <Styled.ToolButton icon=\"edit_square\" onClick={handleEditComment} />\n              )}\n            </Styled.Tools>\n          )}\n          {isEditing ? (\n            <CommentInput\n              initValue={body}\n              initFiles={files}\n              isEditing\n              onClose={handleEditCancel}\n              onSubmit={handleSave}\n              isOpen={true}\n              {...editProps}\n            />\n          ) : (\n            <>\n              <CommentWrapper>\n                <ReactMarkdown\n                  remarkPlugins={[remarkGfm, emoji, remarkDirective, remarkDirectiveRehype]}\n                  urlTransform={(url) => url}\n                  components={{\n                    // a links\n                    // @ts-ignore\n                    a: (props) =>\n                      // @ts-ignore\n                      aTag(props, {\n                        entityId,\n                        projectName,\n                        projectInfo,\n                        onReferenceClick,\n                        onReferenceTooltip: setRefTooltip,\n                        activityId,\n                      }),\n                    // checkbox inputs\n                    // @ts-ignore\n                    input: (props) => inputTag(props, { activity, onCheckChange }),\n                    // code syntax highlighting\n                    // eslint-disable-next-line\n                    // @ts-ignore\n                    code: (props) => codeTag(props),\n                    // @ts-ignore\n                    blockquote: (props) => blockquoteTag(props),\n                    // @ts-ignore\n                    tip: (props) => (\n                      <Styled.Tip>\n                        <Icon icon=\"info\" />\n                        {props.children}\n                      </Styled.Tip>\n                    ),\n                    // @ts-ignore\n                    status: (props) => {\n                      return (\n                        <ActivityStatus name={props.id} statuses={statuses}>\n                          {props.children}\n                        </ActivityStatus>\n                      )\n                    },\n                  }}\n                >\n                  {body}\n                </ReactMarkdown>\n              </CommentWrapper>\n              {/* file uploads */}\n              {/* @ts-ignore */}\n              <FilesGrid\n                files={files}\n                isCompact={files.length > 6}\n                activityId={activityId}\n                projectName={projectName}\n                isDownloadable\n                onExpand={onFileExpand}\n                onAnnotationClick={onAnnotationClick}\n                onRemove={undefined}\n              />\n            </>\n          )}\n\n          {!isEditing && (\n            <div style={{ marginTop: '16px' }}>\n              {mappedReactions && (\n                <Reactions\n                  reactions={mappedReactions}\n                  changeHandler={reactionChangeHandler}\n                  readOnly={readOnly}\n                />\n              )}\n            </div>\n          )}\n        </Styled.Body>\n      </Styled.Comment>\n    </>\n  )\n}\n\nexport default ActivityComment\n"],"names":["ActivityComment","activity","onCheckChange","onDelete","onUpdate","projectInfo","editProps","projectName","entityType","onReferenceClick","onFileExpand","showOrigin","isHighlighted","readOnly","statuses","userName","createReaction","deleteReaction","useFeedContext","body","authorName","authorFullName","createdAt","referenceType","entityId","activityId","author","isOwner","files","origin","editingId","setEditingId","onGoToFrame","setHighlightedActivities","useDetailsPanelContext","handleEditComment","handleEditCancel","handleSave","value","isEditing","isRef","handleDelete","refs","getTextRefs","deleteConfirmation","confirmDelete","setRefTooltip","useReferenceTooltip","mappedReactions","useMemo","mapGraphQLReactions","reactionChangeHandler","reaction","onAnnotationClick","useCallback","file","jsx","Fragment","jsxs","Styled.Comment","clsx","ActivityHeader","Styled.Body","Styled.Tools","Styled.ToolButton","CommentInput","CommentWrapper","ReactMarkdown","remarkGfm","emoji","remarkDirective","remarkDirectiveRehype","url","props","aTag","inputTag","codeTag","blockquoteTag","Styled.Tip","Icon","ActivityStatus","FilesGrid","Reactions"],"mappings":"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"}

package/dist/shared/src/containers/Feed/components/ActivityComment/ActivityComment.styled.cjs.js

@@ -142,6 +142,14 @@
     }
   }
 
+  /* Inline code elements (not in pre blocks) */
+  code:not(pre code) {
+    font-family: monospace;
+    background-color: var(--md-sys-color-surface-container-lowest);
+    padding: 2px 4px;
+    border-radius: 2px;
+  }
+
   &.isEditing {
     padding: 0;
     border-radius: var(--border-radius-l);
@@ -205,11 +213,18 @@
   padding: var(--padding-m);
   border-radius: var(--padding-s);
   background-color: var(--md-sys-color-surface-container-lowest);
+  font-family: monospace;
+  font-size: var(--md-sys-typescale-body-small-font-size);
 
   line-break: anywhere;
   word-break: break-word;
   overflow: hidden;
-`,d=o.div`
+
+  /* Ensure all child elements use monospace font */
+  * {
+    font-family: monospace !important;
+  }
+`,s=o.div`
   display: flex;
   position: absolute;
   right: 4px;
@@ -217,7 +232,7 @@
   background-color: var(--md-sys-color-surface-container-highest);
   border-radius: var(--border-radius-m);
   z-index: 50;
-`,s=o(r.Button)`
+`,d=o(r.Button)`
   padding: 4px;
 
   [icon='edit_square'] {
@@ -245,5 +260,5 @@
   .icon {
     font-size: 24px;
   }
-`;exports.BlockCode=n;exports.Body=i;exports.Comment=a;exports.QuoteLine=t;exports.Tip=l;exports.ToolButton=s;exports.Tools=d;
+`;exports.BlockCode=n;exports.Body=i;exports.Comment=a;exports.QuoteLine=t;exports.Tip=l;exports.ToolButton=d;exports.Tools=s;
 //# sourceMappingURL=ActivityComment.styled.cjs.js.map

package/dist/shared/src/containers/Feed/components/ActivityComment/ActivityComment.styled.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityComment.styled.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.styled.ts"],"sourcesContent":["import { Button, theme } from '@ynput/ayon-react-components'\nimport styled, { css } from 'styled-components'\n\nexport const CommentWrapper = styled.div`\n  border-radius: var(--border-radius-m);\n`\n\nexport const Comment = styled.li`\n  /* reset default */\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-small);\n\n  width: 100%;\n  padding: var(--padding-m);\n  border-radius: var(--border-radius-m);\n\n  /* hide date and show tools */\n  &.isOwner {\n    /* by default hide menu */\n\n    .tools {\n      opacity: 0;\n    }\n\n    .isEditing {\n      z-index: 1000;\n    }\n\n    :not(.isEditing) {\n      /* on hover show menu and hide date */\n      &:hover {\n        .tools {\n          opacity: 1;\n        }\n      }\n    }\n  }\n\n  &.isHighlighted {\n    background-color: var(--md-sys-color-secondary-container);\n  }\n`\n\nexport const Body = styled.div`\n  background-color: var(--md-sys-color-surface-container);\n  border-radius: var(--border-radius-m);\n  padding: var(--padding-m);\n  padding: 12px 10px;\n  position: relative;\n\n  /* remove first and last margins */\n  /* + * because tools is actual first */\n  & > *:first-child + * {\n    margin-top: 0;\n  }\n\n  & > *:not(.tools):not(h1) {\n    margin-bottom: 0;\n  }\n\n  a {\n    color: var(--md-sys-color-primary);\n  }\n\n  img {\n    width: 100%;\n  }\n\n  p {\n    word-break: break-word;\n    .reference {\n      top: 5px;\n    }\n  }\n\n  h1 {\n    ${theme.titleLarge}\n    font-size: 24px;\n  }\n\n  h2 {\n    ${theme.titleMedium}\n    font-size: 20px;\n  }\n\n  h3 {\n    ${theme.titleSmall}\n    font-size: 16px;\n  }\n\n  h1,\n  h2,\n  h3 {\n    margin-top: 16px;\n  }\n\n  ul,\n  ol {\n    .reference {\n      top: 6px;\n    }\n  }\n\n  .contains-task-list {\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    gap: var(--base-gap-large);\n    padding-left: 8px;\n    margin: 16px 0;\n\n    li {\n      align-items: center;\n    }\n\n    & > * {\n      padding-left: 1.5rem;\n    }\n\n    p {\n      margin: 0;\n\n      .reference {\n        top: 0px;\n        margin-left: 4px;\n      }\n    }\n  }\n\n  blockquote {\n    margin: 0;\n    padding-left: 16px;\n    position: relative;\n\n    &::before {\n      content: '';\n      position: absolute;\n      left: 0;\n      top: 0;\n      bottom: 0;\n      width: 4px;\n      background-color: var(--md-sys-color-outline-variant);\n      border-radius: 2px;\n    }\n  }\n\n  &.isEditing {\n    padding: 0;\n    border-radius: var(--border-radius-l);\n  }\n`\n\nexport const QuoteLine = styled.p`\n  margin: 0;\n\n  &:first-child {\n    margin-top: 14px;\n  }\n\n  &:last-child {\n    margin-bottom: 14px;\n  }\n`\n\nexport const Attachments = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--base-gap-large);\n`\n\nconst attachmentBase = css`\n  height: 100px;\n  width: 100px;\n  object-fit: contain;\n  padding: 4px;\n  cursor: pointer;\n  position: relative;\n\n  border-radius: var(--border-radius-m);\n  background-color: var(--md-sys-color-surface-container-high);\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n\n  &:active {\n    background-color: var(--md-sys-color-surface-container-high-active);\n  }\n`\n\nexport const AttachmentImg = styled.img`\n  ${attachmentBase}\n`\n\nexport const AttachmentFile = styled.a`\n  ${attachmentBase}\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  .icon {\n    margin-bottom: 20px;\n    font-size: 32px;\n    color: var(--md-sys-color-outline);\n  }\n`\n\nexport const Name = styled.span`\n  position: absolute;\n  bottom: 4px;\n  left: 0;\n  right: 0;\n  text-align: center;\n  /* break text */\n  overflow-wrap: break-word;\n  color: var(--md-sys-color-outline);\n`\n\nexport const BlockCode = styled.pre`\n  padding: var(--padding-m);\n  border-radius: var(--padding-s);\n  background-color: var(--md-sys-color-surface-container-lowest);\n\n  line-break: anywhere;\n  word-break: break-word;\n  overflow: hidden;\n`\n\nexport const Tools = styled.div`\n  display: flex;\n  position: absolute;\n  right: 4px;\n  top: 4px;\n  background-color: var(--md-sys-color-surface-container-highest);\n  border-radius: var(--border-radius-m);\n  z-index: 50;\n`\n\nexport const ToolButton = styled(Button)`\n  padding: 4px;\n\n  [icon='edit_square'] {\n    position: relative;\n    top: -1px;\n  }\n`\n\nexport const Tip = styled.span`\n  background-color: var(--md-sys-color-secondary-container);\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  border-radius: var(--border-radius-m);\n  padding: var(--padding-m);\n  margin: 16px 0 !important;\n\n  &,\n  .icon {\n    color: var(--md-sys-color-on-secondary-container);\n  }\n\n  p {\n    margin: 0;\n  }\n\n  .icon {\n    font-size: 24px;\n  }\n`\n"],"names":["styled","Comment","Body","theme","QuoteLine","attachmentBase","css","BlockCode","Tools","ToolButton","Button","Tip"],"mappings":"+JAG8BA,EAAO;AAAA;AAAA,EAI9B,MAAMC,EAAUD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAyCjBE,EAAOF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAiCrBG,QAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,MAKhBA,QAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,MAKjBA,QAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAkETC,EAAYJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYLA,EAAO;AAAA;AAAA;AAAA;AAAA,EAMlC,MAAMK,EAAiBC,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBMN,EAAO;AAAA,IAChCK,CAAc;AAAA,EAGYL,EAAO;AAAA,IACjCK,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaEL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWpB,MAAMO,EAAYP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUnBQ,EAAQR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUfS,EAAaT,EAAOU,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAS1BC,EAAMX,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"ActivityComment.styled.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.styled.ts"],"sourcesContent":["import { Button, theme } from '@ynput/ayon-react-components'\nimport styled, { css } from 'styled-components'\n\nexport const CommentWrapper = styled.div`\n  border-radius: var(--border-radius-m);\n`\n\nexport const Comment = styled.li`\n  /* reset default */\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-small);\n\n  width: 100%;\n  padding: var(--padding-m);\n  border-radius: var(--border-radius-m);\n\n  /* hide date and show tools */\n  &.isOwner {\n    /* by default hide menu */\n\n    .tools {\n      opacity: 0;\n    }\n\n    .isEditing {\n      z-index: 1000;\n    }\n\n    :not(.isEditing) {\n      /* on hover show menu and hide date */\n      &:hover {\n        .tools {\n          opacity: 1;\n        }\n      }\n    }\n  }\n\n  &.isHighlighted {\n    background-color: var(--md-sys-color-secondary-container);\n  }\n`\n\nexport const Body = styled.div`\n  background-color: var(--md-sys-color-surface-container);\n  border-radius: var(--border-radius-m);\n  padding: var(--padding-m);\n  padding: 12px 10px;\n  position: relative;\n\n  /* remove first and last margins */\n  /* + * because tools is actual first */\n  & > *:first-child + * {\n    margin-top: 0;\n  }\n\n  & > *:not(.tools):not(h1) {\n    margin-bottom: 0;\n  }\n\n  a {\n    color: var(--md-sys-color-primary);\n  }\n\n  img {\n    width: 100%;\n  }\n\n  p {\n    word-break: break-word;\n    .reference {\n      top: 5px;\n    }\n  }\n\n  h1 {\n    ${theme.titleLarge}\n    font-size: 24px;\n  }\n\n  h2 {\n    ${theme.titleMedium}\n    font-size: 20px;\n  }\n\n  h3 {\n    ${theme.titleSmall}\n    font-size: 16px;\n  }\n\n  h1,\n  h2,\n  h3 {\n    margin-top: 16px;\n  }\n\n  ul,\n  ol {\n    .reference {\n      top: 6px;\n    }\n  }\n\n  .contains-task-list {\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    gap: var(--base-gap-large);\n    padding-left: 8px;\n    margin: 16px 0;\n\n    li {\n      align-items: center;\n    }\n\n    & > * {\n      padding-left: 1.5rem;\n    }\n\n    p {\n      margin: 0;\n\n      .reference {\n        top: 0px;\n        margin-left: 4px;\n      }\n    }\n  }\n\n  blockquote {\n    margin: 0;\n    padding-left: 16px;\n    position: relative;\n\n    &::before {\n      content: '';\n      position: absolute;\n      left: 0;\n      top: 0;\n      bottom: 0;\n      width: 4px;\n      background-color: var(--md-sys-color-outline-variant);\n      border-radius: 2px;\n    }\n  }\n\n  /* Inline code elements (not in pre blocks) */\n  code:not(pre code) {\n    font-family: monospace;\n    background-color: var(--md-sys-color-surface-container-lowest);\n    padding: 2px 4px;\n    border-radius: 2px;\n  }\n\n  &.isEditing {\n    padding: 0;\n    border-radius: var(--border-radius-l);\n  }\n`\n\nexport const QuoteLine = styled.p`\n  margin: 0;\n\n  &:first-child {\n    margin-top: 14px;\n  }\n\n  &:last-child {\n    margin-bottom: 14px;\n  }\n`\n\nexport const Attachments = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--base-gap-large);\n`\n\nconst attachmentBase = css`\n  height: 100px;\n  width: 100px;\n  object-fit: contain;\n  padding: 4px;\n  cursor: pointer;\n  position: relative;\n\n  border-radius: var(--border-radius-m);\n  background-color: var(--md-sys-color-surface-container-high);\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n\n  &:active {\n    background-color: var(--md-sys-color-surface-container-high-active);\n  }\n`\n\nexport const AttachmentImg = styled.img`\n  ${attachmentBase}\n`\n\nexport const AttachmentFile = styled.a`\n  ${attachmentBase}\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  .icon {\n    margin-bottom: 20px;\n    font-size: 32px;\n    color: var(--md-sys-color-outline);\n  }\n`\n\nexport const Name = styled.span`\n  position: absolute;\n  bottom: 4px;\n  left: 0;\n  right: 0;\n  text-align: center;\n  /* break text */\n  overflow-wrap: break-word;\n  color: var(--md-sys-color-outline);\n`\n\nexport const BlockCode = styled.pre`\n  padding: var(--padding-m);\n  border-radius: var(--padding-s);\n  background-color: var(--md-sys-color-surface-container-lowest);\n  font-family: monospace;\n  font-size: var(--md-sys-typescale-body-small-font-size);\n\n  line-break: anywhere;\n  word-break: break-word;\n  overflow: hidden;\n\n  /* Ensure all child elements use monospace font */\n  * {\n    font-family: monospace !important;\n  }\n`\n\nexport const Tools = styled.div`\n  display: flex;\n  position: absolute;\n  right: 4px;\n  top: 4px;\n  background-color: var(--md-sys-color-surface-container-highest);\n  border-radius: var(--border-radius-m);\n  z-index: 50;\n`\n\nexport const ToolButton = styled(Button)`\n  padding: 4px;\n\n  [icon='edit_square'] {\n    position: relative;\n    top: -1px;\n  }\n`\n\nexport const Tip = styled.span`\n  background-color: var(--md-sys-color-secondary-container);\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  border-radius: var(--border-radius-m);\n  padding: var(--padding-m);\n  margin: 16px 0 !important;\n\n  &,\n  .icon {\n    color: var(--md-sys-color-on-secondary-container);\n  }\n\n  p {\n    margin: 0;\n  }\n\n  .icon {\n    font-size: 24px;\n  }\n`\n"],"names":["styled","Comment","Body","theme","QuoteLine","attachmentBase","css","BlockCode","Tools","ToolButton","Button","Tip"],"mappings":"+JAG8BA,EAAO;AAAA;AAAA,EAI9B,MAAMC,EAAUD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAyCjBE,EAAOF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAiCrBG,QAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,MAKhBA,QAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,MAKjBA,QAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA0ETC,EAAYJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYLA,EAAO;AAAA;AAAA;AAAA;AAAA,EAMlC,MAAMK,EAAiBC,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBMN,EAAO;AAAA,IAChCK,CAAc;AAAA,EAGYL,EAAO;AAAA,IACjCK,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaEL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWpB,MAAMO,EAAYP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiBnBQ,EAAQR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUfS,EAAaT,EAAOU,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAS1BC,EAAMX,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/shared/src/containers/Feed/components/ActivityComment/ActivityComment.styled.es.js

@@ -1,5 +1,5 @@
-import { theme as r, Button as i } from "@ynput/ayon-react-components";
-import o, { css as e } from "styled-components";
+import { theme as r, Button as a } from "@ynput/ayon-react-components";
+import o, { css as i } from "styled-components";
 o.div`
   border-radius: var(--border-radius-m);
 `;
@@ -145,6 +145,14 @@ const d = o.li`
     }
   }
 
+  /* Inline code elements (not in pre blocks) */
+  code:not(pre code) {
+    font-family: monospace;
+    background-color: var(--md-sys-color-surface-container-lowest);
+    padding: 2px 4px;
+    border-radius: 2px;
+  }
+
   &.isEditing {
     padding: 0;
     border-radius: var(--border-radius-l);
@@ -165,7 +173,7 @@ o.div`
   flex-wrap: wrap;
   gap: var(--base-gap-large);
 `;
-const a = e`
+const e = i`
   height: 100px;
   width: 100px;
   object-fit: contain;
@@ -185,10 +193,10 @@ const a = e`
   }
 `;
 o.img`
-  ${a}
+  ${e}
 `;
 o.a`
-  ${a}
+  ${e}
 
   display: flex;
   flex-direction: column;
@@ -214,10 +222,17 @@ const c = o.pre`
   padding: var(--padding-m);
   border-radius: var(--padding-s);
   background-color: var(--md-sys-color-surface-container-lowest);
+  font-family: monospace;
+  font-size: var(--md-sys-typescale-body-small-font-size);
 
   line-break: anywhere;
   word-break: break-word;
   overflow: hidden;
+
+  /* Ensure all child elements use monospace font */
+  * {
+    font-family: monospace !important;
+  }
 `, p = o.div`
   display: flex;
   position: absolute;
@@ -226,14 +241,14 @@ const c = o.pre`
   background-color: var(--md-sys-color-surface-container-highest);
   border-radius: var(--border-radius-m);
   z-index: 50;
-`, g = o(i)`
+`, m = o(a)`
   padding: 4px;
 
   [icon='edit_square'] {
     position: relative;
     top: -1px;
   }
-`, m = o.span`
+`, g = o.span`
   background-color: var(--md-sys-color-secondary-container);
   display: flex;
   align-items: center;
@@ -260,8 +275,8 @@ export {
   s as Body,
   d as Comment,
   l as QuoteLine,
-  m as Tip,
-  g as ToolButton,
+  g as Tip,
+  m as ToolButton,
   p as Tools
 };
 //# sourceMappingURL=ActivityComment.styled.es.js.map

package/dist/shared/src/containers/Feed/components/ActivityComment/ActivityComment.styled.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityComment.styled.es.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.styled.ts"],"sourcesContent":["import { Button, theme } from '@ynput/ayon-react-components'\nimport styled, { css } from 'styled-components'\n\nexport const CommentWrapper = styled.div`\n  border-radius: var(--border-radius-m);\n`\n\nexport const Comment = styled.li`\n  /* reset default */\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-small);\n\n  width: 100%;\n  padding: var(--padding-m);\n  border-radius: var(--border-radius-m);\n\n  /* hide date and show tools */\n  &.isOwner {\n    /* by default hide menu */\n\n    .tools {\n      opacity: 0;\n    }\n\n    .isEditing {\n      z-index: 1000;\n    }\n\n    :not(.isEditing) {\n      /* on hover show menu and hide date */\n      &:hover {\n        .tools {\n          opacity: 1;\n        }\n      }\n    }\n  }\n\n  &.isHighlighted {\n    background-color: var(--md-sys-color-secondary-container);\n  }\n`\n\nexport const Body = styled.div`\n  background-color: var(--md-sys-color-surface-container);\n  border-radius: var(--border-radius-m);\n  padding: var(--padding-m);\n  padding: 12px 10px;\n  position: relative;\n\n  /* remove first and last margins */\n  /* + * because tools is actual first */\n  & > *:first-child + * {\n    margin-top: 0;\n  }\n\n  & > *:not(.tools):not(h1) {\n    margin-bottom: 0;\n  }\n\n  a {\n    color: var(--md-sys-color-primary);\n  }\n\n  img {\n    width: 100%;\n  }\n\n  p {\n    word-break: break-word;\n    .reference {\n      top: 5px;\n    }\n  }\n\n  h1 {\n    ${theme.titleLarge}\n    font-size: 24px;\n  }\n\n  h2 {\n    ${theme.titleMedium}\n    font-size: 20px;\n  }\n\n  h3 {\n    ${theme.titleSmall}\n    font-size: 16px;\n  }\n\n  h1,\n  h2,\n  h3 {\n    margin-top: 16px;\n  }\n\n  ul,\n  ol {\n    .reference {\n      top: 6px;\n    }\n  }\n\n  .contains-task-list {\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    gap: var(--base-gap-large);\n    padding-left: 8px;\n    margin: 16px 0;\n\n    li {\n      align-items: center;\n    }\n\n    & > * {\n      padding-left: 1.5rem;\n    }\n\n    p {\n      margin: 0;\n\n      .reference {\n        top: 0px;\n        margin-left: 4px;\n      }\n    }\n  }\n\n  blockquote {\n    margin: 0;\n    padding-left: 16px;\n    position: relative;\n\n    &::before {\n      content: '';\n      position: absolute;\n      left: 0;\n      top: 0;\n      bottom: 0;\n      width: 4px;\n      background-color: var(--md-sys-color-outline-variant);\n      border-radius: 2px;\n    }\n  }\n\n  &.isEditing {\n    padding: 0;\n    border-radius: var(--border-radius-l);\n  }\n`\n\nexport const QuoteLine = styled.p`\n  margin: 0;\n\n  &:first-child {\n    margin-top: 14px;\n  }\n\n  &:last-child {\n    margin-bottom: 14px;\n  }\n`\n\nexport const Attachments = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--base-gap-large);\n`\n\nconst attachmentBase = css`\n  height: 100px;\n  width: 100px;\n  object-fit: contain;\n  padding: 4px;\n  cursor: pointer;\n  position: relative;\n\n  border-radius: var(--border-radius-m);\n  background-color: var(--md-sys-color-surface-container-high);\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n\n  &:active {\n    background-color: var(--md-sys-color-surface-container-high-active);\n  }\n`\n\nexport const AttachmentImg = styled.img`\n  ${attachmentBase}\n`\n\nexport const AttachmentFile = styled.a`\n  ${attachmentBase}\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  .icon {\n    margin-bottom: 20px;\n    font-size: 32px;\n    color: var(--md-sys-color-outline);\n  }\n`\n\nexport const Name = styled.span`\n  position: absolute;\n  bottom: 4px;\n  left: 0;\n  right: 0;\n  text-align: center;\n  /* break text */\n  overflow-wrap: break-word;\n  color: var(--md-sys-color-outline);\n`\n\nexport const BlockCode = styled.pre`\n  padding: var(--padding-m);\n  border-radius: var(--padding-s);\n  background-color: var(--md-sys-color-surface-container-lowest);\n\n  line-break: anywhere;\n  word-break: break-word;\n  overflow: hidden;\n`\n\nexport const Tools = styled.div`\n  display: flex;\n  position: absolute;\n  right: 4px;\n  top: 4px;\n  background-color: var(--md-sys-color-surface-container-highest);\n  border-radius: var(--border-radius-m);\n  z-index: 50;\n`\n\nexport const ToolButton = styled(Button)`\n  padding: 4px;\n\n  [icon='edit_square'] {\n    position: relative;\n    top: -1px;\n  }\n`\n\nexport const Tip = styled.span`\n  background-color: var(--md-sys-color-secondary-container);\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  border-radius: var(--border-radius-m);\n  padding: var(--padding-m);\n  margin: 16px 0 !important;\n\n  &,\n  .icon {\n    color: var(--md-sys-color-on-secondary-container);\n  }\n\n  p {\n    margin: 0;\n  }\n\n  .icon {\n    font-size: 24px;\n  }\n`\n"],"names":["styled","Comment","Body","theme","QuoteLine","attachmentBase","css","BlockCode","Tools","ToolButton","Button","Tip"],"mappings":";;AAG8BA,EAAO;AAAA;AAAA;AAI9B,MAAMC,IAAUD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAyCjBE,IAAOF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAiCrBG,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,MAKhBA,EAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,MAKjBA,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAkETC,IAAYJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYLA,EAAO;AAAA;AAAA;AAAA;AAAA;AAMlC,MAAMK,IAAiBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBMN,EAAO;AAAA,IAChCK,CAAc;AAAA;AAGYL,EAAO;AAAA,IACjCK,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaEL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWpB,MAAMO,IAAYP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUnBQ,IAAQR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUfS,IAAaT,EAAOU,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAS1BC,IAAMX,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"ActivityComment.styled.es.js","sources":["../../../../../../../src/containers/Feed/components/ActivityComment/ActivityComment.styled.ts"],"sourcesContent":["import { Button, theme } from '@ynput/ayon-react-components'\nimport styled, { css } from 'styled-components'\n\nexport const CommentWrapper = styled.div`\n  border-radius: var(--border-radius-m);\n`\n\nexport const Comment = styled.li`\n  /* reset default */\n  list-style: none;\n  margin: 0;\n  padding: 0;\n\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-small);\n\n  width: 100%;\n  padding: var(--padding-m);\n  border-radius: var(--border-radius-m);\n\n  /* hide date and show tools */\n  &.isOwner {\n    /* by default hide menu */\n\n    .tools {\n      opacity: 0;\n    }\n\n    .isEditing {\n      z-index: 1000;\n    }\n\n    :not(.isEditing) {\n      /* on hover show menu and hide date */\n      &:hover {\n        .tools {\n          opacity: 1;\n        }\n      }\n    }\n  }\n\n  &.isHighlighted {\n    background-color: var(--md-sys-color-secondary-container);\n  }\n`\n\nexport const Body = styled.div`\n  background-color: var(--md-sys-color-surface-container);\n  border-radius: var(--border-radius-m);\n  padding: var(--padding-m);\n  padding: 12px 10px;\n  position: relative;\n\n  /* remove first and last margins */\n  /* + * because tools is actual first */\n  & > *:first-child + * {\n    margin-top: 0;\n  }\n\n  & > *:not(.tools):not(h1) {\n    margin-bottom: 0;\n  }\n\n  a {\n    color: var(--md-sys-color-primary);\n  }\n\n  img {\n    width: 100%;\n  }\n\n  p {\n    word-break: break-word;\n    .reference {\n      top: 5px;\n    }\n  }\n\n  h1 {\n    ${theme.titleLarge}\n    font-size: 24px;\n  }\n\n  h2 {\n    ${theme.titleMedium}\n    font-size: 20px;\n  }\n\n  h3 {\n    ${theme.titleSmall}\n    font-size: 16px;\n  }\n\n  h1,\n  h2,\n  h3 {\n    margin-top: 16px;\n  }\n\n  ul,\n  ol {\n    .reference {\n      top: 6px;\n    }\n  }\n\n  .contains-task-list {\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    gap: var(--base-gap-large);\n    padding-left: 8px;\n    margin: 16px 0;\n\n    li {\n      align-items: center;\n    }\n\n    & > * {\n      padding-left: 1.5rem;\n    }\n\n    p {\n      margin: 0;\n\n      .reference {\n        top: 0px;\n        margin-left: 4px;\n      }\n    }\n  }\n\n  blockquote {\n    margin: 0;\n    padding-left: 16px;\n    position: relative;\n\n    &::before {\n      content: '';\n      position: absolute;\n      left: 0;\n      top: 0;\n      bottom: 0;\n      width: 4px;\n      background-color: var(--md-sys-color-outline-variant);\n      border-radius: 2px;\n    }\n  }\n\n  /* Inline code elements (not in pre blocks) */\n  code:not(pre code) {\n    font-family: monospace;\n    background-color: var(--md-sys-color-surface-container-lowest);\n    padding: 2px 4px;\n    border-radius: 2px;\n  }\n\n  &.isEditing {\n    padding: 0;\n    border-radius: var(--border-radius-l);\n  }\n`\n\nexport const QuoteLine = styled.p`\n  margin: 0;\n\n  &:first-child {\n    margin-top: 14px;\n  }\n\n  &:last-child {\n    margin-bottom: 14px;\n  }\n`\n\nexport const Attachments = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--base-gap-large);\n`\n\nconst attachmentBase = css`\n  height: 100px;\n  width: 100px;\n  object-fit: contain;\n  padding: 4px;\n  cursor: pointer;\n  position: relative;\n\n  border-radius: var(--border-radius-m);\n  background-color: var(--md-sys-color-surface-container-high);\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n\n  &:active {\n    background-color: var(--md-sys-color-surface-container-high-active);\n  }\n`\n\nexport const AttachmentImg = styled.img`\n  ${attachmentBase}\n`\n\nexport const AttachmentFile = styled.a`\n  ${attachmentBase}\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  .icon {\n    margin-bottom: 20px;\n    font-size: 32px;\n    color: var(--md-sys-color-outline);\n  }\n`\n\nexport const Name = styled.span`\n  position: absolute;\n  bottom: 4px;\n  left: 0;\n  right: 0;\n  text-align: center;\n  /* break text */\n  overflow-wrap: break-word;\n  color: var(--md-sys-color-outline);\n`\n\nexport const BlockCode = styled.pre`\n  padding: var(--padding-m);\n  border-radius: var(--padding-s);\n  background-color: var(--md-sys-color-surface-container-lowest);\n  font-family: monospace;\n  font-size: var(--md-sys-typescale-body-small-font-size);\n\n  line-break: anywhere;\n  word-break: break-word;\n  overflow: hidden;\n\n  /* Ensure all child elements use monospace font */\n  * {\n    font-family: monospace !important;\n  }\n`\n\nexport const Tools = styled.div`\n  display: flex;\n  position: absolute;\n  right: 4px;\n  top: 4px;\n  background-color: var(--md-sys-color-surface-container-highest);\n  border-radius: var(--border-radius-m);\n  z-index: 50;\n`\n\nexport const ToolButton = styled(Button)`\n  padding: 4px;\n\n  [icon='edit_square'] {\n    position: relative;\n    top: -1px;\n  }\n`\n\nexport const Tip = styled.span`\n  background-color: var(--md-sys-color-secondary-container);\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  border-radius: var(--border-radius-m);\n  padding: var(--padding-m);\n  margin: 16px 0 !important;\n\n  &,\n  .icon {\n    color: var(--md-sys-color-on-secondary-container);\n  }\n\n  p {\n    margin: 0;\n  }\n\n  .icon {\n    font-size: 24px;\n  }\n`\n"],"names":["styled","Comment","Body","theme","QuoteLine","attachmentBase","css","BlockCode","Tools","ToolButton","Button","Tip"],"mappings":";;AAG8BA,EAAO;AAAA;AAAA;AAI9B,MAAMC,IAAUD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAyCjBE,IAAOF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAiCrBG,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,MAKhBA,EAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,MAKjBA,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA0ETC,IAAYJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYLA,EAAO;AAAA;AAAA;AAAA;AAAA;AAMlC,MAAMK,IAAiBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBMN,EAAO;AAAA,IAChCK,CAAc;AAAA;AAGYL,EAAO;AAAA,IACjCK,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaEL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWpB,MAAMO,IAAYP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAiBnBQ,IAAQR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUfS,IAAaT,EAAOU,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAS1BC,IAAMX,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/shared/src/containers/Feed/components/ActivityDate.cjs.js

@@ -1,11 +1,16 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const w=require("../../../../../_virtual/jsx-runtime.cjs.js"),t=require("date-fns"),z=require("clsx"),S=require("styled-components"),g=require("react"),p=require("@ynput/ayon-react-components"),F=S.span`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const M=require("../../../../../_virtual/jsx-runtime.cjs.js"),t=require("date-fns"),p=require("clsx"),z=require("styled-components"),S=require("react"),g=require("@ynput/ayon-react-components"),x=z.span`
   margin-left: auto;
   color: var(--md-sys-color-outline);
   user-select: none;
   white-space: nowrap;
   display: flex;
   align-items: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  flex-shrink: 3;
+  min-width: 0;
+  max-width: fit-content;
 
-  ${p.theme.bodySmall}
-`,c=s=>{let e=t.formatDistanceToNow(s,{addSuffix:!0});return e=e.replace("about",""),e=e.replace("minutes","mins"),e=e.replace("minute","min"),e=e.replace(" ago",""),t.isSameMinute(s,new Date)&&(e="Just now"),e},q=({date:s,isExact:e,...l})=>{const[o,r]=g.useState(!0);if(!s)return null;const a=new Date(s);if(!t.isValid(a))return null;const m=t.isToday(a),y=t.isSameYear(a,new Date),i=t.isSameDay(a,new Date(new Date().setDate(new Date().getDate()-1))),d=t.isSameWeek(a,new Date),D=t.isSameMinute(a,new Date),f=i?"":y?d?"E":"MMM d":"MMM d yyyy",u="h:mm a";let n=o&&!e?m?c(a):t.format(a,`${f}, ${u}`):t.format(a,`EEEE, dd MMM yyyy ${u}`);i&&o&&!e&&(n=`Yesterday${n}`),D&&(n="Just now");const M=()=>{r(!o)};return w.jsxRuntimeExports.jsx(F,{className:z("date"),...l,onClick:M,onMouseOver:()=>r(!1),onMouseOut:()=>r(!0),children:n})};exports.default=q;exports.getFuzzyDate=c;
+  ${g.theme.bodySmall}
+`,l=a=>{let e=t.formatDistanceToNow(a,{addSuffix:!0});return e=e.replace("about",""),e=e.replace("minutes","mins"),e=e.replace("minute","min"),e=e.replace(" ago",""),t.isSameMinute(a,new Date)&&(e="Just now"),e},h=({date:a,isExact:e,...c})=>{const[o,r]=S.useState(!0);if(!a)return null;const n=new Date(a);if(!t.isValid(n))return null;const m=t.isToday(n),d=t.isSameYear(n,new Date),i=t.isSameDay(n,new Date(new Date().setDate(new Date().getDate()-1))),y=t.isSameWeek(n,new Date),f=t.isSameMinute(n,new Date),w=i?"":d?y?"E":"MMM d":"MMM d yyyy",u="h:mm a";let s=o&&!e?m?l(n):t.format(n,`${w}, ${u}`):t.format(n,`EEEE, dd MMM yyyy ${u}`);i&&o&&!e&&(s=`Yesterday${s}`),f&&(s="Just now");const D=()=>{r(!o)};return M.jsxRuntimeExports.jsx(x,{className:p("date"),...c,onClick:D,onMouseOver:()=>r(!1),onMouseOut:()=>r(!0),children:s})};exports.default=h;exports.getFuzzyDate=l;
 //# sourceMappingURL=ActivityDate.cjs.js.map

package/dist/shared/src/containers/Feed/components/ActivityDate.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityDate.cjs.js","sources":["../../../../../../src/containers/Feed/components/ActivityDate.tsx"],"sourcesContent":["import {\n  format,\n  formatDistanceToNow,\n  isValid,\n  isToday,\n  isSameYear,\n  isSameDay,\n  isSameWeek,\n  isSameMinute,\n} from 'date-fns'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\nimport { useState } from 'react'\nimport { theme } from '@ynput/ayon-react-components'\n\nconst DateStyled = styled.span`\n  margin-left: auto;\n  color: var(--md-sys-color-outline);\n  user-select: none;\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n\n  ${theme.bodySmall}\n`\n\nexport const getFuzzyDate = (date: Date) => {\n  let fuzzyDate = formatDistanceToNow(date, { addSuffix: true })\n\n  // remove 'about' from the string\n  fuzzyDate = fuzzyDate.replace('about', '')\n  // replace minutes with min\n  fuzzyDate = fuzzyDate.replace('minutes', 'mins')\n  fuzzyDate = fuzzyDate.replace('minute', 'min')\n  // remove the word ' ago'\n  fuzzyDate = fuzzyDate.replace(' ago', '')\n\n  // if date is less than a minute ago, return 'Just now'\n  if (isSameMinute(date, new Date())) fuzzyDate = 'Just now'\n\n  return fuzzyDate\n}\n\ninterface ActivityDateProps extends React.HTMLAttributes<HTMLElement> {\n  date?: string\n  isExact?: boolean\n}\n\nconst ActivityDate = ({ date, isExact, ...props }: ActivityDateProps) => {\n  const [isFuzzy, setIsFuzzy] = useState(true)\n  if (!date) return null\n  const dateObj = new Date(date)\n  if (!isValid(dateObj)) return null\n\n  // is date over a day old?\n  const today = isToday(dateObj)\n  const sameYear = isSameYear(dateObj, new Date())\n  const yesterday = isSameDay(dateObj, new Date(new Date().setDate(new Date().getDate() - 1)))\n  const sameWeek = isSameWeek(dateObj, new Date())\n  const sameMin = isSameMinute(dateObj, new Date())\n\n  const dateFormat = yesterday ? '' : sameYear ? (sameWeek ? 'E' : 'MMM d') : 'MMM d yyyy'\n  const timeFormat = 'h:mm a'\n\n  let dateString =\n    isFuzzy && !isExact\n      ? today\n        ? getFuzzyDate(dateObj)\n        : format(dateObj, `${dateFormat}, ${timeFormat}`)\n      : format(dateObj, `EEEE, dd MMM yyyy ${timeFormat}`)\n\n  if (yesterday && isFuzzy && !isExact) dateString = `Yesterday${dateString}`\n\n  // if less than a minute ago overwrite the date string\n  if (sameMin) dateString = 'Just now'\n\n  const toggleFuzzy = () => {\n    setIsFuzzy(!isFuzzy)\n  }\n\n  return (\n    <DateStyled\n      className={clsx('date')}\n      {...props}\n      onClick={toggleFuzzy}\n      onMouseOver={() => setIsFuzzy(false)}\n      onMouseOut={() => setIsFuzzy(true)}\n    >\n      {dateString}\n    </DateStyled>\n  )\n}\n\nexport default ActivityDate\n"],"names":["DateStyled","styled","theme","getFuzzyDate","date","fuzzyDate","formatDistanceToNow","isSameMinute","ActivityDate","isExact","props","isFuzzy","setIsFuzzy","useState","dateObj","isValid","today","isToday","sameYear","isSameYear","yesterday","isSameDay","sameWeek","isSameWeek","sameMin","dateFormat","timeFormat","dateString","format","toggleFuzzy","jsx","clsx"],"mappings":"8SAeMA,EAAaC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQtBC,QAAM,SAAS;AAAA,EAGNC,EAAgBC,GAAe,CAC1C,IAAIC,EAAYC,EAAAA,oBAAoBF,EAAM,CAAE,UAAW,GAAM,EAGjD,OAAAC,EAAAA,EAAU,QAAQ,QAAS,EAAE,EAE7BA,EAAAA,EAAU,QAAQ,UAAW,MAAM,EACnCA,EAAAA,EAAU,QAAQ,SAAU,KAAK,EAEjCA,EAAAA,EAAU,QAAQ,OAAQ,EAAE,EAGpCE,EAAAA,aAAaH,EAAM,IAAI,IAAM,IAAeC,EAAA,YAEzCA,CACT,EAOMG,EAAe,CAAC,CAAE,KAAAJ,EAAM,QAAAK,EAAS,GAAGC,KAA+B,CACvE,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAI,EACvC,GAAA,CAACT,EAAa,OAAA,KACZ,MAAAU,EAAU,IAAI,KAAKV,CAAI,EAC7B,GAAI,CAACW,EAAA,QAAQD,CAAO,EAAU,OAAA,KAGxB,MAAAE,EAAQC,UAAQH,CAAO,EACvBI,EAAWC,EAAA,WAAWL,EAAS,IAAI,IAAM,EACzCM,EAAYC,EAAAA,UAAUP,EAAS,IAAI,SAAS,KAAK,EAAE,QAAQ,IAAI,KAAO,EAAA,QAAA,EAAY,CAAC,CAAC,CAAC,EACrFQ,EAAWC,EAAA,WAAWT,EAAS,IAAI,IAAM,EACzCU,EAAUjB,EAAA,aAAaO,EAAS,IAAI,IAAM,EAE1CW,EAAaL,EAAY,GAAKF,EAAYI,EAAW,IAAM,QAAW,aACtEI,EAAa,SAEf,IAAAC,EACFhB,GAAW,CAACF,EACRO,EACEb,EAAaW,CAAO,EACpBc,EAAO,OAAAd,EAAS,GAAGW,CAAU,KAAKC,CAAU,EAAE,EAChDE,EAAAA,OAAOd,EAAS,qBAAqBY,CAAU,EAAE,EAEnDN,GAAaT,GAAW,CAACF,IAASkB,EAAa,YAAYA,CAAU,IAGrEH,IAAsBG,EAAA,YAE1B,MAAME,EAAc,IAAM,CACxBjB,EAAW,CAACD,CAAO,CACrB,EAGE,OAAAmB,EAAA,kBAAA,IAAC9B,EAAA,CACC,UAAW+B,EAAK,MAAM,EACrB,GAAGrB,EACJ,QAASmB,EACT,YAAa,IAAMjB,EAAW,EAAK,EACnC,WAAY,IAAMA,EAAW,EAAI,EAEhC,SAAAe,CAAA,CACH,CAEJ"}
+{"version":3,"file":"ActivityDate.cjs.js","sources":["../../../../../../src/containers/Feed/components/ActivityDate.tsx"],"sourcesContent":["import {\n  format,\n  formatDistanceToNow,\n  isValid,\n  isToday,\n  isSameYear,\n  isSameDay,\n  isSameWeek,\n  isSameMinute,\n} from 'date-fns'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\nimport { useState } from 'react'\nimport { theme } from '@ynput/ayon-react-components'\n\nconst DateStyled = styled.span`\n  margin-left: auto;\n  color: var(--md-sys-color-outline);\n  user-select: none;\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  flex-shrink: 3;\n  min-width: 0;\n  max-width: fit-content;\n\n  ${theme.bodySmall}\n`\n\nexport const getFuzzyDate = (date: Date) => {\n  let fuzzyDate = formatDistanceToNow(date, { addSuffix: true })\n\n  // remove 'about' from the string\n  fuzzyDate = fuzzyDate.replace('about', '')\n  // replace minutes with min\n  fuzzyDate = fuzzyDate.replace('minutes', 'mins')\n  fuzzyDate = fuzzyDate.replace('minute', 'min')\n  // remove the word ' ago'\n  fuzzyDate = fuzzyDate.replace(' ago', '')\n\n  // if date is less than a minute ago, return 'Just now'\n  if (isSameMinute(date, new Date())) fuzzyDate = 'Just now'\n\n  return fuzzyDate\n}\n\ninterface ActivityDateProps extends React.HTMLAttributes<HTMLElement> {\n  date?: string\n  isExact?: boolean\n}\n\nconst ActivityDate = ({ date, isExact, ...props }: ActivityDateProps) => {\n  const [isFuzzy, setIsFuzzy] = useState(true)\n  if (!date) return null\n  const dateObj = new Date(date)\n  if (!isValid(dateObj)) return null\n\n  // is date over a day old?\n  const today = isToday(dateObj)\n  const sameYear = isSameYear(dateObj, new Date())\n  const yesterday = isSameDay(dateObj, new Date(new Date().setDate(new Date().getDate() - 1)))\n  const sameWeek = isSameWeek(dateObj, new Date())\n  const sameMin = isSameMinute(dateObj, new Date())\n\n  const dateFormat = yesterday ? '' : sameYear ? (sameWeek ? 'E' : 'MMM d') : 'MMM d yyyy'\n  const timeFormat = 'h:mm a'\n\n  let dateString =\n    isFuzzy && !isExact\n      ? today\n        ? getFuzzyDate(dateObj)\n        : format(dateObj, `${dateFormat}, ${timeFormat}`)\n      : format(dateObj, `EEEE, dd MMM yyyy ${timeFormat}`)\n\n  if (yesterday && isFuzzy && !isExact) dateString = `Yesterday${dateString}`\n\n  // if less than a minute ago overwrite the date string\n  if (sameMin) dateString = 'Just now'\n\n  const toggleFuzzy = () => {\n    setIsFuzzy(!isFuzzy)\n  }\n\n  return (\n    <DateStyled\n      className={clsx('date')}\n      {...props}\n      onClick={toggleFuzzy}\n      onMouseOver={() => setIsFuzzy(false)}\n      onMouseOut={() => setIsFuzzy(true)}\n    >\n      {dateString}\n    </DateStyled>\n  )\n}\n\nexport default ActivityDate\n"],"names":["DateStyled","styled","theme","getFuzzyDate","date","fuzzyDate","formatDistanceToNow","isSameMinute","ActivityDate","isExact","props","isFuzzy","setIsFuzzy","useState","dateObj","isValid","today","isToday","sameYear","isSameYear","yesterday","isSameDay","sameWeek","isSameWeek","sameMin","dateFormat","timeFormat","dateString","format","toggleFuzzy","jsx","clsx"],"mappings":"8SAeMA,EAAaC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAatBC,QAAM,SAAS;AAAA,EAGNC,EAAgBC,GAAe,CAC1C,IAAIC,EAAYC,EAAAA,oBAAoBF,EAAM,CAAE,UAAW,GAAM,EAGjD,OAAAC,EAAAA,EAAU,QAAQ,QAAS,EAAE,EAE7BA,EAAAA,EAAU,QAAQ,UAAW,MAAM,EACnCA,EAAAA,EAAU,QAAQ,SAAU,KAAK,EAEjCA,EAAAA,EAAU,QAAQ,OAAQ,EAAE,EAGpCE,EAAAA,aAAaH,EAAM,IAAI,IAAM,IAAeC,EAAA,YAEzCA,CACT,EAOMG,EAAe,CAAC,CAAE,KAAAJ,EAAM,QAAAK,EAAS,GAAGC,KAA+B,CACvE,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAI,EACvC,GAAA,CAACT,EAAa,OAAA,KACZ,MAAAU,EAAU,IAAI,KAAKV,CAAI,EAC7B,GAAI,CAACW,EAAA,QAAQD,CAAO,EAAU,OAAA,KAGxB,MAAAE,EAAQC,UAAQH,CAAO,EACvBI,EAAWC,EAAA,WAAWL,EAAS,IAAI,IAAM,EACzCM,EAAYC,EAAAA,UAAUP,EAAS,IAAI,SAAS,KAAK,EAAE,QAAQ,IAAI,KAAO,EAAA,QAAA,EAAY,CAAC,CAAC,CAAC,EACrFQ,EAAWC,EAAA,WAAWT,EAAS,IAAI,IAAM,EACzCU,EAAUjB,EAAA,aAAaO,EAAS,IAAI,IAAM,EAE1CW,EAAaL,EAAY,GAAKF,EAAYI,EAAW,IAAM,QAAW,aACtEI,EAAa,SAEf,IAAAC,EACFhB,GAAW,CAACF,EACRO,EACEb,EAAaW,CAAO,EACpBc,EAAO,OAAAd,EAAS,GAAGW,CAAU,KAAKC,CAAU,EAAE,EAChDE,EAAAA,OAAOd,EAAS,qBAAqBY,CAAU,EAAE,EAEnDN,GAAaT,GAAW,CAACF,IAASkB,EAAa,YAAYA,CAAU,IAGrEH,IAAsBG,EAAA,YAE1B,MAAME,EAAc,IAAM,CACxBjB,EAAW,CAACD,CAAO,CACrB,EAGE,OAAAmB,EAAA,kBAAA,IAAC9B,EAAA,CACC,UAAW+B,EAAK,MAAM,EACrB,GAAGrB,EACJ,QAASmB,EACT,YAAa,IAAMjB,EAAW,EAAK,EACnC,WAAY,IAAMA,EAAW,EAAI,EAEhC,SAAAe,CAAA,CACH,CAEJ"}

package/dist/shared/src/containers/Feed/components/ActivityDate.es.js

@@ -1,38 +1,43 @@
-import { j as w } from "../../../../../_virtual/jsx-runtime.es.js";
-import { isValid as M, isToday as z, isSameYear as S, isSameDay as g, isSameWeek as x, isSameMinute as l, format as m, formatDistanceToNow as F } from "date-fns";
-import E from "clsx";
-import $ from "styled-components";
-import { useState as h } from "react";
-import { theme as j } from "@ynput/ayon-react-components";
-const b = $.span`
+import { j as D } from "../../../../../_virtual/jsx-runtime.es.js";
+import { isValid as M, isToday as z, isSameYear as x, isSameDay as S, isSameWeek as g, isSameMinute as l, format as m, formatDistanceToNow as h } from "date-fns";
+import F from "clsx";
+import v from "styled-components";
+import { useState as E } from "react";
+import { theme as $ } from "@ynput/ayon-react-components";
+const j = v.span`
   margin-left: auto;
   color: var(--md-sys-color-outline);
   user-select: none;
   white-space: nowrap;
   display: flex;
   align-items: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  flex-shrink: 3;
+  min-width: 0;
+  max-width: fit-content;
 
-  ${j.bodySmall}
+  ${$.bodySmall}
 `, k = (a) => {
-  let e = F(a, { addSuffix: !0 });
+  let e = h(a, { addSuffix: !0 });
   return e = e.replace("about", ""), e = e.replace("minutes", "mins"), e = e.replace("minute", "min"), e = e.replace(" ago", ""), l(a, /* @__PURE__ */ new Date()) && (e = "Just now"), e;
 }, W = ({ date: a, isExact: e, ...u }) => {
-  const [s, n] = h(!0);
+  const [s, n] = E(!0);
   if (!a) return null;
   const t = new Date(a);
   if (!M(t)) return null;
-  const c = z(t), y = S(t, /* @__PURE__ */ new Date()), r = g(t, new Date((/* @__PURE__ */ new Date()).setDate((/* @__PURE__ */ new Date()).getDate() - 1))), d = x(t, /* @__PURE__ */ new Date()), f = l(t, /* @__PURE__ */ new Date()), p = r ? "" : y ? d ? "E" : "MMM d" : "MMM d yyyy", i = "h:mm a";
+  const c = z(t), y = x(t, /* @__PURE__ */ new Date()), r = S(t, new Date((/* @__PURE__ */ new Date()).setDate((/* @__PURE__ */ new Date()).getDate() - 1))), d = g(t, /* @__PURE__ */ new Date()), f = l(t, /* @__PURE__ */ new Date()), p = r ? "" : y ? d ? "E" : "MMM d" : "MMM d yyyy", i = "h:mm a";
   let o = s && !e ? c ? k(t) : m(t, `${p}, ${i}`) : m(t, `EEEE, dd MMM yyyy ${i}`);
   r && s && !e && (o = `Yesterday${o}`), f && (o = "Just now");
-  const D = () => {
+  const w = () => {
     n(!s);
   };
-  return /* @__PURE__ */ w.jsx(
-    b,
+  return /* @__PURE__ */ D.jsx(
+    j,
     {
-      className: E("date"),
+      className: F("date"),
       ...u,
-      onClick: D,
+      onClick: w,
       onMouseOver: () => n(!1),
       onMouseOut: () => n(!0),
       children: o

package/dist/shared/src/containers/Feed/components/ActivityDate.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityDate.es.js","sources":["../../../../../../src/containers/Feed/components/ActivityDate.tsx"],"sourcesContent":["import {\n  format,\n  formatDistanceToNow,\n  isValid,\n  isToday,\n  isSameYear,\n  isSameDay,\n  isSameWeek,\n  isSameMinute,\n} from 'date-fns'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\nimport { useState } from 'react'\nimport { theme } from '@ynput/ayon-react-components'\n\nconst DateStyled = styled.span`\n  margin-left: auto;\n  color: var(--md-sys-color-outline);\n  user-select: none;\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n\n  ${theme.bodySmall}\n`\n\nexport const getFuzzyDate = (date: Date) => {\n  let fuzzyDate = formatDistanceToNow(date, { addSuffix: true })\n\n  // remove 'about' from the string\n  fuzzyDate = fuzzyDate.replace('about', '')\n  // replace minutes with min\n  fuzzyDate = fuzzyDate.replace('minutes', 'mins')\n  fuzzyDate = fuzzyDate.replace('minute', 'min')\n  // remove the word ' ago'\n  fuzzyDate = fuzzyDate.replace(' ago', '')\n\n  // if date is less than a minute ago, return 'Just now'\n  if (isSameMinute(date, new Date())) fuzzyDate = 'Just now'\n\n  return fuzzyDate\n}\n\ninterface ActivityDateProps extends React.HTMLAttributes<HTMLElement> {\n  date?: string\n  isExact?: boolean\n}\n\nconst ActivityDate = ({ date, isExact, ...props }: ActivityDateProps) => {\n  const [isFuzzy, setIsFuzzy] = useState(true)\n  if (!date) return null\n  const dateObj = new Date(date)\n  if (!isValid(dateObj)) return null\n\n  // is date over a day old?\n  const today = isToday(dateObj)\n  const sameYear = isSameYear(dateObj, new Date())\n  const yesterday = isSameDay(dateObj, new Date(new Date().setDate(new Date().getDate() - 1)))\n  const sameWeek = isSameWeek(dateObj, new Date())\n  const sameMin = isSameMinute(dateObj, new Date())\n\n  const dateFormat = yesterday ? '' : sameYear ? (sameWeek ? 'E' : 'MMM d') : 'MMM d yyyy'\n  const timeFormat = 'h:mm a'\n\n  let dateString =\n    isFuzzy && !isExact\n      ? today\n        ? getFuzzyDate(dateObj)\n        : format(dateObj, `${dateFormat}, ${timeFormat}`)\n      : format(dateObj, `EEEE, dd MMM yyyy ${timeFormat}`)\n\n  if (yesterday && isFuzzy && !isExact) dateString = `Yesterday${dateString}`\n\n  // if less than a minute ago overwrite the date string\n  if (sameMin) dateString = 'Just now'\n\n  const toggleFuzzy = () => {\n    setIsFuzzy(!isFuzzy)\n  }\n\n  return (\n    <DateStyled\n      className={clsx('date')}\n      {...props}\n      onClick={toggleFuzzy}\n      onMouseOver={() => setIsFuzzy(false)}\n      onMouseOut={() => setIsFuzzy(true)}\n    >\n      {dateString}\n    </DateStyled>\n  )\n}\n\nexport default ActivityDate\n"],"names":["DateStyled","styled","theme","getFuzzyDate","date","fuzzyDate","formatDistanceToNow","isSameMinute","ActivityDate","isExact","props","isFuzzy","setIsFuzzy","useState","dateObj","isValid","today","isToday","sameYear","isSameYear","yesterday","isSameDay","sameWeek","isSameWeek","sameMin","dateFormat","timeFormat","dateString","format","toggleFuzzy","jsx","clsx"],"mappings":";;;;;;AAeA,MAAMA,IAAaC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQtBC,EAAM,SAAS;AAAA,GAGNC,IAAe,CAACC,MAAe;AAC1C,MAAIC,IAAYC,EAAoBF,GAAM,EAAE,WAAW,IAAM;AAGjD,SAAAC,IAAAA,EAAU,QAAQ,SAAS,EAAE,GAE7BA,IAAAA,EAAU,QAAQ,WAAW,MAAM,GACnCA,IAAAA,EAAU,QAAQ,UAAU,KAAK,GAEjCA,IAAAA,EAAU,QAAQ,QAAQ,EAAE,GAGpCE,EAAaH,GAAM,oBAAI,KAAK,CAAC,MAAeC,IAAA,aAEzCA;AACT,GAOMG,IAAe,CAAC,EAAE,MAAAJ,GAAM,SAAAK,GAAS,GAAGC,QAA+B;AACvE,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAI;AACvC,MAAA,CAACT,EAAa,QAAA;AACZ,QAAAU,IAAU,IAAI,KAAKV,CAAI;AAC7B,MAAI,CAACW,EAAQD,CAAO,EAAU,QAAA;AAGxB,QAAAE,IAAQC,EAAQH,CAAO,GACvBI,IAAWC,EAAWL,GAAS,oBAAI,MAAM,GACzCM,IAAYC,EAAUP,GAAS,IAAI,0BAAS,KAAK,GAAE,SAAQ,oBAAI,KAAO,GAAA,QAAA,IAAY,CAAC,CAAC,CAAC,GACrFQ,IAAWC,EAAWT,GAAS,oBAAI,MAAM,GACzCU,IAAUjB,EAAaO,GAAS,oBAAI,MAAM,GAE1CW,IAAaL,IAAY,KAAKF,IAAYI,IAAW,MAAM,UAAW,cACtEI,IAAa;AAEf,MAAAC,IACFhB,KAAW,CAACF,IACRO,IACEb,EAAaW,CAAO,IACpBc,EAAOd,GAAS,GAAGW,CAAU,KAAKC,CAAU,EAAE,IAChDE,EAAOd,GAAS,qBAAqBY,CAAU,EAAE;AAEvD,EAAIN,KAAaT,KAAW,CAACF,MAASkB,IAAa,YAAYA,CAAU,KAGrEH,MAAsBG,IAAA;AAE1B,QAAME,IAAc,MAAM;AACxB,IAAAjB,EAAW,CAACD,CAAO;AAAA,EACrB;AAGE,SAAAmB,gBAAAA,EAAA;AAAA,IAAC9B;AAAA,IAAA;AAAA,MACC,WAAW+B,EAAK,MAAM;AAAA,MACrB,GAAGrB;AAAA,MACJ,SAASmB;AAAA,MACT,aAAa,MAAMjB,EAAW,EAAK;AAAA,MACnC,YAAY,MAAMA,EAAW,EAAI;AAAA,MAEhC,UAAAe;AAAA,IAAA;AAAA,EACH;AAEJ;"}
+{"version":3,"file":"ActivityDate.es.js","sources":["../../../../../../src/containers/Feed/components/ActivityDate.tsx"],"sourcesContent":["import {\n  format,\n  formatDistanceToNow,\n  isValid,\n  isToday,\n  isSameYear,\n  isSameDay,\n  isSameWeek,\n  isSameMinute,\n} from 'date-fns'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\nimport { useState } from 'react'\nimport { theme } from '@ynput/ayon-react-components'\n\nconst DateStyled = styled.span`\n  margin-left: auto;\n  color: var(--md-sys-color-outline);\n  user-select: none;\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  flex-shrink: 3;\n  min-width: 0;\n  max-width: fit-content;\n\n  ${theme.bodySmall}\n`\n\nexport const getFuzzyDate = (date: Date) => {\n  let fuzzyDate = formatDistanceToNow(date, { addSuffix: true })\n\n  // remove 'about' from the string\n  fuzzyDate = fuzzyDate.replace('about', '')\n  // replace minutes with min\n  fuzzyDate = fuzzyDate.replace('minutes', 'mins')\n  fuzzyDate = fuzzyDate.replace('minute', 'min')\n  // remove the word ' ago'\n  fuzzyDate = fuzzyDate.replace(' ago', '')\n\n  // if date is less than a minute ago, return 'Just now'\n  if (isSameMinute(date, new Date())) fuzzyDate = 'Just now'\n\n  return fuzzyDate\n}\n\ninterface ActivityDateProps extends React.HTMLAttributes<HTMLElement> {\n  date?: string\n  isExact?: boolean\n}\n\nconst ActivityDate = ({ date, isExact, ...props }: ActivityDateProps) => {\n  const [isFuzzy, setIsFuzzy] = useState(true)\n  if (!date) return null\n  const dateObj = new Date(date)\n  if (!isValid(dateObj)) return null\n\n  // is date over a day old?\n  const today = isToday(dateObj)\n  const sameYear = isSameYear(dateObj, new Date())\n  const yesterday = isSameDay(dateObj, new Date(new Date().setDate(new Date().getDate() - 1)))\n  const sameWeek = isSameWeek(dateObj, new Date())\n  const sameMin = isSameMinute(dateObj, new Date())\n\n  const dateFormat = yesterday ? '' : sameYear ? (sameWeek ? 'E' : 'MMM d') : 'MMM d yyyy'\n  const timeFormat = 'h:mm a'\n\n  let dateString =\n    isFuzzy && !isExact\n      ? today\n        ? getFuzzyDate(dateObj)\n        : format(dateObj, `${dateFormat}, ${timeFormat}`)\n      : format(dateObj, `EEEE, dd MMM yyyy ${timeFormat}`)\n\n  if (yesterday && isFuzzy && !isExact) dateString = `Yesterday${dateString}`\n\n  // if less than a minute ago overwrite the date string\n  if (sameMin) dateString = 'Just now'\n\n  const toggleFuzzy = () => {\n    setIsFuzzy(!isFuzzy)\n  }\n\n  return (\n    <DateStyled\n      className={clsx('date')}\n      {...props}\n      onClick={toggleFuzzy}\n      onMouseOver={() => setIsFuzzy(false)}\n      onMouseOut={() => setIsFuzzy(true)}\n    >\n      {dateString}\n    </DateStyled>\n  )\n}\n\nexport default ActivityDate\n"],"names":["DateStyled","styled","theme","getFuzzyDate","date","fuzzyDate","formatDistanceToNow","isSameMinute","ActivityDate","isExact","props","isFuzzy","setIsFuzzy","useState","dateObj","isValid","today","isToday","sameYear","isSameYear","yesterday","isSameDay","sameWeek","isSameWeek","sameMin","dateFormat","timeFormat","dateString","format","toggleFuzzy","jsx","clsx"],"mappings":";;;;;;AAeA,MAAMA,IAAaC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAatBC,EAAM,SAAS;AAAA,GAGNC,IAAe,CAACC,MAAe;AAC1C,MAAIC,IAAYC,EAAoBF,GAAM,EAAE,WAAW,IAAM;AAGjD,SAAAC,IAAAA,EAAU,QAAQ,SAAS,EAAE,GAE7BA,IAAAA,EAAU,QAAQ,WAAW,MAAM,GACnCA,IAAAA,EAAU,QAAQ,UAAU,KAAK,GAEjCA,IAAAA,EAAU,QAAQ,QAAQ,EAAE,GAGpCE,EAAaH,GAAM,oBAAI,KAAK,CAAC,MAAeC,IAAA,aAEzCA;AACT,GAOMG,IAAe,CAAC,EAAE,MAAAJ,GAAM,SAAAK,GAAS,GAAGC,QAA+B;AACvE,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAS,EAAI;AACvC,MAAA,CAACT,EAAa,QAAA;AACZ,QAAAU,IAAU,IAAI,KAAKV,CAAI;AAC7B,MAAI,CAACW,EAAQD,CAAO,EAAU,QAAA;AAGxB,QAAAE,IAAQC,EAAQH,CAAO,GACvBI,IAAWC,EAAWL,GAAS,oBAAI,MAAM,GACzCM,IAAYC,EAAUP,GAAS,IAAI,0BAAS,KAAK,GAAE,SAAQ,oBAAI,KAAO,GAAA,QAAA,IAAY,CAAC,CAAC,CAAC,GACrFQ,IAAWC,EAAWT,GAAS,oBAAI,MAAM,GACzCU,IAAUjB,EAAaO,GAAS,oBAAI,MAAM,GAE1CW,IAAaL,IAAY,KAAKF,IAAYI,IAAW,MAAM,UAAW,cACtEI,IAAa;AAEf,MAAAC,IACFhB,KAAW,CAACF,IACRO,IACEb,EAAaW,CAAO,IACpBc,EAAOd,GAAS,GAAGW,CAAU,KAAKC,CAAU,EAAE,IAChDE,EAAOd,GAAS,qBAAqBY,CAAU,EAAE;AAEvD,EAAIN,KAAaT,KAAW,CAACF,MAASkB,IAAa,YAAYA,CAAU,KAGrEH,MAAsBG,IAAA;AAE1B,QAAME,IAAc,MAAM;AACxB,IAAAjB,EAAW,CAACD,CAAO;AAAA,EACrB;AAGE,SAAAmB,gBAAAA,EAAA;AAAA,IAAC9B;AAAA,IAAA;AAAA,MACC,WAAW+B,EAAK,MAAM;AAAA,MACrB,GAAGrB;AAAA,MACJ,SAASmB;AAAA,MACT,aAAa,MAAMjB,EAAW,EAAK;AAAA,MACnC,YAAY,MAAMA,EAAW,EAAI;AAAA,MAEhC,UAAAe;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/shared/src/containers/Feed/components/ActivityVersions/ActivityVersions.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const e=require("../../../../../../_virtual/jsx-runtime.cjs.js"),p=require("react"),b=require("@ynput/ayon-react-components"),f=require("../ActivityHeader/ActivityHeader.cjs.js"),t=require("./ActivityVersions.styled.cjs.js"),k=require("../ActivityGroup/ActivityGroup.styled.cjs.js"),w=require("../ActivityDate.cjs.js");require("../../../../context/RemoteModulesContext.cjs.js");const D=require("../../../../context/DetailsPanelContext.cjs.js");require("../../../../context/ThumbnailUploaderContext.cjs.js");require("../../../../context/SettingsPanelContext.cjs.js");require("../../../../context/pip/PiPProvider.cjs.js");require("react-dom");require("../../../../context/pip/PiPWrapper.cjs.js");require("../../../../context/AddonProjectContext.cjs.js");require("../../../../context/AddonContext.cjs.js");require("../../../../context/PowerpackContext.cjs.js");require("../../../../context/MoveEntityContext.cjs.js");const N=({activity:l,projectName:s,entityType:h,onReferenceClick:q,filter:a})=>{const{onOpenViewer:r}=D.useDetailsPanelContext();let{authorName:m,authorFullName:E,createdAt:d,versions:n=[]}=l;const[i,R]=p.useState(a==="versions"),o=2,[y,v]=p.useState(!1),A=(u,x)=>r==null?void 0:r({versionIds:[u],productId:x,projectName:s});return e.jsxRuntimeExports.jsxs(t.Container,{children:[e.jsxRuntimeExports.jsx(f,{name:m,fullName:E||m,date:d,activity:l,projectName:s,entityType:h,onReferenceClick:q}),n.flatMap((u,x)=>{const{name:C,id:c,productId:S,productName:I,updatedAt:T,comment:j}=u;return(x<o||i)&&e.jsxRuntimeExports.jsxs(t.Card,{onClick:()=>A(c,S),children:[e.jsxRuntimeExports.jsxs(t.Content,{children:[e.jsxRuntimeExports.jsxs("div",{children:[e.jsxRuntimeExports.jsxs(t.Title,{children:[e.jsxRuntimeExports.jsx("span",{children:I}),e.jsxRuntimeExports.jsx(w.default,{date:d,isExact:!0})]}),e.jsxRuntimeExports.jsx("span",{className:"version",children:C})]}),e.jsxRuntimeExports.jsx(t.Thumbnail,{projectName:s,entityId:c,entityType:"version",onError:()=>v(!0),iconOnly:y,entityUpdatedAt:T,icon:"play_circle"})]}),j&&e.jsxRuntimeExports.jsx(t.Comment,{children:j})]},c)}),a!=="versions"&&n.length>o&&e.jsxRuntimeExports.jsxs(k.More,{onClick:()=>R(!i),children:[e.jsxRuntimeExports.jsx(b.Icon,{icon:"more"}),e.jsxRuntimeExports.jsx("span",{children:i?"Show less":`Show ${n.length-o} more versions`})]})]})};module.exports=N;
+"use strict";const e=require("../../../../../../_virtual/jsx-runtime.cjs.js"),p=require("react"),T=require("@ynput/ayon-react-components"),b=require("../ActivityHeader/ActivityHeader.cjs.js"),t=require("./ActivityVersions.styled.cjs.js"),f=require("../ActivityGroup/ActivityGroup.styled.cjs.js"),k=require("../ActivityDate.cjs.js");require("../../../../context/RemoteModulesContext.cjs.js");const w=require("../../../../context/DetailsPanelContext.cjs.js");require("../../../../context/ThumbnailUploaderContext.cjs.js");require("../../../../context/SettingsPanelContext.cjs.js");require("../../../../context/pip/PiPProvider.cjs.js");require("react-dom");require("../../../../context/pip/PiPWrapper.cjs.js");require("../../../../context/AddonProjectContext.cjs.js");require("../../../../context/AddonContext.cjs.js");require("../../../../context/PowerpackContext.cjs.js");require("../../../../context/MoveEntityContext.cjs.js");require("../../../../context/MenuContext.cjs.js");const D=({activity:l,projectName:s,entityType:h,onReferenceClick:q,filter:a})=>{const{onOpenViewer:r}=w.useDetailsPanelContext();let{authorName:m,authorFullName:E,createdAt:d,versions:n=[]}=l;const[i,R]=p.useState(a==="versions"),o=2,[y,v]=p.useState(!1),A=(u,x)=>r==null?void 0:r({versionIds:[u],productId:x,projectName:s});return e.jsxRuntimeExports.jsxs(t.Container,{children:[e.jsxRuntimeExports.jsx(b,{name:m,fullName:E||m,date:d,activity:l,projectName:s,entityType:h,onReferenceClick:q}),n.flatMap((u,x)=>{const{name:C,id:c,productId:S,productName:I,updatedAt:N,comment:j}=u;return(x<o||i)&&e.jsxRuntimeExports.jsxs(t.Card,{onClick:()=>A(c,S),children:[e.jsxRuntimeExports.jsxs(t.Content,{children:[e.jsxRuntimeExports.jsxs("div",{children:[e.jsxRuntimeExports.jsxs(t.Title,{children:[e.jsxRuntimeExports.jsx("span",{children:I}),e.jsxRuntimeExports.jsx(k.default,{date:d,isExact:!0})]}),e.jsxRuntimeExports.jsx(t.VersionName,{className:"version",children:C})]}),e.jsxRuntimeExports.jsx(t.Thumbnail,{projectName:s,entityId:c,entityType:"version",onError:()=>v(!0),iconOnly:y,entityUpdatedAt:N,icon:"play_circle"})]}),j&&e.jsxRuntimeExports.jsx(t.Comment,{children:j})]},c)}),a!=="versions"&&n.length>o&&e.jsxRuntimeExports.jsxs(f.More,{onClick:()=>R(!i),children:[e.jsxRuntimeExports.jsx(T.Icon,{icon:"more"}),e.jsxRuntimeExports.jsx("span",{children:i?"Show less":`Show ${n.length-o} more versions`})]})]})};module.exports=D;
 //# sourceMappingURL=ActivityVersions.cjs.js.map

package/dist/shared/src/containers/Feed/components/ActivityVersions/ActivityVersions.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActivityVersions.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityVersions/ActivityVersions.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { Icon } from '@ynput/ayon-react-components'\nimport ActivityHeader from '../ActivityHeader/ActivityHeader'\nimport * as Styled from './ActivityVersions.styled'\nimport { More } from '../ActivityGroup/ActivityGroup.styled'\nimport ActivityDate from '../ActivityDate'\nimport { useDetailsPanelContext } from '@shared/context'\n\ninterface Version {\n  name: string\n  id: string\n  productId: string\n  productName: string\n  updatedAt: string\n  comment?: string\n}\n\ninterface ActivityVersionsProps {\n  activity: {\n    authorName?: string\n    authorFullName?: string\n    createdAt?: string\n    versions?: Version[]\n    [key: string]: any\n  }\n  projectName: string\n  entityType?: string\n  onReferenceClick?: (ref: any) => void\n  filter?: string\n}\n\nconst ActivityVersions: React.FC<ActivityVersionsProps> = ({\n  activity,\n  projectName,\n  entityType,\n  onReferenceClick,\n  filter,\n}) => {\n  const { onOpenViewer } = useDetailsPanelContext()\n  let { authorName, authorFullName, createdAt, versions = [] } = activity\n\n  const [showAll, setShowAll] = useState(filter === 'versions')\n  const limit = 2\n\n  const [thumbnailError, setThumbnailError] = useState(false)\n\n  const handleClick = (versionId: string, productId: string) =>\n    onOpenViewer?.({ versionIds: [versionId], productId, projectName })\n\n  return (\n    <Styled.Container>\n      <ActivityHeader\n        name={authorName}\n        fullName={authorFullName || authorName}\n        date={createdAt}\n        activity={activity}\n        projectName={projectName}\n        entityType={entityType}\n        onReferenceClick={onReferenceClick}\n      />\n      {versions.flatMap((version, index) => {\n        const { name, id, productId, productName, updatedAt, comment } = version\n        return (\n          (index < limit || showAll) && (\n            <Styled.Card onClick={() => handleClick(id, productId)} key={id}>\n              <Styled.Content>\n                <div>\n                  <Styled.Title>\n                    <span>{productName}</span>\n                    <ActivityDate date={createdAt} isExact />\n                  </Styled.Title>\n                  <span className=\"version\">{name}</span>\n                </div>\n                <Styled.Thumbnail\n                  {...{ projectName }}\n                  entityId={id}\n                  entityType=\"version\"\n                  onError={() => setThumbnailError(true)}\n                  iconOnly={thumbnailError}\n                  entityUpdatedAt={updatedAt}\n                  icon={'play_circle'}\n                />\n              </Styled.Content>\n              {comment && <Styled.Comment>{comment}</Styled.Comment>}\n            </Styled.Card>\n          )\n        )\n      })}\n      {filter !== 'versions' && versions.length > limit && (\n        <More onClick={() => setShowAll(!showAll)}>\n          <Icon icon=\"more\" />\n          <span>{showAll ? `Show less` : `Show ${versions.length - limit} more versions`}</span>\n        </More>\n      )}\n    </Styled.Container>\n  )\n}\n\nexport default ActivityVersions\n"],"names":["ActivityVersions","activity","projectName","entityType","onReferenceClick","filter","onOpenViewer","useDetailsPanelContext","authorName","authorFullName","createdAt","versions","showAll","setShowAll","useState","limit","thumbnailError","setThumbnailError","handleClick","versionId","productId","jsxs","Styled.Container","jsx","ActivityHeader","version","index","name","id","productName","updatedAt","comment","Styled.Card","Styled.Content","Styled.Title","ActivityDate","Styled.Thumbnail","Styled.Comment","More","Icon"],"mappings":"+5BA+BA,MAAMA,EAAoD,CAAC,CACzD,SAAAC,EACA,YAAAC,EACA,WAAAC,EACA,iBAAAC,EACA,OAAAC,CACF,IAAM,CACE,KAAA,CAAE,aAAAC,CAAa,EAAIC,yBAAuB,EAChD,GAAI,CAAE,WAAAC,EAAY,eAAAC,EAAgB,UAAAC,EAAW,SAAAC,EAAW,IAAOV,EAE/D,KAAM,CAACW,EAASC,CAAU,EAAIC,EAAAA,SAAST,IAAW,UAAU,EACtDU,EAAQ,EAER,CAACC,EAAgBC,CAAiB,EAAIH,EAAAA,SAAS,EAAK,EAEpDI,EAAc,CAACC,EAAmBC,IACtCd,GAAA,YAAAA,EAAe,CAAE,WAAY,CAACa,CAAS,EAAG,UAAAC,EAAW,YAAAlB,CAAA,GAGrD,OAAAmB,EAAA,kBAAA,KAACC,YAAA,CACC,SAAA,CAAAC,EAAA,kBAAA,IAACC,EAAA,CACC,KAAMhB,EACN,SAAUC,GAAkBD,EAC5B,KAAME,EACN,SAAAT,EACA,YAAAC,EACA,WAAAC,EACA,iBAAAC,CAAA,CACF,EACCO,EAAS,QAAQ,CAACc,EAASC,IAAU,CACpC,KAAM,CAAE,KAAAC,EAAM,GAAAC,EAAI,UAAAR,EAAW,YAAAS,EAAa,UAAAC,EAAW,QAAAC,GAAYN,EACjE,OACGC,EAAQX,GAASH,IAChBS,EAAA,kBAAA,KAACW,EAAO,KAAP,CAAY,QAAS,IAAMd,EAAYU,EAAIR,CAAS,EACnD,SAAA,CAACC,yBAAAY,EAAAA,QAAA,CACC,SAAA,CAAAZ,yBAAC,MACC,CAAA,SAAA,CAACA,yBAAAa,EAAAA,MAAA,CACC,SAAA,CAAAX,EAAAA,kBAAAA,IAAC,QAAM,SAAYM,CAAA,CAAA,EAClBN,EAAA,kBAAA,IAAAY,EAAA,QAAA,CAAa,KAAMzB,EAAW,QAAO,EAAC,CAAA,CAAA,EACzC,EACCa,EAAA,kBAAA,IAAA,OAAA,CAAK,UAAU,UAAW,SAAKI,CAAA,CAAA,CAAA,EAClC,EACAJ,EAAA,kBAAA,IAACa,EAAO,UAAP,CACO,YAAAlC,EACN,SAAU0B,EACV,WAAW,UACX,QAAS,IAAMX,EAAkB,EAAI,EACrC,SAAUD,EACV,gBAAiBc,EACjB,KAAM,aAAA,CAAA,CACR,EACF,EACCC,GAAWR,EAAAA,kBAAAA,IAACc,EAAAA,QAAA,CAAgB,SAAQN,CAAA,CAAA,CAAA,CAAA,EAnBsBH,CAoB7D,CAAA,CAGL,EACAvB,IAAW,YAAcM,EAAS,OAASI,GAC1CM,EAAA,kBAAA,KAACiB,OAAK,CAAA,QAAS,IAAMzB,EAAW,CAACD,CAAO,EACtC,SAAA,CAACW,EAAAA,kBAAAA,IAAAgB,EAAA,KAAA,CAAK,KAAK,MAAO,CAAA,EAClBhB,EAAAA,kBAAAA,IAAC,QAAM,SAAUX,EAAA,YAAc,QAAQD,EAAS,OAASI,CAAK,gBAAiB,CAAA,CAAA,CACjF,CAAA,CAAA,EAEJ,CAEJ"}
+{"version":3,"file":"ActivityVersions.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityVersions/ActivityVersions.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport { Icon } from '@ynput/ayon-react-components'\nimport ActivityHeader from '../ActivityHeader/ActivityHeader'\nimport * as Styled from './ActivityVersions.styled'\nimport { More } from '../ActivityGroup/ActivityGroup.styled'\nimport ActivityDate from '../ActivityDate'\nimport { useDetailsPanelContext } from '@shared/context'\n\ninterface Version {\n  name: string\n  id: string\n  productId: string\n  productName: string\n  updatedAt: string\n  comment?: string\n}\n\ninterface ActivityVersionsProps {\n  activity: {\n    authorName?: string\n    authorFullName?: string\n    createdAt?: string\n    versions?: Version[]\n    [key: string]: any\n  }\n  projectName: string\n  entityType?: string\n  onReferenceClick?: (ref: any) => void\n  filter?: string\n}\n\nconst ActivityVersions: React.FC<ActivityVersionsProps> = ({\n  activity,\n  projectName,\n  entityType,\n  onReferenceClick,\n  filter,\n}) => {\n  const { onOpenViewer } = useDetailsPanelContext()\n  let { authorName, authorFullName, createdAt, versions = [] } = activity\n\n  const [showAll, setShowAll] = useState(filter === 'versions')\n  const limit = 2\n\n  const [thumbnailError, setThumbnailError] = useState(false)\n\n  const handleClick = (versionId: string, productId: string) =>\n    onOpenViewer?.({ versionIds: [versionId], productId, projectName })\n\n  return (\n    <Styled.Container>\n      <ActivityHeader\n        name={authorName}\n        fullName={authorFullName || authorName}\n        date={createdAt}\n        activity={activity}\n        projectName={projectName}\n        entityType={entityType}\n        onReferenceClick={onReferenceClick}\n      />\n      {versions.flatMap((version, index) => {\n        const { name, id, productId, productName, updatedAt, comment } = version\n        return (\n          (index < limit || showAll) && (\n            <Styled.Card onClick={() => handleClick(id, productId)} key={id}>\n              <Styled.Content>\n                <div>\n                  <Styled.Title>\n                    <span>{productName}</span>\n                    <ActivityDate date={createdAt} isExact />\n                  </Styled.Title>\n                  <Styled.VersionName className=\"version\">{name}</Styled.VersionName>\n                </div>\n                <Styled.Thumbnail\n                  {...{ projectName }}\n                  entityId={id}\n                  entityType=\"version\"\n                  onError={() => setThumbnailError(true)}\n                  iconOnly={thumbnailError}\n                  entityUpdatedAt={updatedAt}\n                  icon={'play_circle'}\n                />\n              </Styled.Content>\n              {comment && <Styled.Comment>{comment}</Styled.Comment>}\n            </Styled.Card>\n          )\n        )\n      })}\n      {filter !== 'versions' && versions.length > limit && (\n        <More onClick={() => setShowAll(!showAll)}>\n          <Icon icon=\"more\" />\n          <span>{showAll ? `Show less` : `Show ${versions.length - limit} more versions`}</span>\n        </More>\n      )}\n    </Styled.Container>\n  )\n}\n\nexport default ActivityVersions\n"],"names":["ActivityVersions","activity","projectName","entityType","onReferenceClick","filter","onOpenViewer","useDetailsPanelContext","authorName","authorFullName","createdAt","versions","showAll","setShowAll","useState","limit","thumbnailError","setThumbnailError","handleClick","versionId","productId","jsxs","Styled.Container","jsx","ActivityHeader","version","index","name","id","productName","updatedAt","comment","Styled.Card","Styled.Content","Styled.Title","ActivityDate","Styled.VersionName","Styled.Thumbnail","Styled.Comment","More","Icon"],"mappings":"i9BA+BA,MAAMA,EAAoD,CAAC,CACzD,SAAAC,EACA,YAAAC,EACA,WAAAC,EACA,iBAAAC,EACA,OAAAC,CACF,IAAM,CACE,KAAA,CAAE,aAAAC,CAAa,EAAIC,yBAAuB,EAChD,GAAI,CAAE,WAAAC,EAAY,eAAAC,EAAgB,UAAAC,EAAW,SAAAC,EAAW,IAAOV,EAE/D,KAAM,CAACW,EAASC,CAAU,EAAIC,EAAAA,SAAST,IAAW,UAAU,EACtDU,EAAQ,EAER,CAACC,EAAgBC,CAAiB,EAAIH,EAAAA,SAAS,EAAK,EAEpDI,EAAc,CAACC,EAAmBC,IACtCd,GAAA,YAAAA,EAAe,CAAE,WAAY,CAACa,CAAS,EAAG,UAAAC,EAAW,YAAAlB,CAAA,GAGrD,OAAAmB,EAAA,kBAAA,KAACC,YAAA,CACC,SAAA,CAAAC,EAAA,kBAAA,IAACC,EAAA,CACC,KAAMhB,EACN,SAAUC,GAAkBD,EAC5B,KAAME,EACN,SAAAT,EACA,YAAAC,EACA,WAAAC,EACA,iBAAAC,CAAA,CACF,EACCO,EAAS,QAAQ,CAACc,EAASC,IAAU,CACpC,KAAM,CAAE,KAAAC,EAAM,GAAAC,EAAI,UAAAR,EAAW,YAAAS,EAAa,UAAAC,EAAW,QAAAC,GAAYN,EACjE,OACGC,EAAQX,GAASH,IAChBS,EAAA,kBAAA,KAACW,EAAO,KAAP,CAAY,QAAS,IAAMd,EAAYU,EAAIR,CAAS,EACnD,SAAA,CAACC,yBAAAY,EAAAA,QAAA,CACC,SAAA,CAAAZ,yBAAC,MACC,CAAA,SAAA,CAACA,yBAAAa,EAAAA,MAAA,CACC,SAAA,CAAAX,EAAAA,kBAAAA,IAAC,QAAM,SAAYM,CAAA,CAAA,EAClBN,EAAA,kBAAA,IAAAY,EAAA,QAAA,CAAa,KAAMzB,EAAW,QAAO,EAAC,CAAA,CAAA,EACzC,0BACC0B,EAAO,YAAP,CAAmB,UAAU,UAAW,SAAKT,CAAA,CAAA,CAAA,EAChD,EACAJ,EAAA,kBAAA,IAACc,EAAO,UAAP,CACO,YAAAnC,EACN,SAAU0B,EACV,WAAW,UACX,QAAS,IAAMX,EAAkB,EAAI,EACrC,SAAUD,EACV,gBAAiBc,EACjB,KAAM,aAAA,CAAA,CACR,EACF,EACCC,GAAWR,EAAAA,kBAAAA,IAACe,EAAAA,QAAA,CAAgB,SAAQP,CAAA,CAAA,CAAA,CAAA,EAnBsBH,CAoB7D,CAAA,CAGL,EACAvB,IAAW,YAAcM,EAAS,OAASI,GAC1CM,EAAA,kBAAA,KAACkB,OAAK,CAAA,QAAS,IAAM1B,EAAW,CAACD,CAAO,EACtC,SAAA,CAACW,EAAAA,kBAAAA,IAAAiB,EAAA,KAAA,CAAK,KAAK,MAAO,CAAA,EAClBjB,EAAAA,kBAAAA,IAAC,QAAM,SAAUX,EAAA,YAAc,QAAQD,EAAS,OAASI,CAAK,gBAAiB,CAAA,CAAA,CACjF,CAAA,CAAA,EAEJ,CAEJ"}