@ynput/ayon-frontend-shared 0.2.31 → 0.2.33

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

@@ -1 +1 @@
-{"version":3,"file":"Feed.es.js","sources":["../../../../../src/containers/Feed/Feed.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react'\nimport ActivityItem from './components/ActivityItem'\nimport CommentInput from './components/CommentInput/CommentInput'\nimport * as Styled from './Feed.styled'\nimport useCommentMutations, { Activity } from './hooks/useCommentMutations'\nimport useTransformActivities from './hooks/useTransformActivities'\nimport { InView } from 'react-intersection-observer'\nimport useSaveScrollPos from './hooks/useSaveScrollPos'\nimport useScrollOnInputOpen from './hooks/useScrollOnInputOpen'\nimport { getLoadingPlaceholders } from './feedHelpers'\nimport { Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport useScrollToHighlighted from './hooks/useScrollToHighlighted'\nimport { isFilePreviewable } from './components/FileUploadPreview/FileUploadPreview'\nimport EmptyPlaceholder from '@shared/components/EmptyPlaceholder'\nimport { useFeedContext, FEED_NEW_COMMENT } from './context/FeedContext'\nimport { Status } from '../ProjectTreeTable/types/project'\nimport { useDetailsPanelContext } from '@shared/context'\nimport { DetailsPanelEntityType } from '@shared/api'\nimport mergeAnnotationAttachments from './helpers/mergeAnnotationAttachments'\nimport { SavedAnnotationMetadata } from '.'\n\n// number of activities to get\nexport const activitiesLast = 30\n\nexport type FeedProps = {\n  isMultiProjects: boolean\n  readOnly: boolean\n  statuses: Status[]\n}\n\nexport const Feed = ({ isMultiProjects, readOnly, statuses = [] }: FeedProps) => {\n  const {\n    projectName,\n    entities,\n    entityType,\n    editingId,\n    projectInfo,\n    setEditingId,\n    userName,\n    activitiesData,\n    isLoadingNew,\n    isLoadingNextPage,\n    loadNextPage,\n    hasNextPage,\n    users,\n    currentTab,\n  } = useFeedContext()\n\n  const {\n    openSlideOut,\n    highlightedActivities,\n    setHighlightedActivities,\n    onOpenImage,\n    setFeedAnnotations,\n  } = useDetailsPanelContext()\n\n  // hide comment input for specific filters\n  const hideCommentInput = ['versions'].includes(currentTab)\n\n  const activitiesWithMergedAnnotations = useMemo(\n    () => mergeAnnotationAttachments(activitiesData),\n    [activitiesData],\n  )\n\n  useEffect(() => {\n    if (!activitiesWithMergedAnnotations.length) {\n      setFeedAnnotations([])\n    }\n\n    const annotations = activitiesWithMergedAnnotations\n      .map((activity) =>\n        activity.activityData?.annotations?.map((a: SavedAnnotationMetadata) => ({\n          ...a,\n          activityId: activity.activityId,\n        })),\n      )\n      .filter(Boolean)\n      .flat()\n\n    setFeedAnnotations(annotations)\n  }, [activitiesWithMergedAnnotations])\n\n  // do any transformation on activities data\n  // 1. status change activities, attach status data based on projectName\n  // 2. reverse the order\n  // 3. is this activity from the current user?\n  const transformedActivitiesData = useTransformActivities(\n    // @ts-ignore\n    activitiesWithMergedAnnotations,\n    users,\n    projectInfo,\n    entityType,\n    userName,\n  ) as any[]\n\n  // REFS\n  const feedRef = useRef(null)\n  // const commentInputRef = useRef(null)\n\n  // scroll by height of comment input when it opens or closes\n  useScrollOnInputOpen({ feedRef, isInputOpen: editingId === FEED_NEW_COMMENT, height: 93 })\n\n  // save scroll position of a feed\n  useSaveScrollPos({\n    entities,\n    feedRef,\n    filter: currentTab,\n    disabled: !!highlightedActivities.length,\n    isLoading: isLoadingNew,\n  })\n\n  // try and scroll to highlightedActivities activity\n  useScrollToHighlighted({\n    feedRef,\n    highlighted: highlightedActivities,\n    isLoading: isLoadingNew,\n    loadNextPage,\n    hasNextPage: !!loadNextPage,\n  })\n\n  // comment mutations here!\n  const { submitComment, updateComment, deleteComment, isSaving } = useCommentMutations({\n    projectName,\n    entityType: entityType,\n    entities,\n    filter: currentTab,\n  })\n\n  // When a checkbox is clicked, update the body to add/remove \"x\" in [ ] markdown\n  // Then update comment with new body\n  const handleCommentChecked = (e: React.ChangeEvent<HTMLInputElement>, activity: Activity) => {\n    const target = e?.target\n    if (!target || !activity) return console.log('no target or activity')\n\n    // the value that it's changing to\n    const checked: boolean = target.checked\n    const currentMarkdown: string = checked ? '[ ]' : '[x]'\n    const newMarkdown: string = checked ? '[x]' : '[ ]'\n\n    const { body } = activity\n\n    // based on all li elements in the whole className 'comment-body' with className 'task-list-item'\n    // find the index of the task that was checked\n    const taskIndex: number = Array.from(\n      target.closest('.comment-body')?.querySelectorAll('.task-list-item') || [],\n    ).findIndex((li: Element) => li === target.closest('li'))\n\n    let replaceIndex: number = taskIndex\n\n    // count the number of current markdowns in the body\n    const allMarkdowns: string[] = body.match(/\\[.\\]/g) || []\n\n    allMarkdowns.forEach((markdown: string, index: number) => {\n      // does it match the current markdown?\n      if (markdown !== currentMarkdown && index < taskIndex) replaceIndex--\n    })\n\n    // now find the indexes of the current markdown to replace\n    const indexesOfCurrentMarkdownInBody: number[] = []\n    let index: number = -1\n    while ((index = body.indexOf(currentMarkdown, index + 1)) > -1) {\n      indexesOfCurrentMarkdownInBody.push(index)\n    }\n\n    const indexToReplaceInBody: number | undefined = indexesOfCurrentMarkdownInBody[replaceIndex]\n    if (indexToReplaceInBody === undefined) return\n\n    const endReplaceIndex: number = indexToReplaceInBody + currentMarkdown.length\n\n    // replace the current markdown with the new markdown\n    const newBody: string =\n      body.slice(0, indexToReplaceInBody) + newMarkdown + body.slice(endReplaceIndex)\n\n    if (!newBody) return\n\n    updateComment(activity, newBody, activity.files)\n  }\n\n  const handleRefClick = (ref: {\n    entityId: string\n    entityType: DetailsPanelEntityType\n    activityId: string\n  }) => {\n    const { entityId, entityType, activityId } = ref\n    const supportedTypes = ['version', 'task', 'folder']\n\n    if (!entityType || !supportedTypes.includes(entityType))\n      return console.log('Entity type not supported yet')\n\n    if (!entityId || !entityType || !projectName) return console.log('No entity id or type found')\n\n    // open the slide out\n    openSlideOut({ entityId, entityType, projectName })\n    // set highlighted activity\n    setHighlightedActivities([activityId])\n  }\n\n  const handleFileExpand = ({ index, activityId }: { index: number; activityId: string }) => {\n    const previewableFiles = Object.values(transformedActivitiesData)\n      .reverse()\n      .filter((a) => a.activityType == 'comment')\n      .map((a) => ({\n        id: a.activityId,\n        files: a.files.filter((file: any) => isFilePreviewable(file.mime, file.ext)),\n      }))\n      .filter((a) => a.files.length > 0)\n\n    // open image callback\n    onOpenImage?.({ files: previewableFiles, activityId, index, projectName })\n  }\n\n  const loadingPlaceholders = useMemo(() => getLoadingPlaceholders(10), [])\n\n  let warningMessage\n\n  // only viewing activities from one project\n  if (isMultiProjects)\n    warningMessage = `You are only viewing activities from one project: ${projectName}.`\n\n  return (\n    <>\n      <Styled.FeedContainer className=\"feed\">\n        {warningMessage && (\n          <Styled.Warning>\n            <Icon icon=\"info\" />\n            {warningMessage}\n          </Styled.Warning>\n        )}\n        <Styled.FeedContent ref={feedRef} className={clsx({ loading: isLoadingNew }, 'no-shimmer')}>\n          {isLoadingNew\n            ? loadingPlaceholders\n            : transformedActivitiesData.map((activity) => (\n                <ActivityItem\n                  key={activity.activityId}\n                  activity={activity}\n                  onCheckChange={handleCommentChecked}\n                  onDelete={deleteComment}\n                  onUpdate={async (value, files, _refs) =>\n                    await updateComment(activity, value, files)\n                  }\n                  projectInfo={projectInfo}\n                  projectName={projectName}\n                  entityType={entityType}\n                  onReferenceClick={handleRefClick}\n                  createdAts={entities.map((e) => e.createdAt)}\n                  onFileExpand={handleFileExpand}\n                  showOrigin={entities.length > 1}\n                  filter={currentTab}\n                  editProps={{\n                    projectName,\n                    entities: entities,\n                    entityType,\n                  }}\n                  isHighlighted={highlightedActivities.includes(activity.activityId)}\n                  readOnly={readOnly}\n                  statuses={statuses}\n                />\n              ))}\n          {/* message when no versions published */}\n          {transformedActivitiesData.length === 1 && currentTab === 'versions' && !isLoadingNew && (\n            <EmptyPlaceholder message=\"No versions published yet\" icon=\"layers\" />\n          )}\n          {hasNextPage && loadNextPage && (\n            <InView\n              root={feedRef.current}\n              onChange={(inView) => inView && loadNextPage()}\n              rootMargin={'400px 0px 0px 0px'}\n            >\n              <Styled.LoadMore style={{ height: 0 }} onClick={() => loadNextPage()}>\n                {isLoadingNextPage ? 'Loading more...' : 'Click to load more'}\n              </Styled.LoadMore>\n            </InView>\n          )}\n        </Styled.FeedContent>\n        {!hideCommentInput && (\n          <CommentInput\n            initValue={null}\n            onSubmit={submitComment}\n            isOpen={editingId === FEED_NEW_COMMENT}\n            onClose={() => setEditingId(null)}\n            onOpen={() => setEditingId(FEED_NEW_COMMENT)}\n            disabled={isMultiProjects}\n            isLoading={isLoadingNew || !entities.length || isSaving}\n          />\n        )}\n      </Styled.FeedContainer>\n    </>\n  )\n}\n"],"names":["activitiesLast","Feed","isMultiProjects","readOnly","statuses","projectName","entities","entityType","editingId","projectInfo","setEditingId","userName","activitiesData","isLoadingNew","isLoadingNextPage","loadNextPage","hasNextPage","users","currentTab","useFeedContext","openSlideOut","highlightedActivities","setHighlightedActivities","onOpenImage","setFeedAnnotations","useDetailsPanelContext","hideCommentInput","activitiesWithMergedAnnotations","useMemo","mergeAnnotationAttachments","useEffect","annotations","activity","_b","_a","a","transformedActivitiesData","useTransformActivities","feedRef","useRef","useScrollOnInputOpen","FEED_NEW_COMMENT","useSaveScrollPos","useScrollToHighlighted","submitComment","updateComment","deleteComment","isSaving","useCommentMutations","handleCommentChecked","target","checked","currentMarkdown","newMarkdown","body","taskIndex","li","replaceIndex","markdown","index","indexesOfCurrentMarkdownInBody","indexToReplaceInBody","endReplaceIndex","newBody","handleRefClick","ref","entityId","activityId","handleFileExpand","previewableFiles","file","isFilePreviewable","loadingPlaceholders","getLoadingPlaceholders","warningMessage","jsxs","Styled.FeedContainer","Styled.Warning","jsx","Icon","Styled.FeedContent","clsx","ActivityItem","value","files","_refs","e","EmptyPlaceholder","InView","inView","Styled.LoadMore","CommentInput"],"mappings":"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"}
+{"version":3,"file":"Feed.es.js","sources":["../../../../../src/containers/Feed/Feed.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef } from 'react'\nimport ActivityItem from './components/ActivityItem'\nimport CommentInput from './components/CommentInput/CommentInput'\nimport * as Styled from './Feed.styled'\nimport useCommentMutations, { Activity } from './hooks/useCommentMutations'\nimport useTransformActivities from './hooks/useTransformActivities'\nimport { InView } from 'react-intersection-observer'\nimport useSaveScrollPos from './hooks/useSaveScrollPos'\nimport useScrollOnInputOpen from './hooks/useScrollOnInputOpen'\nimport { getLoadingPlaceholders } from './feedHelpers'\nimport { Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport useScrollToHighlighted from './hooks/useScrollToHighlighted'\nimport { isFilePreviewable } from './components/FileUploadPreview/FileUploadPreview'\nimport EmptyPlaceholder from '@shared/components/EmptyPlaceholder'\nimport { useFeedContext, FEED_NEW_COMMENT } from './context/FeedContext'\nimport { Status } from '../ProjectTreeTable/types/project'\nimport { useDetailsPanelContext } from '@shared/context'\nimport { DetailsPanelEntityType } from '@shared/api'\nimport mergeAnnotationAttachments from './helpers/mergeAnnotationAttachments'\nimport { SavedAnnotationMetadata } from '.'\n\n// number of activities to get\nexport const activitiesLast = 30\n\nexport type FeedProps = {\n  isMultiProjects: boolean\n  readOnly: boolean\n  statuses: Status[]\n  entityListId?: string | undefined\n}\n\nexport const Feed = ({ isMultiProjects, readOnly, statuses = [], entityListId }: FeedProps) => {\n  const {\n    projectName,\n    entities,\n    entityType,\n    editingId,\n    projectInfo,\n    setEditingId,\n    userName,\n    activitiesData,\n    isLoadingNew,\n    isLoadingNextPage,\n    loadNextPage,\n    hasNextPage,\n    users,\n    currentTab,\n  } = useFeedContext()\n\n  const {\n    openSlideOut,\n    highlightedActivities,\n    setHighlightedActivities,\n    onOpenImage,\n    setFeedAnnotations,\n  } = useDetailsPanelContext()\n\n  // hide comment input for specific filters\n  const hideCommentInput = ['versions'].includes(currentTab)\n\n  const activitiesWithMergedAnnotations = useMemo(\n    () => mergeAnnotationAttachments(activitiesData),\n    [activitiesData],\n  )\n\n  useEffect(() => {\n    if (!activitiesWithMergedAnnotations.length) {\n      setFeedAnnotations([])\n    }\n\n    const annotations = activitiesWithMergedAnnotations\n      .map((activity) =>\n        activity.activityData?.annotations?.map((a: SavedAnnotationMetadata) => ({\n          ...a,\n          activityId: activity.activityId,\n        })),\n      )\n      .filter(Boolean)\n      .flat()\n\n    setFeedAnnotations(annotations)\n  }, [activitiesWithMergedAnnotations])\n\n  // do any transformation on activities data\n  // 1. status change activities, attach status data based on projectName\n  // 2. reverse the order\n  // 3. is this activity from the current user?\n  const transformedActivitiesData = useTransformActivities(\n    // @ts-ignore\n    activitiesWithMergedAnnotations,\n    users,\n    projectInfo,\n    entityType,\n    userName,\n  ) as any[]\n\n  // REFS\n  const feedRef = useRef(null)\n  // const commentInputRef = useRef(null)\n\n  // scroll by height of comment input when it opens or closes\n  useScrollOnInputOpen({ feedRef, isInputOpen: editingId === FEED_NEW_COMMENT, height: 93 })\n\n  // save scroll position of a feed\n  useSaveScrollPos({\n    entities,\n    feedRef,\n    filter: currentTab,\n    disabled: !!highlightedActivities.length,\n    isLoading: isLoadingNew,\n  })\n\n  // try and scroll to highlightedActivities activity\n  useScrollToHighlighted({\n    feedRef,\n    highlighted: highlightedActivities,\n    isLoading: isLoadingNew,\n    loadNextPage,\n    hasNextPage: !!loadNextPage,\n  })\n\n  // comment mutations here!\n  const { submitComment, updateComment, deleteComment, isSaving } = useCommentMutations({\n    projectName,\n    entityType: entityType,\n    entities,\n    filter: currentTab,\n    entityListId,\n  })\n\n  // When a checkbox is clicked, update the body to add/remove \"x\" in [ ] markdown\n  // Then update comment with new body\n  const handleCommentChecked = (e: React.ChangeEvent<HTMLInputElement>, activity: Activity) => {\n    const target = e?.target\n    if (!target || !activity) return console.log('no target or activity')\n\n    // the value that it's changing to\n    const checked: boolean = target.checked\n    const currentMarkdown: string = checked ? '[ ]' : '[x]'\n    const newMarkdown: string = checked ? '[x]' : '[ ]'\n\n    const { body } = activity\n\n    // based on all li elements in the whole className 'comment-body' with className 'task-list-item'\n    // find the index of the task that was checked\n    const taskIndex: number = Array.from(\n      target.closest('.comment-body')?.querySelectorAll('.task-list-item') || [],\n    ).findIndex((li: Element) => li === target.closest('li'))\n\n    let replaceIndex: number = taskIndex\n\n    // count the number of current markdowns in the body\n    const allMarkdowns: string[] = body.match(/\\[.\\]/g) || []\n\n    allMarkdowns.forEach((markdown: string, index: number) => {\n      // does it match the current markdown?\n      if (markdown !== currentMarkdown && index < taskIndex) replaceIndex--\n    })\n\n    // now find the indexes of the current markdown to replace\n    const indexesOfCurrentMarkdownInBody: number[] = []\n    let index: number = -1\n    while ((index = body.indexOf(currentMarkdown, index + 1)) > -1) {\n      indexesOfCurrentMarkdownInBody.push(index)\n    }\n\n    const indexToReplaceInBody: number | undefined = indexesOfCurrentMarkdownInBody[replaceIndex]\n    if (indexToReplaceInBody === undefined) return\n\n    const endReplaceIndex: number = indexToReplaceInBody + currentMarkdown.length\n\n    // replace the current markdown with the new markdown\n    const newBody: string =\n      body.slice(0, indexToReplaceInBody) + newMarkdown + body.slice(endReplaceIndex)\n\n    if (!newBody) return\n\n    updateComment(activity, newBody, activity.files)\n  }\n\n  const handleRefClick = (ref: {\n    entityId: string\n    entityType: DetailsPanelEntityType\n    activityId: string\n  }) => {\n    const { entityId, entityType, activityId } = ref\n    const supportedTypes = ['version', 'task', 'folder']\n\n    if (!entityType || !supportedTypes.includes(entityType))\n      return console.log('Entity type not supported yet')\n\n    if (!entityId || !entityType || !projectName) return console.log('No entity id or type found')\n\n    // open the slide out\n    openSlideOut({ entityId, entityType, projectName })\n    // set highlighted activity\n    setHighlightedActivities([activityId])\n  }\n\n  const handleFileExpand = ({ index, activityId }: { index: number; activityId: string }) => {\n    const previewableFiles = Object.values(transformedActivitiesData)\n      .reverse()\n      .filter((a) => a.activityType == 'comment')\n      .map((a) => ({\n        id: a.activityId,\n        files: a.files.filter((file: any) => isFilePreviewable(file.mime, file.ext)),\n      }))\n      .filter((a) => a.files.length > 0)\n\n    // open image callback\n    onOpenImage?.({ files: previewableFiles, activityId, index, projectName })\n  }\n\n  const loadingPlaceholders = useMemo(() => getLoadingPlaceholders(10), [])\n\n  let warningMessage\n\n  // only viewing activities from one project\n  if (isMultiProjects)\n    warningMessage = `You are only viewing activities from one project: ${projectName}.`\n\n  return (\n    <>\n      <Styled.FeedContainer className=\"feed\">\n        {warningMessage && (\n          <Styled.Warning>\n            <Icon icon=\"info\" />\n            {warningMessage}\n          </Styled.Warning>\n        )}\n        <Styled.FeedContent ref={feedRef} className={clsx({ loading: isLoadingNew }, 'no-shimmer')}>\n          {isLoadingNew\n            ? loadingPlaceholders\n            : transformedActivitiesData.map((activity) => (\n                <ActivityItem\n                  key={activity.activityId}\n                  activity={activity}\n                  onCheckChange={handleCommentChecked}\n                  onDelete={deleteComment}\n                  onUpdate={async (value, files, _refs, data) =>\n                    await updateComment(activity, value, files, data)\n                  }\n                  projectInfo={projectInfo}\n                  projectName={projectName}\n                  entityType={entityType}\n                  onReferenceClick={handleRefClick}\n                  createdAts={entities.map((e) => e.createdAt)}\n                  onFileExpand={handleFileExpand}\n                  showOrigin={entities.length > 1}\n                  filter={currentTab}\n                  editProps={{\n                    projectName,\n                    entities: entities,\n                    entityType,\n                  }}\n                  isHighlighted={highlightedActivities.includes(activity.activityId)}\n                  readOnly={readOnly}\n                  statuses={statuses}\n                />\n              ))}\n          {/* message when no versions published */}\n          {transformedActivitiesData.length === 1 && currentTab === 'versions' && !isLoadingNew && (\n            <EmptyPlaceholder message=\"No versions published yet\" icon=\"layers\" />\n          )}\n          {hasNextPage && loadNextPage && (\n            <InView\n              root={feedRef.current}\n              onChange={(inView) => inView && loadNextPage()}\n              rootMargin={'400px 0px 0px 0px'}\n            >\n              <Styled.LoadMore style={{ height: 0 }} onClick={() => loadNextPage()}>\n                {isLoadingNextPage ? 'Loading more...' : 'Click to load more'}\n              </Styled.LoadMore>\n            </InView>\n          )}\n        </Styled.FeedContent>\n        {!hideCommentInput && (\n          <CommentInput\n            initValue={null}\n            onSubmit={submitComment}\n            isOpen={editingId === FEED_NEW_COMMENT}\n            onClose={() => setEditingId(null)}\n            onOpen={() => setEditingId(FEED_NEW_COMMENT)}\n            disabled={isMultiProjects}\n            isLoading={isLoadingNew || !entities.length || isSaving}\n          />\n        )}\n      </Styled.FeedContainer>\n    </>\n  )\n}\n"],"names":["activitiesLast","Feed","isMultiProjects","readOnly","statuses","entityListId","projectName","entities","entityType","editingId","projectInfo","setEditingId","userName","activitiesData","isLoadingNew","isLoadingNextPage","loadNextPage","hasNextPage","users","currentTab","useFeedContext","openSlideOut","highlightedActivities","setHighlightedActivities","onOpenImage","setFeedAnnotations","useDetailsPanelContext","hideCommentInput","activitiesWithMergedAnnotations","useMemo","mergeAnnotationAttachments","useEffect","annotations","activity","_b","_a","a","transformedActivitiesData","useTransformActivities","feedRef","useRef","useScrollOnInputOpen","FEED_NEW_COMMENT","useSaveScrollPos","useScrollToHighlighted","submitComment","updateComment","deleteComment","isSaving","useCommentMutations","handleCommentChecked","target","checked","currentMarkdown","newMarkdown","body","taskIndex","li","replaceIndex","markdown","index","indexesOfCurrentMarkdownInBody","indexToReplaceInBody","endReplaceIndex","newBody","handleRefClick","ref","entityId","activityId","handleFileExpand","previewableFiles","file","isFilePreviewable","loadingPlaceholders","getLoadingPlaceholders","warningMessage","jsxs","Styled.FeedContainer","Styled.Warning","jsx","Icon","Styled.FeedContent","clsx","ActivityItem","value","files","_refs","data","e","EmptyPlaceholder","InView","inView","Styled.LoadMore","CommentInput"],"mappings":"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"}

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

@@ -0,0 +1,13 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../../../../../../_virtual/jsx-runtime.cjs.js"),p=require("@ynput/ayon-react-components"),n=require("./CategoryTag.cjs.js"),j=require("styled-components"),C=require("./CategoryDropdownItem.cjs.js"),f=require("react-toastify"),h="1.3.0",E=j(p.Dropdown)`
+  button {
+    /* remove all styles and just use a wrapper */
+    background-color: unset !important;
+
+    /* override the default quill styles */
+    padding: 0 !important;
+    height: 32px !important;
+    width: unset !important;
+    color: var(--md-sys-color-on-surface) !important;
+  }
+`,R=({value:e,categories:s,readonly:c,isCompact:i,hasPowerpack:u,onPowerFeature:a,onChange:y,...r})=>{const g=s.find(t=>t.name===e),{color:l}=g||{};if(!u)return o.jsxRuntimeExports.jsx(n.CategoryTag,{value:null,isPower:!0,isDisabled:!0,style:r.style,onClick:()=>a==null?void 0:a("commentCategories"),"data-tooltip":"Comment categories is a Powerpack feature"});if(c)return o.jsxRuntimeExports.jsx(n.CategoryTag,{value:e,color:l,isCompact:i,style:r.style});if(!s.length)return o.jsxRuntimeExports.jsx(n.CategoryTag,{value:e,color:l,isCompact:i,style:r.style,onClick:()=>f.toast.warning(`No categories found. Ensure they are set in the Powerpack settings and the version is at least ${h}.`)});const m=[...e?[{label:"No category",value:null,color:"inherit",icon:"clear"}]:[],...s.map(t=>({label:t.name,value:t.name,color:t.color,icon:null}))];return o.jsxRuntimeExports.jsx(E,{options:m,value:e?[e]:[],onChange:t=>y(t[0]),valueTemplate:()=>o.jsxRuntimeExports.jsx(n.CategoryTag,{value:e,color:l,isCompact:i,isEditing:!0}),itemTemplate:(t,T,d,x)=>o.jsxRuntimeExports.jsx(C.CategoryDropdownItem,{label:t.label,color:t.color,isSelected:d,isClear:t.value===null},x),...r})};exports.ActivityCategorySelect=R;
+//# sourceMappingURL=ActivityCategorySelect.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ActivityCategorySelect.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/ActivityCategorySelect.tsx"],"sourcesContent":["import { ActivityCategory } from '@shared/api'\nimport { Dropdown, DropdownProps, StatusField } from '@ynput/ayon-react-components'\nimport { FC } from 'react'\nimport { CategoryTag } from './CategoryTag'\nimport styled from 'styled-components'\nimport { CategoryDropdownItem } from './CategoryDropdownItem'\nimport { PowerpackFeature } from '@shared/context'\nimport { toast } from 'react-toastify'\n\nconst CATEGORY_PP_MIN_VERSION = '1.3.0'\n\nconst StyledDropdown = styled(Dropdown)`\n  button {\n    /* remove all styles and just use a wrapper */\n    background-color: unset !important;\n\n    /* override the default quill styles */\n    padding: 0 !important;\n    height: 32px !important;\n    width: unset !important;\n    color: var(--md-sys-color-on-surface) !important;\n  }\n`\n\nexport interface ActivityCategorySelectProps\n  extends Omit<DropdownProps, 'options' | 'value' | 'onChange' | 'valueTemplate'> {\n  value?: string | null\n  categories: ActivityCategory[]\n  readonly?: boolean\n  isCompact?: boolean\n  hasPowerpack?: boolean\n  onPowerFeature?: (feature: PowerpackFeature) => void\n  onChange: (value: string) => void\n}\n\nexport const ActivityCategorySelect: FC<ActivityCategorySelectProps> = ({\n  value,\n  categories,\n  readonly,\n  isCompact,\n  hasPowerpack,\n  onPowerFeature,\n  onChange,\n  ...props\n}) => {\n  const category = categories.find((cat) => cat.name === value)\n  const { color } = category || {}\n\n  if (!hasPowerpack) {\n    return (\n      <CategoryTag\n        value={null}\n        isPower\n        isDisabled\n        style={props.style}\n        onClick={() => onPowerFeature?.('commentCategories')}\n        data-tooltip={'Comment categories is a Powerpack feature'}\n      />\n    )\n  }\n\n  if (readonly) {\n    return <CategoryTag value={value} color={color} isCompact={isCompact} style={props.style} />\n  }\n\n  if (!categories.length) {\n    return (\n      <CategoryTag\n        value={value}\n        color={color}\n        isCompact={isCompact}\n        style={props.style}\n        onClick={() =>\n          toast.warning(\n            `No categories found. Ensure they are set in the Powerpack settings and the version is at least ${CATEGORY_PP_MIN_VERSION}.`,\n          )\n        }\n      />\n    )\n  }\n\n  const options: DropdownProps['options'] = [\n    ...(value ? [{ label: 'No category', value: null, color: 'inherit', icon: 'clear' }] : []),\n    ...categories.map((cat) => ({\n      label: cat.name,\n      value: cat.name,\n      color: cat.color,\n      icon: null,\n    })),\n  ]\n\n  return (\n    <StyledDropdown\n      options={options}\n      value={value ? [value] : []}\n      onChange={(val) => onChange(val[0] as string)}\n      valueTemplate={() => (\n        <CategoryTag value={value} color={color} isCompact={isCompact} isEditing />\n      )}\n      itemTemplate={(option, isActive, isSelected, index) => (\n        <CategoryDropdownItem\n          label={option.label}\n          color={option.color}\n          isSelected={isSelected}\n          isClear={option.value === null}\n          key={index}\n        />\n      )}\n      {...props}\n    />\n  )\n}\n"],"names":["CATEGORY_PP_MIN_VERSION","StyledDropdown","styled","Dropdown","ActivityCategorySelect","value","categories","readonly","isCompact","hasPowerpack","onPowerFeature","onChange","props","category","cat","color","jsx","CategoryTag","toast","options","val","option","isActive","isSelected","index","CategoryDropdownItem"],"mappings":"mUASMA,EAA0B,QAE1BC,EAAiBC,EAAOC,UAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAwBzBC,EAA0D,CAAC,CACtE,MAAAC,EACA,WAAAC,EACA,SAAAC,EACA,UAAAC,EACA,aAAAC,EACA,eAAAC,EACA,SAAAC,EACA,GAAGC,CACL,IAAM,CACJ,MAAMC,EAAWP,EAAW,KAAMQ,GAAQA,EAAI,OAAST,CAAK,EACtD,CAAE,MAAAU,GAAUF,GAAY,CAAC,EAE/B,GAAI,CAACJ,EAED,OAAAO,EAAA,kBAAA,IAACC,EAAA,YAAA,CACC,MAAO,KACP,QAAO,GACP,WAAU,GACV,MAAOL,EAAM,MACb,QAAS,IAAMF,GAAA,YAAAA,EAAiB,qBAChC,eAAc,2CAAA,CAChB,EAIJ,GAAIH,EACF,+BAAQU,cAAY,CAAA,MAAAZ,EAAc,MAAAU,EAAc,UAAAP,EAAsB,MAAOI,EAAM,MAAO,EAGxF,GAAA,CAACN,EAAW,OAEZ,OAAAU,EAAA,kBAAA,IAACC,EAAA,YAAA,CACC,MAAAZ,EACA,MAAAU,EACA,UAAAP,EACA,MAAOI,EAAM,MACb,QAAS,IACPM,EAAAA,MAAM,QACJ,kGAAkGlB,CAAuB,GAAA,CAC3H,CAEJ,EAIJ,MAAMmB,EAAoC,CACxC,GAAId,EAAQ,CAAC,CAAE,MAAO,cAAe,MAAO,KAAM,MAAO,UAAW,KAAM,OAAQ,CAAC,EAAI,CAAC,EACxF,GAAGC,EAAW,IAAKQ,IAAS,CAC1B,MAAOA,EAAI,KACX,MAAOA,EAAI,KACX,MAAOA,EAAI,MACX,KAAM,IAAA,EACN,CACJ,EAGE,OAAAE,EAAA,kBAAA,IAACf,EAAA,CACC,QAAAkB,EACA,MAAOd,EAAQ,CAACA,CAAK,EAAI,CAAC,EAC1B,SAAWe,GAAQT,EAASS,EAAI,CAAC,CAAW,EAC5C,cAAe,IACZJ,wBAAAC,EAAAA,YAAA,CAAY,MAAAZ,EAAc,MAAAU,EAAc,UAAAP,EAAsB,UAAS,GAAC,EAE3E,aAAc,CAACa,EAAQC,EAAUC,EAAYC,IAC3CR,EAAA,kBAAA,IAACS,EAAA,qBAAA,CACC,MAAOJ,EAAO,MACd,MAAOA,EAAO,MACd,WAAAE,EACA,QAASF,EAAO,QAAU,IAAA,EACrBG,CACP,EAED,GAAGZ,CAAA,CACN,CAEJ"}

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

@@ -0,0 +1,89 @@
+import { j as o } from "../../../../../../_virtual/jsx-runtime.es.js";
+import { Dropdown as f } from "@ynput/ayon-react-components";
+import { CategoryTag as l } from "./CategoryTag.es.js";
+import h from "styled-components";
+import { CategoryDropdownItem as x } from "./CategoryDropdownItem.es.js";
+import { toast as j } from "react-toastify";
+const C = "1.3.0", b = h(f)`
+  button {
+    /* remove all styles and just use a wrapper */
+    background-color: unset !important;
+
+    /* override the default quill styles */
+    padding: 0 !important;
+    height: 32px !important;
+    width: unset !important;
+    color: var(--md-sys-color-on-surface) !important;
+  }
+`, A = ({
+  value: e,
+  categories: n,
+  readonly: m,
+  isCompact: s,
+  hasPowerpack: c,
+  onPowerFeature: i,
+  onChange: u,
+  ...r
+}) => {
+  const d = n.find((t) => t.name === e), { color: a } = d || {};
+  if (!c)
+    return /* @__PURE__ */ o.jsx(
+      l,
+      {
+        value: null,
+        isPower: !0,
+        isDisabled: !0,
+        style: r.style,
+        onClick: () => i == null ? void 0 : i("commentCategories"),
+        "data-tooltip": "Comment categories is a Powerpack feature"
+      }
+    );
+  if (m)
+    return /* @__PURE__ */ o.jsx(l, { value: e, color: a, isCompact: s, style: r.style });
+  if (!n.length)
+    return /* @__PURE__ */ o.jsx(
+      l,
+      {
+        value: e,
+        color: a,
+        isCompact: s,
+        style: r.style,
+        onClick: () => j.warning(
+          `No categories found. Ensure they are set in the Powerpack settings and the version is at least ${C}.`
+        )
+      }
+    );
+  const y = [
+    ...e ? [{ label: "No category", value: null, color: "inherit", icon: "clear" }] : [],
+    ...n.map((t) => ({
+      label: t.name,
+      value: t.name,
+      color: t.color,
+      icon: null
+    }))
+  ];
+  return /* @__PURE__ */ o.jsx(
+    b,
+    {
+      options: y,
+      value: e ? [e] : [],
+      onChange: (t) => u(t[0]),
+      valueTemplate: () => /* @__PURE__ */ o.jsx(l, { value: e, color: a, isCompact: s, isEditing: !0 }),
+      itemTemplate: (t, v, p, g) => /* @__PURE__ */ o.jsx(
+        x,
+        {
+          label: t.label,
+          color: t.color,
+          isSelected: p,
+          isClear: t.value === null
+        },
+        g
+      ),
+      ...r
+    }
+  );
+};
+export {
+  A as ActivityCategorySelect
+};
+//# sourceMappingURL=ActivityCategorySelect.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ActivityCategorySelect.es.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/ActivityCategorySelect.tsx"],"sourcesContent":["import { ActivityCategory } from '@shared/api'\nimport { Dropdown, DropdownProps, StatusField } from '@ynput/ayon-react-components'\nimport { FC } from 'react'\nimport { CategoryTag } from './CategoryTag'\nimport styled from 'styled-components'\nimport { CategoryDropdownItem } from './CategoryDropdownItem'\nimport { PowerpackFeature } from '@shared/context'\nimport { toast } from 'react-toastify'\n\nconst CATEGORY_PP_MIN_VERSION = '1.3.0'\n\nconst StyledDropdown = styled(Dropdown)`\n  button {\n    /* remove all styles and just use a wrapper */\n    background-color: unset !important;\n\n    /* override the default quill styles */\n    padding: 0 !important;\n    height: 32px !important;\n    width: unset !important;\n    color: var(--md-sys-color-on-surface) !important;\n  }\n`\n\nexport interface ActivityCategorySelectProps\n  extends Omit<DropdownProps, 'options' | 'value' | 'onChange' | 'valueTemplate'> {\n  value?: string | null\n  categories: ActivityCategory[]\n  readonly?: boolean\n  isCompact?: boolean\n  hasPowerpack?: boolean\n  onPowerFeature?: (feature: PowerpackFeature) => void\n  onChange: (value: string) => void\n}\n\nexport const ActivityCategorySelect: FC<ActivityCategorySelectProps> = ({\n  value,\n  categories,\n  readonly,\n  isCompact,\n  hasPowerpack,\n  onPowerFeature,\n  onChange,\n  ...props\n}) => {\n  const category = categories.find((cat) => cat.name === value)\n  const { color } = category || {}\n\n  if (!hasPowerpack) {\n    return (\n      <CategoryTag\n        value={null}\n        isPower\n        isDisabled\n        style={props.style}\n        onClick={() => onPowerFeature?.('commentCategories')}\n        data-tooltip={'Comment categories is a Powerpack feature'}\n      />\n    )\n  }\n\n  if (readonly) {\n    return <CategoryTag value={value} color={color} isCompact={isCompact} style={props.style} />\n  }\n\n  if (!categories.length) {\n    return (\n      <CategoryTag\n        value={value}\n        color={color}\n        isCompact={isCompact}\n        style={props.style}\n        onClick={() =>\n          toast.warning(\n            `No categories found. Ensure they are set in the Powerpack settings and the version is at least ${CATEGORY_PP_MIN_VERSION}.`,\n          )\n        }\n      />\n    )\n  }\n\n  const options: DropdownProps['options'] = [\n    ...(value ? [{ label: 'No category', value: null, color: 'inherit', icon: 'clear' }] : []),\n    ...categories.map((cat) => ({\n      label: cat.name,\n      value: cat.name,\n      color: cat.color,\n      icon: null,\n    })),\n  ]\n\n  return (\n    <StyledDropdown\n      options={options}\n      value={value ? [value] : []}\n      onChange={(val) => onChange(val[0] as string)}\n      valueTemplate={() => (\n        <CategoryTag value={value} color={color} isCompact={isCompact} isEditing />\n      )}\n      itemTemplate={(option, isActive, isSelected, index) => (\n        <CategoryDropdownItem\n          label={option.label}\n          color={option.color}\n          isSelected={isSelected}\n          isClear={option.value === null}\n          key={index}\n        />\n      )}\n      {...props}\n    />\n  )\n}\n"],"names":["CATEGORY_PP_MIN_VERSION","StyledDropdown","styled","Dropdown","ActivityCategorySelect","value","categories","readonly","isCompact","hasPowerpack","onPowerFeature","onChange","props","category","cat","color","jsx","CategoryTag","toast","options","val","option","isActive","isSelected","index","CategoryDropdownItem"],"mappings":";;;;;;AASA,MAAMA,IAA0B,SAE1BC,IAAiBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAwBzBC,IAA0D,CAAC;AAAA,EACtE,OAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAWP,EAAW,KAAK,CAACQ,MAAQA,EAAI,SAAST,CAAK,GACtD,EAAE,OAAAU,MAAUF,KAAY,CAAC;AAE/B,MAAI,CAACJ;AAED,WAAAO,gBAAAA,EAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,QACP,SAAO;AAAA,QACP,YAAU;AAAA,QACV,OAAOL,EAAM;AAAA,QACb,SAAS,MAAMF,KAAA,gBAAAA,EAAiB;AAAA,QAChC,gBAAc;AAAA,MAAA;AAAA,IAChB;AAIJ,MAAIH;AACF,iCAAQU,GAAY,EAAA,OAAAZ,GAAc,OAAAU,GAAc,WAAAP,GAAsB,OAAOI,EAAM,OAAO;AAGxF,MAAA,CAACN,EAAW;AAEZ,WAAAU,gBAAAA,EAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAAZ;AAAA,QACA,OAAAU;AAAA,QACA,WAAAP;AAAA,QACA,OAAOI,EAAM;AAAA,QACb,SAAS,MACPM,EAAM;AAAA,UACJ,kGAAkGlB,CAAuB;AAAA,QAAA;AAAA,MAC3H;AAAA,IAEJ;AAIJ,QAAMmB,IAAoC;AAAA,IACxC,GAAId,IAAQ,CAAC,EAAE,OAAO,eAAe,OAAO,MAAM,OAAO,WAAW,MAAM,QAAQ,CAAC,IAAI,CAAC;AAAA,IACxF,GAAGC,EAAW,IAAI,CAACQ,OAAS;AAAA,MAC1B,OAAOA,EAAI;AAAA,MACX,OAAOA,EAAI;AAAA,MACX,OAAOA,EAAI;AAAA,MACX,MAAM;AAAA,IAAA,EACN;AAAA,EACJ;AAGE,SAAAE,gBAAAA,EAAA;AAAA,IAACf;AAAA,IAAA;AAAA,MACC,SAAAkB;AAAA,MACA,OAAOd,IAAQ,CAACA,CAAK,IAAI,CAAC;AAAA,MAC1B,UAAU,CAACe,MAAQT,EAASS,EAAI,CAAC,CAAW;AAAA,MAC5C,eAAe,MACZJ,gBAAAA,MAAAC,GAAA,EAAY,OAAAZ,GAAc,OAAAU,GAAc,WAAAP,GAAsB,WAAS,IAAC;AAAA,MAE3E,cAAc,CAACa,GAAQC,GAAUC,GAAYC,MAC3CR,gBAAAA,EAAA;AAAA,QAACS;AAAA,QAAA;AAAA,UACC,OAAOJ,EAAO;AAAA,UACd,OAAOA,EAAO;AAAA,UACd,YAAAE;AAAA,UACA,SAASF,EAAO,UAAU;AAAA,QAAA;AAAA,QACrBG;AAAA,MACP;AAAA,MAED,GAAGZ;AAAA,IAAA;AAAA,EACN;AAEJ;"}

package/dist/shared/src/containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.cjs.js

@@ -0,0 +1,20 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../../../../../../_virtual/jsx-runtime.cjs.js"),l=require("@ynput/ayon-react-components"),p=require("clsx"),u=require("react"),d=require("styled-components"),x=d.span`
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  padding: 4px 8px;
+  gap: 8px;
+
+  .icon {
+    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;
+    font-size: 16px;
+  }
+
+  &.selected {
+    .icon {
+      font-variation-settings: 'FILL' 0, 'wght' 200, 'GRAD' 200, 'opsz' 20;
+      color: var(--md-sys-color-on-surface) !important;
+    }
+  }
+`,g=u.forwardRef(({label:s,color:t,isSelected:e,isClear:n,style:r,className:i,...a},c)=>o.jsxRuntimeExports.jsxs(x,{...a,className:p(i,{selected:e}),style:{backgroundColor:e&&t?t:"",...r},ref:c,children:[o.jsxRuntimeExports.jsx(l.Icon,{icon:n?"clear":"crop_square",style:{color:t||""}}),s]}));exports.CategoryDropdownItem=g;
+//# sourceMappingURL=CategoryDropdownItem.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CategoryDropdownItem.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.tsx"],"sourcesContent":["import { Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef } from 'react'\nimport styled from 'styled-components'\n\nconst StyledItem = styled.span`\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 4px 8px;\n  gap: 8px;\n\n  .icon {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n    font-size: 16px;\n  }\n\n  &.selected {\n    .icon {\n      font-variation-settings: 'FILL' 0, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n      color: var(--md-sys-color-on-surface) !important;\n    }\n  }\n`\n\ninterface CategoryDropdownItemProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {\n  label: string\n  color: string | null\n  isClear: boolean\n  isSelected: boolean\n}\n\nexport const CategoryDropdownItem = forwardRef<HTMLSpanElement, CategoryDropdownItemProps>(\n  ({ label, color, isSelected, isClear, style, className, ...props }, ref) => {\n    return (\n      <StyledItem\n        {...props}\n        className={clsx(className, { selected: isSelected })}\n        style={{ backgroundColor: isSelected && color ? color : '', ...style }}\n        ref={ref}\n      >\n        {<Icon icon={isClear ? 'clear' : 'crop_square'} style={{ color: color || '' }} />}\n        {label}\n      </StyledItem>\n    )\n  },\n)\n"],"names":["StyledItem","styled","CategoryDropdownItem","forwardRef","label","color","isSelected","isClear","style","className","props","ref","jsxs","clsx","jsx","Icon"],"mappings":"+PAKMA,EAAaC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA2BbC,EAAuBC,EAAA,WAClC,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,WAAAC,EAAY,QAAAC,EAAS,MAAAC,EAAO,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAEhEC,EAAA,kBAAA,KAACZ,EAAA,CACE,GAAGU,EACJ,UAAWG,EAAKJ,EAAW,CAAE,SAAUH,EAAY,EACnD,MAAO,CAAE,gBAAiBA,GAAcD,EAAQA,EAAQ,GAAI,GAAGG,CAAM,EACrE,IAAAG,EAEC,SAAA,CAACG,EAAAA,kBAAAA,IAAAC,EAAA,KAAA,CAAK,KAAMR,EAAU,QAAU,cAAe,MAAO,CAAE,MAAOF,GAAS,EAAM,CAAA,CAAA,EAC9ED,CAAA,CAAA,CACH,CAGN"}

package/dist/shared/src/containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.es.js

@@ -0,0 +1,42 @@
+import { j as r } from "../../../../../../_virtual/jsx-runtime.es.js";
+import { Icon as c } from "@ynput/ayon-react-components";
+import m from "clsx";
+import { forwardRef as l } from "react";
+import f from "styled-components";
+const x = f.span`
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  padding: 4px 8px;
+  gap: 8px;
+
+  .icon {
+    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;
+    font-size: 16px;
+  }
+
+  &.selected {
+    .icon {
+      font-variation-settings: 'FILL' 0, 'wght' 200, 'GRAD' 200, 'opsz' 20;
+      color: var(--md-sys-color-on-surface) !important;
+    }
+  }
+`, I = l(
+  ({ label: s, color: t, isSelected: o, isClear: e, style: n, className: i, ...a }, p) => /* @__PURE__ */ r.jsxs(
+    x,
+    {
+      ...a,
+      className: m(i, { selected: o }),
+      style: { backgroundColor: o && t ? t : "", ...n },
+      ref: p,
+      children: [
+        /* @__PURE__ */ r.jsx(c, { icon: e ? "clear" : "crop_square", style: { color: t || "" } }),
+        s
+      ]
+    }
+  )
+);
+export {
+  I as CategoryDropdownItem
+};
+//# sourceMappingURL=CategoryDropdownItem.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CategoryDropdownItem.es.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.tsx"],"sourcesContent":["import { Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef } from 'react'\nimport styled from 'styled-components'\n\nconst StyledItem = styled.span`\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 4px 8px;\n  gap: 8px;\n\n  .icon {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n    font-size: 16px;\n  }\n\n  &.selected {\n    .icon {\n      font-variation-settings: 'FILL' 0, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n      color: var(--md-sys-color-on-surface) !important;\n    }\n  }\n`\n\ninterface CategoryDropdownItemProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {\n  label: string\n  color: string | null\n  isClear: boolean\n  isSelected: boolean\n}\n\nexport const CategoryDropdownItem = forwardRef<HTMLSpanElement, CategoryDropdownItemProps>(\n  ({ label, color, isSelected, isClear, style, className, ...props }, ref) => {\n    return (\n      <StyledItem\n        {...props}\n        className={clsx(className, { selected: isSelected })}\n        style={{ backgroundColor: isSelected && color ? color : '', ...style }}\n        ref={ref}\n      >\n        {<Icon icon={isClear ? 'clear' : 'crop_square'} style={{ color: color || '' }} />}\n        {label}\n      </StyledItem>\n    )\n  },\n)\n"],"names":["StyledItem","styled","CategoryDropdownItem","forwardRef","label","color","isSelected","isClear","style","className","props","ref","jsxs","clsx","jsx","Icon"],"mappings":";;;;;AAKA,MAAMA,IAAaC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA2BbC,IAAuBC;AAAA,EAClC,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,YAAAC,GAAY,SAAAC,GAAS,OAAAC,GAAO,WAAAC,GAAW,GAAGC,EAAM,GAAGC,MAEhEC,gBAAAA,EAAA;AAAA,IAACZ;AAAA,IAAA;AAAA,MACE,GAAGU;AAAA,MACJ,WAAWG,EAAKJ,GAAW,EAAE,UAAUH,GAAY;AAAA,MACnD,OAAO,EAAE,iBAAiBA,KAAcD,IAAQA,IAAQ,IAAI,GAAGG,EAAM;AAAA,MACrE,KAAAG;AAAA,MAEC,UAAA;AAAA,QAACG,gBAAAA,EAAAA,IAAAC,GAAA,EAAK,MAAMR,IAAU,UAAU,eAAe,OAAO,EAAE,OAAOF,KAAS,GAAM,EAAA,CAAA;AAAA,QAC9ED;AAAA,MAAA;AAAA,IAAA;AAAA,EACH;AAGN;"}

package/dist/shared/src/containers/Feed/components/ActivityCategorySelect/CategoryTag.cjs.js

@@ -0,0 +1,51 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../../../../../../_virtual/jsx-runtime.cjs.js"),u=require("@ynput/ayon-react-components"),g=require("clsx"),p=require("react"),y=require("styled-components"),v="Category",m=y.div`
+  display: flex;
+  padding: 2px 4px;
+  justify-content: center;
+  align-items: center;
+  border-radius: 4px;
+  background-color: var(--md-sys-color-surface-container);
+  transition: background-color 0.2s;
+  width: fit-content;
+  user-select: none;
+  position: relative;
+
+  /* if there's a category the colour gets overridden */
+  border: 1px solid var(--md-sys-color-outline-variant);
+
+  &.none {
+    &:not(:hover) {
+      color: var(--md-sys-color-on-surface-variant);
+    }
+    &:hover {
+      background-color: var(--md-sys-color-surface-container-high);
+    }
+  }
+
+  &.compact {
+    padding: 1px 2px;
+    ${u.theme.labelMedium}
+  }
+
+  &.editing {
+    &:hover:not(.none) {
+      filter: brightness(1.2);
+    }
+  }
+
+  &.disabled {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+
+  &.power {
+    pointer-events: all;
+    cursor: pointer;
+
+    &:hover {
+      border-color: var(--md-sys-color-tertiary);
+      color: var(--md-sys-color-tertiary);
+    }
+  }
+`,b=p.forwardRef(({value:e,color:r,isCompact:o,isEditing:t,isPower:n,isDisabled:s,style:a,className:i,...c},d)=>l.jsxRuntimeExports.jsx(m,{...c,ref:d,className:g(i,{none:!e,compact:o,editing:t,power:n,disabled:s}),style:{...a,backgroundColor:r,borderColor:r},children:e||v}));exports.CategoryTag=b;
+//# sourceMappingURL=CategoryTag.cjs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CategoryTag.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/CategoryTag.tsx"],"sourcesContent":["import { theme } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef } from 'react'\nimport styled from 'styled-components'\n\nconst NO_CATEGORY_LABEL = 'Category'\n\nconst StyledTag = styled.div`\n  display: flex;\n  padding: 2px 4px;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  background-color: var(--md-sys-color-surface-container);\n  transition: background-color 0.2s;\n  width: fit-content;\n  user-select: none;\n  position: relative;\n\n  /* if there's a category the colour gets overridden */\n  border: 1px solid var(--md-sys-color-outline-variant);\n\n  &.none {\n    &:not(:hover) {\n      color: var(--md-sys-color-on-surface-variant);\n    }\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-high);\n    }\n  }\n\n  &.compact {\n    padding: 1px 2px;\n    ${theme.labelMedium}\n  }\n\n  &.editing {\n    &:hover:not(.none) {\n      filter: brightness(1.2);\n    }\n  }\n\n  &.disabled {\n    pointer-events: none;\n    opacity: 0.5;\n  }\n\n  &.power {\n    pointer-events: all;\n    cursor: pointer;\n\n    &:hover {\n      border-color: var(--md-sys-color-tertiary);\n      color: var(--md-sys-color-tertiary);\n    }\n  }\n`\n\ninterface CategoryTagProps extends React.HTMLAttributes<HTMLDivElement> {\n  value?: string | null\n  color?: string\n  isCompact?: boolean\n  isEditing?: boolean\n  isPower?: boolean\n  isDisabled?: boolean\n}\n\nexport const CategoryTag = forwardRef<HTMLDivElement, CategoryTagProps>(\n  (\n    { value, color, isCompact, isEditing, isPower, isDisabled, style, className, ...props },\n    ref,\n  ) => {\n    return (\n      <StyledTag\n        {...props}\n        ref={ref}\n        className={clsx(className, {\n          none: !value,\n          compact: isCompact,\n          editing: isEditing,\n          power: isPower,\n          disabled: isDisabled,\n        })}\n        style={{ ...style, backgroundColor: color, borderColor: color }}\n      >\n        {value || NO_CATEGORY_LABEL}\n      </StyledTag>\n    )\n  },\n)\n"],"names":["NO_CATEGORY_LABEL","StyledTag","styled","theme","CategoryTag","forwardRef","value","color","isCompact","isEditing","isPower","isDisabled","style","className","props","ref","jsx","clsx"],"mappings":"+PAKMA,EAAoB,WAEpBC,EAAYC,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,MA0BnBC,QAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAkCVC,EAAcC,EAAA,WACzB,CACE,CAAE,MAAAC,EAAO,MAAAC,EAAO,UAAAC,EAAW,UAAAC,EAAW,QAAAC,EAAS,WAAAC,EAAY,MAAAC,EAAO,UAAAC,EAAW,GAAGC,CAAA,EAChFC,IAGEC,EAAA,kBAAA,IAACf,EAAA,CACE,GAAGa,EACJ,IAAAC,EACA,UAAWE,EAAKJ,EAAW,CACzB,KAAM,CAACP,EACP,QAASE,EACT,QAASC,EACT,MAAOC,EACP,SAAUC,CAAA,CACX,EACD,MAAO,CAAE,GAAGC,EAAO,gBAAiBL,EAAO,YAAaA,CAAM,EAE7D,SAASD,GAAAN,CAAA,CACZ,CAGN"}

package/dist/shared/src/containers/Feed/components/ActivityCategorySelect/CategoryTag.es.js

@@ -0,0 +1,76 @@
+import { j as l } from "../../../../../../_virtual/jsx-runtime.es.js";
+import { theme as p } from "@ynput/ayon-react-components";
+import m from "clsx";
+import { forwardRef as g } from "react";
+import y from "styled-components";
+const v = "Category", f = y.div`
+  display: flex;
+  padding: 2px 4px;
+  justify-content: center;
+  align-items: center;
+  border-radius: 4px;
+  background-color: var(--md-sys-color-surface-container);
+  transition: background-color 0.2s;
+  width: fit-content;
+  user-select: none;
+  position: relative;
+
+  /* if there's a category the colour gets overridden */
+  border: 1px solid var(--md-sys-color-outline-variant);
+
+  &.none {
+    &:not(:hover) {
+      color: var(--md-sys-color-on-surface-variant);
+    }
+    &:hover {
+      background-color: var(--md-sys-color-surface-container-high);
+    }
+  }
+
+  &.compact {
+    padding: 1px 2px;
+    ${p.labelMedium}
+  }
+
+  &.editing {
+    &:hover:not(.none) {
+      filter: brightness(1.2);
+    }
+  }
+
+  &.disabled {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+
+  &.power {
+    pointer-events: all;
+    cursor: pointer;
+
+    &:hover {
+      border-color: var(--md-sys-color-tertiary);
+      color: var(--md-sys-color-tertiary);
+    }
+  }
+`, j = g(
+  ({ value: o, color: r, isCompact: e, isEditing: t, isPower: n, isDisabled: i, style: s, className: a, ...c }, d) => /* @__PURE__ */ l.jsx(
+    f,
+    {
+      ...c,
+      ref: d,
+      className: m(a, {
+        none: !o,
+        compact: e,
+        editing: t,
+        power: n,
+        disabled: i
+      }),
+      style: { ...s, backgroundColor: r, borderColor: r },
+      children: o || v
+    }
+  )
+);
+export {
+  j as CategoryTag
+};
+//# sourceMappingURL=CategoryTag.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CategoryTag.es.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/CategoryTag.tsx"],"sourcesContent":["import { theme } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef } from 'react'\nimport styled from 'styled-components'\n\nconst NO_CATEGORY_LABEL = 'Category'\n\nconst StyledTag = styled.div`\n  display: flex;\n  padding: 2px 4px;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  background-color: var(--md-sys-color-surface-container);\n  transition: background-color 0.2s;\n  width: fit-content;\n  user-select: none;\n  position: relative;\n\n  /* if there's a category the colour gets overridden */\n  border: 1px solid var(--md-sys-color-outline-variant);\n\n  &.none {\n    &:not(:hover) {\n      color: var(--md-sys-color-on-surface-variant);\n    }\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-high);\n    }\n  }\n\n  &.compact {\n    padding: 1px 2px;\n    ${theme.labelMedium}\n  }\n\n  &.editing {\n    &:hover:not(.none) {\n      filter: brightness(1.2);\n    }\n  }\n\n  &.disabled {\n    pointer-events: none;\n    opacity: 0.5;\n  }\n\n  &.power {\n    pointer-events: all;\n    cursor: pointer;\n\n    &:hover {\n      border-color: var(--md-sys-color-tertiary);\n      color: var(--md-sys-color-tertiary);\n    }\n  }\n`\n\ninterface CategoryTagProps extends React.HTMLAttributes<HTMLDivElement> {\n  value?: string | null\n  color?: string\n  isCompact?: boolean\n  isEditing?: boolean\n  isPower?: boolean\n  isDisabled?: boolean\n}\n\nexport const CategoryTag = forwardRef<HTMLDivElement, CategoryTagProps>(\n  (\n    { value, color, isCompact, isEditing, isPower, isDisabled, style, className, ...props },\n    ref,\n  ) => {\n    return (\n      <StyledTag\n        {...props}\n        ref={ref}\n        className={clsx(className, {\n          none: !value,\n          compact: isCompact,\n          editing: isEditing,\n          power: isPower,\n          disabled: isDisabled,\n        })}\n        style={{ ...style, backgroundColor: color, borderColor: color }}\n      >\n        {value || NO_CATEGORY_LABEL}\n      </StyledTag>\n    )\n  },\n)\n"],"names":["NO_CATEGORY_LABEL","StyledTag","styled","theme","CategoryTag","forwardRef","value","color","isCompact","isEditing","isPower","isDisabled","style","className","props","ref","jsx","clsx"],"mappings":";;;;;AAKA,MAAMA,IAAoB,YAEpBC,IAAYC,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,MA0BnBC,EAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAkCVC,IAAcC;AAAA,EACzB,CACE,EAAE,OAAAC,GAAO,OAAAC,GAAO,WAAAC,GAAW,WAAAC,GAAW,SAAAC,GAAS,YAAAC,GAAY,OAAAC,GAAO,WAAAC,GAAW,GAAGC,EAAA,GAChFC,MAGEC,gBAAAA,EAAA;AAAA,IAACf;AAAA,IAAA;AAAA,MACE,GAAGa;AAAA,MACJ,KAAAC;AAAA,MACA,WAAWE,EAAKJ,GAAW;AAAA,QACzB,MAAM,CAACP;AAAA,QACP,SAASE;AAAA,QACT,SAASC;AAAA,QACT,OAAOC;AAAA,QACP,UAAUC;AAAA,MAAA,CACX;AAAA,MACD,OAAO,EAAE,GAAGC,GAAO,iBAAiBL,GAAO,aAAaA,EAAM;AAAA,MAE7D,UAASD,KAAAN;AAAA,IAAA;AAAA,EACZ;AAGN;"}

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

@@ -1,2 +1,2 @@
-"use strict";const t=require("../../../../../../_virtual/jsx-runtime.cjs.js"),A=require("clsx"),w=require("react"),Y=require("react-markdown"),Z=require("remark-emoji"),$=require("remark-gfm"),U=require("remark-directive"),ee=require("remark-directive-rehype"),te=require("../CommentInput/CommentInput.cjs.js"),ne=require("../ReactionContainer/Reactions.cjs.js"),ie=require("../../hooks/useReferenceTooltip.cjs.js"),se=require("../FilesGrid/FilesGrid.cjs.js"),re=require("../CommentInput/quillToMarkdown.cjs.js"),s=require("./ActivityComment.styled.cjs.js"),oe=require("./CommentWrapper.cjs.js"),l=require("./ActivityMarkdownComponents.cjs.js"),ce=require("./mappers.cjs.js"),ue=require("@ynput/ayon-react-components"),ae=require("../ActivityStatus/ActivityStatus.cjs.js"),D=require("../../context/FeedContext.cjs.js"),le=require("../../../../util/confirmDelete.cjs.js");require("react-toastify");require("uuid");require("lodash");require("../../../../util/pubsub.cjs.js");const me=require("../ActivityHeader/ActivityHeader.cjs.js");require("../../../../context/RemoteModulesContext.cjs.js");const xe=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 de=({activity:r={},onCheckChange:b,onDelete:m,onUpdate:x,projectInfo:pe,editProps:F,projectName:o,entityType:I,onReferenceClick:f,onFileExpand:M,showOrigin:H,isHighlighted:N,readOnly:g,statuses:B=[]})=>{const{userName:d,createReaction:P,deleteReaction:S}=D.useFeedContext();let{body:p,authorName:c,authorFullName:q,createdAt:G,referenceType:_,entityId:C,activityId:n,author:i,isOwner:R,files:j=[],origin:h}=r;c||(c=(i==null?void 0:i.name)||""),q||(q=(i==null?void 0:i.fullName)||c);const{editingId:L,setEditingId:E}=D.useFeedContext(),{onGoToFrame:u,setHighlightedActivities:O}=xe.useDetailsPanelContext(),y=()=>{E(n)},Q=()=>{E(null)},V=async(e,X)=>{await(x==null?void 0:x(e,X)),E(null)},a=L===n,T=_!=="origin"||H,W=async()=>{const e=re.getTextRefs(p);T&&h&&e.push({id:h.id,type:h.type}),m&&await m(n,C,e)},z=()=>{le.confirmDelete({title:"Delete comment",message:"Are you sure you want to delete this comment?",accept:async()=>{await W()}})},[,k]=ie(),v=w.useMemo(()=>ce.mapGraphQLReactions(r.reactions,d),[[...r.reactions||[]]]),J=e=>{e.isActive?P({projectName:o,userName:d,activityId:n,createReactionModel:{reaction:e.type}}):S({projectName:o,userName:d,activityId:n,reaction:e.type})},K=w.useCallback(e=>{e.annotation&&(u==null||u(e.annotation.range[0]),O([n]))},[u]);return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs(s.Comment,{className:A("comment",{isOwner:R,isEditing:a,isHighlighted:N}),id:n,children:[t.jsxRuntimeExports.jsx(me,{name:c,fullName:q,date:G,isRef:T,activity:r,projectName:o,entityType:I,onReferenceClick:f,onReferenceTooltip:k,children:void 0}),t.jsxRuntimeExports.jsxs(s.Body,{className:A("comment-body",{isEditing:a}),children:[!g&&t.jsxRuntimeExports.jsxs(s.Tools,{className:"tools",children:[R&&m&&t.jsxRuntimeExports.jsx(s.ToolButton,{icon:"delete",onClick:z,tooltip:"Delete comment"}),R&&y&&t.jsxRuntimeExports.jsx(s.ToolButton,{icon:"edit_square",onClick:y})]}),a?t.jsxRuntimeExports.jsx(te.default,{initValue:p,initFiles:j,isEditing:!0,onClose:Q,onSubmit:V,isOpen:!0,...F}):t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(oe,{children:t.jsxRuntimeExports.jsx(Y,{remarkPlugins:[$,Z,U,ee],urlTransform:e=>e,components:{a:e=>l.aTag(e,{entityId:C,projectName:o,onReferenceClick:f,onReferenceTooltip:k,activityId:n}),input:e=>l.inputTag(e,{activity:r,onCheckChange:b}),code:e=>l.codeTag(e),blockquote:e=>l.blockquoteTag(e),tip:e=>t.jsxRuntimeExports.jsxs(s.Tip,{children:[t.jsxRuntimeExports.jsx(ue.Icon,{icon:"info"}),e.children]}),status:e=>t.jsxRuntimeExports.jsx(ae,{name:e.id,statuses:B,children:e.children})},children:p})}),t.jsxRuntimeExports.jsx(se,{files:j,isCompact:j.length>6,activityId:n,projectName:o,isDownloadable:!0,onExpand:M,onAnnotationClick:K,onRemove:void 0})]}),!a&&t.jsxRuntimeExports.jsx("div",{style:{marginTop:"16px"},children:v&&t.jsxRuntimeExports.jsx(ne,{reactions:v,changeHandler:J,readOnly:g})})]})]})})};module.exports=de;
+"use strict";const t=require("../../../../../../_virtual/jsx-runtime.cjs.js"),P=require("clsx"),h=require("react"),ee=require("react-markdown"),te=require("remark-emoji"),re=require("remark-gfm"),ne=require("remark-directive"),oe=require("remark-directive-rehype"),ie=require("../CommentInput/CommentInput.cjs.js"),se=require("../ReactionContainer/Reactions.cjs.js"),ce=require("../../hooks/useReferenceTooltip.cjs.js"),ue=require("../FilesGrid/FilesGrid.cjs.js"),ae=require("../CommentInput/quillToMarkdown.cjs.js"),s=require("./ActivityComment.styled.cjs.js"),le=require("./CommentWrapper.cjs.js"),d=require("./ActivityMarkdownComponents.cjs.js"),me=require("./mappers.cjs.js"),xe=require("@ynput/ayon-react-components"),de=require("../ActivityStatus/ActivityStatus.cjs.js"),pe=require("../../context/FeedContext.cjs.js"),qe=require("../../../../util/confirmDelete.cjs.js");require("react-toastify");require("uuid");require("lodash");require("../../../../util/pubsub.cjs.js");const je=require("../ActivityHeader/ActivityHeader.cjs.js");require("../../../../context/RemoteModulesContext.cjs.js");const Re=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 ye=require("../CommentInput/hooks/useBlendedCategoryColor.cjs.js"),ge=require("../ActivityCategorySelect/CategoryTag.cjs.js"),Ce=({activity:n={},onCheckChange:S,onDelete:p,onUpdate:q,projectInfo:Ee,editProps:B,projectName:c,entityType:N,onReferenceClick:f,onFileExpand:H,showOrigin:$,isHighlighted:G,readOnly:T,statuses:_=[]})=>{var M;const{userName:j,createReaction:D,deleteReaction:L,editingId:O,setEditingId:R,categories:k}=pe.useFeedContext(),r=h.useMemo(()=>k.find(e=>{var x;return e.name===((x=n.activityData)==null?void 0:x.category)})||null,[(M=n==null?void 0:n.activityData)==null?void 0:M.category,k]),u=ye.useBlendedCategoryColor(r==null?void 0:r.color);let{body:y,authorName:l,authorFullName:g,createdAt:Q,referenceType:V,entityId:v,activityId:o,author:i,isOwner:A,files:C=[],origin:E}=n;l||(l=(i==null?void 0:i.name)||""),g||(g=(i==null?void 0:i.fullName)||l);const{onGoToFrame:m,setHighlightedActivities:W}=Re.useDetailsPanelContext(),w=()=>{R(o)},z=()=>{R(null)},J=async(e,x,U)=>{await(q==null?void 0:q(e,x,void 0,U)),R(null)},a=O===o,b=V!=="origin"||$,K=async()=>{const e=ae.getTextRefs(y);b&&E&&e.push({id:E.id,type:E.type}),p&&await p(o,v,e)},X=()=>{qe.confirmDelete({title:"Delete comment",message:"Are you sure you want to delete this comment?",accept:async()=>{await K()}})},[,I]=ce(),F=h.useMemo(()=>me.mapGraphQLReactions(n.reactions,j),[[...n.reactions||[]]]),Y=e=>{e.isActive?D({projectName:c,userName:j,activityId:o,createReactionModel:{reaction:e.type}}):L({projectName:c,userName:j,activityId:o,reaction:e.type})},Z=h.useCallback(e=>{e.annotation&&(m==null||m(e.annotation.range[0]),W([o]))},[m]);return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs(s.Comment,{className:P("comment",{isOwner:A,isEditing:a,isHighlighted:G}),id:o,$categoryPrimary:r==null?void 0:r.color,$categoryTertiary:u.primary,$categorySecondary:u.secondary,children:[t.jsxRuntimeExports.jsx(je,{name:l,fullName:g,date:Q,isRef:b,activity:n,projectName:c,entityType:N,onReferenceClick:f,onReferenceTooltip:I,children:void 0}),t.jsxRuntimeExports.jsxs(s.Body,{className:P("comment-body",{isEditing:a}),children:[!T&&A?t.jsxRuntimeExports.jsxs(s.Tools,{className:"tools",children:[p&&t.jsxRuntimeExports.jsx(s.ToolButton,{icon:"delete",onClick:X,tooltip:"Delete comment",variant:"text"}),w&&t.jsxRuntimeExports.jsx(s.ToolButton,{icon:"edit_square",onClick:w,variant:"text"})]}):t.jsxRuntimeExports.jsx("div",{className:"tools"}),!a&&r&&t.jsxRuntimeExports.jsx(ge.CategoryTag,{value:r.name,color:r.color,style:{top:-4,left:-4},isCompact:!0}),a?t.jsxRuntimeExports.jsx(ie.default,{initValue:y,initFiles:C,initCategory:r==null?void 0:r.name,isEditing:!0,onClose:z,onSubmit:J,isOpen:!0,...B}):t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(le,{children:t.jsxRuntimeExports.jsx(ee,{remarkPlugins:[re,te,ne,oe],urlTransform:e=>e,components:{a:e=>d.aTag(e,{entityId:v,projectName:c,onReferenceClick:f,onReferenceTooltip:I,activityId:o,categoryPrimary:r==null?void 0:r.color,categorySecondary:u.secondary}),input:e=>d.inputTag(e,{activity:n,onCheckChange:S}),code:e=>d.codeTag(e),blockquote:e=>d.blockquoteTag(e),tip:e=>t.jsxRuntimeExports.jsxs(s.Tip,{children:[t.jsxRuntimeExports.jsx(xe.Icon,{icon:"info"}),e.children]}),status:e=>t.jsxRuntimeExports.jsx(de,{name:e.id,statuses:_,children:e.children})},children:y})}),t.jsxRuntimeExports.jsx(ue,{files:C,isCompact:C.length>6,activityId:o,projectName:c,isDownloadable:!0,onExpand:H,onAnnotationClick:Z,onRemove:void 0})]}),!a&&t.jsxRuntimeExports.jsx("div",{style:{marginTop:"16px"},children:F&&t.jsxRuntimeExports.jsx(se,{reactions:F,changeHandler:Y,readOnly:T,categoryPrimary:r==null?void 0:r.color,categorySecondary:u.secondary,categoryTertiary:u.primary})})]})]})})};module.exports=Ce;
 //# sourceMappingURL=ActivityComment.cjs.js.map

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":"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"}
+{"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'\nimport { useBlendedCategoryColor } from '../CommentInput/hooks/useBlendedCategoryColor'\nimport { CategoryTag } from '../ActivityCategorySelect/CategoryTag'\n\ntype Props = {\n  activity: any\n  onCheckChange?: Function\n  onDelete?: (activityId: string, entityId: string, refs: any) => Promise<void>\n  onUpdate?: (value: any, files: any, refs?: any, data?: any) => Promise<void>\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, editingId, setEditingId, categories } =\n    useFeedContext()\n\n  const categoryData = useMemo(() => {\n    return categories.find((cat) => cat.name === activity.activityData?.category) || null\n  }, [activity?.activityData?.category, categories])\n  // Compute blended background color for category\n  const blendedCategoryColor = useBlendedCategoryColor(categoryData?.color)\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 { 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, data?: any) => {\n    await onUpdate?.(value, files, undefined, data)\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        $categoryPrimary={categoryData?.color}\n        $categoryTertiary={blendedCategoryColor.primary}\n        $categorySecondary={blendedCategoryColor.secondary}\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 && isOwner ? (\n            <Styled.Tools className={'tools'}>\n              {onDelete && (\n                <Styled.ToolButton\n                  icon=\"delete\"\n                  onClick={deleteConfirmation}\n                  tooltip=\"Delete comment\"\n                  variant=\"text\"\n                />\n              )}\n              {handleEditComment && (\n                <Styled.ToolButton icon=\"edit_square\" onClick={handleEditComment} variant=\"text\" />\n              )}\n            </Styled.Tools>\n          ) : (\n            <div className=\"tools\"></div>\n          )}\n\n          {!isEditing && categoryData && (\n            <CategoryTag\n              value={categoryData.name}\n              color={categoryData.color}\n              style={{\n                top: -4,\n                left: -4,\n              }}\n              isCompact\n            />\n          )}\n\n          {isEditing ? (\n            <CommentInput\n              initValue={body}\n              initFiles={files}\n              initCategory={categoryData?.name}\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                        categoryPrimary: categoryData?.color,\n                        categorySecondary: blendedCategoryColor.secondary,\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                  categoryPrimary={categoryData?.color}\n                  categorySecondary={blendedCategoryColor.secondary}\n                  categoryTertiary={blendedCategoryColor.primary}\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","editingId","setEditingId","categories","useFeedContext","categoryData","useMemo","cat","_a","blendedCategoryColor","useBlendedCategoryColor","body","authorName","authorFullName","createdAt","referenceType","entityId","activityId","author","isOwner","files","origin","onGoToFrame","setHighlightedActivities","useDetailsPanelContext","handleEditComment","handleEditCancel","handleSave","value","data","isEditing","isRef","handleDelete","refs","getTextRefs","deleteConfirmation","confirmDelete","setRefTooltip","useReferenceTooltip","mappedReactions","mapGraphQLReactions","reactionChangeHandler","reaction","onAnnotationClick","useCallback","file","jsx","Fragment","jsxs","Styled.Comment","clsx","ActivityHeader","Styled.Body","Styled.Tools","Styled.ToolButton","CategoryTag","CommentInput","CommentWrapper","ReactMarkdown","remarkGfm","emoji","remarkDirective","remarkDirectiveRehype","url","props","aTag","inputTag","codeTag","blockquoteTag","Styled.Tip","Icon","ActivityStatus","FilesGrid","Reactions"],"mappings":"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"}