npm - @ynput/ayon-frontend-shared - Versions diffs - 0.2.33 → 0.2.35 - Mend

@ynput/ayon-frontend-shared 0.2.33 → 0.2.35

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

Files changed (779) hide show

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

@@ -1,31 +1,31 @@
-import { j as o } from "../../../../../../_virtual/jsx-runtime.es.js";
-import S from "clsx";
-import { useMemo as F, useCallback as U } from "react";
-import ee from "react-markdown";
-import oe from "remark-emoji";
-import te from "remark-gfm";
-import re from "remark-directive";
-import ie from "remark-directive-rehype";
-import ne from "../CommentInput/CommentInput.es.js";
-import me from "../ReactionContainer/Reactions.es.js";
-import se from "../../hooks/useReferenceTooltip.es.js";
-import ae from "../FilesGrid/FilesGrid.es.js";
-import { getTextRefs as ce } from "../CommentInput/quillToMarkdown.es.js";
-import { Comment as le, Body as pe, Tools as de, ToolButton as N, Tip as fe } from "./ActivityComment.styled.es.js";
-import ue from "./CommentWrapper.es.js";
-import { blockquoteTag as xe, codeTag as ye, inputTag as ge, aTag as he } from "./ActivityMarkdownComponents.es.js";
-import { mapGraphQLReactions as Ce } from "./mappers.es.js";
-import { Icon as je } from "@ynput/ayon-react-components";
-import Te from "../ActivityStatus/ActivityStatus.es.js";
-import { useFeedContext as Re } from "../../context/FeedContext.es.js";
+import { j as t } from "../../../../../../_virtual/jsx-runtime.es.js";
+import F from "clsx";
+import { useMemo as N, useCallback as ee } from "react";
+import oe from "react-markdown";
+import te from "remark-emoji";
+import re from "remark-gfm";
+import ie from "remark-directive";
+import ne from "remark-directive-rehype";
+import me from "../CommentInput/CommentInput.es.js";
+import se from "../ReactionContainer/Reactions.es.js";
+import ae from "../../hooks/useReferenceTooltip.es.js";
+import ce from "../FilesGrid/FilesGrid.es.js";
+import { getTextRefs as le } from "../CommentInput/quillToMarkdown.es.js";
+import { Comment as pe, Body as de, Tools as fe, ToolButton as P, Tip as ue } from "./ActivityComment.styled.es.js";
+import ye from "./CommentWrapper.es.js";
+import { blockquoteTag as ge, codeTag as xe, inputTag as he, aTag as Ce } from "./ActivityMarkdownComponents.es.js";
+import { mapGraphQLReactions as je } from "./mappers.es.js";
+import { Icon as Te } from "@ynput/ayon-react-components";
+import Re from "../ActivityStatus/ActivityStatus.es.js";
+import { useFeedContext as ve } from "../../context/FeedContext.es.js";
 import { confirmDelete as ke } from "../../../../util/confirmDelete.es.js";
 import "react-toastify";
 import "uuid";
 import "lodash";
 import "../../../../util/pubsub.es.js";
-import ve from "../ActivityHeader/ActivityHeader.es.js";
+import be from "../ActivityHeader/ActivityHeader.es.js";
 import "../../../../context/RemoteModulesContext.es.js";
-import { useDetailsPanelContext as be } from "../../../../context/DetailsPanelContext.es.js";
+import { useDetailsPanelContext as Ae } from "../../../../context/DetailsPanelContext.es.js";
 import "../../../../context/ThumbnailUploaderContext.es.js";
 import "../../../../context/SettingsPanelContext.es.js";
 import "../../../../context/pip/PiPProvider.es.js";
@@ -36,65 +36,66 @@ import "../../../../context/AddonContext.es.js";
 import "../../../../context/PowerpackContext.es.js";
 import "../../../../context/MoveEntityContext.es.js";
 import "../../../../context/MenuContext.es.js";
-import { useBlendedCategoryColor as Ae } from "../CommentInput/hooks/useBlendedCategoryColor.es.js";
-import { CategoryTag as we } from "../ActivityCategorySelect/CategoryTag.es.js";
-const yo = ({
+import "../../../../context/WebsocketContext.es.js";
+import { useBlendedCategoryColor as we } from "../CommentInput/hooks/useBlendedCategoryColor.es.js";
+import { CategoryTag as Ee } from "../ActivityCategorySelect/CategoryTag.es.js";
+const ho = ({
   activity: r = {},
-  onCheckChange: P,
+  onCheckChange: H,
   onDelete: d,
   onUpdate: f,
-  projectInfo: Ee,
-  editProps: H,
+  projectInfo: Ie,
+  editProps: q,
   projectName: m,
-  entityType: q,
-  onReferenceClick: j,
-  onFileExpand: B,
+  entityType: B,
+  onReferenceClick: T,
+  onFileExpand: G,
   showOrigin: M,
   isHighlighted: $,
-  readOnly: T,
-  statuses: G = []
+  readOnly: R,
+  statuses: L = []
 }) => {
-  var I;
-  const { userName: u, createReaction: L, deleteReaction: O, editingId: Q, setEditingId: x, categories: R } = Re(), t = F(() => R.find((e) => {
+  var S;
+  const { userName: u, createReaction: O, deleteReaction: Q, editingId: V, setEditingId: y, categories: v, isGuest: g } = ve(), o = N(() => v.find((e) => {
     var p;
     return e.name === ((p = r.activityData) == null ? void 0 : p.category);
-  }) || null, [(I = r == null ? void 0 : r.activityData) == null ? void 0 : I.category, R]), s = Ae(t == null ? void 0 : t.color);
+  }) || null, [(S = r == null ? void 0 : r.activityData) == null ? void 0 : S.category, v]), s = we(o == null ? void 0 : o.color);
   let {
-    body: y,
+    body: x,
     authorName: c,
-    authorFullName: g,
-    createdAt: V,
-    referenceType: W,
+    authorFullName: h,
+    createdAt: W,
+    referenceType: _,
     entityId: k,
     activityId: i,
     author: n,
-    isOwner: v,
-    files: h = [],
-    origin: C
+    isOwner: b,
+    files: C = [],
+    origin: j
   } = r;
-  c || (c = (n == null ? void 0 : n.name) || ""), g || (g = (n == null ? void 0 : n.fullName) || c);
-  const { onGoToFrame: l, setHighlightedActivities: _ } = be(), b = () => {
-    x(i);
-  }, z = () => {
-    x(null);
-  }, J = async (e, p, D) => {
-    await (f == null ? void 0 : f(e, p, void 0, D)), x(null);
-  }, a = Q === i, A = W !== "origin" || M, K = async () => {
-    const e = ce(y);
-    A && C && e.push({ id: C.id, type: C.type }), d && await d(i, k, e);
-  }, X = () => {
+  c || (c = (n == null ? void 0 : n.name) || ""), h || (h = (n == null ? void 0 : n.fullName) || c);
+  const { onGoToFrame: l, setHighlightedActivities: z } = Ae(), A = () => {
+    y(i);
+  }, J = () => {
+    y(null);
+  }, K = async (e, p, U) => {
+    await (f == null ? void 0 : f(e, p, void 0, U)), y(null);
+  }, a = V === i, w = _ !== "origin" || M, X = async () => {
+    const e = le(x);
+    w && j && e.push({ id: j.id, type: j.type }), d && await d(i, k, e);
+  }, Y = () => {
     ke({
       title: "Delete comment",
       message: "Are you sure you want to delete this comment?",
       accept: async () => {
-        await K();
+        await X();
       }
     });
-  }, [, w] = se(), E = F(
-    () => Ce(r.reactions, u),
+  }, [, E] = ae(), I = N(
+    () => je(r.reactions, u),
     [[...r.reactions || []]]
-  ), Y = (e) => {
-    e.isActive ? L({
+  ), Z = (e) => {
+    e.isActive ? O({
       projectName: m,
       // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update
       userName: u,
@@ -102,61 +103,66 @@ const yo = ({
       createReactionModel: {
         reaction: e.type
       }
-    }) : O({
+    }) : Q({
       projectName: m,
       // @ts-ignore exposed endpoint doesn't need the username, we still need to pass it for the optimistic update
       userName: u,
       activityId: i,
       reaction: e.type
     });
-  }, Z = U(
+  }, D = ee(
     (e) => {
-      e.annotation && (l == null || l(e.annotation.range[0]), _([i]));
+      e.annotation && (l == null || l(e.annotation.range[0]), z([i]));
     },
     [l]
   );
-  return /* @__PURE__ */ o.jsx(o.Fragment, { children: /* @__PURE__ */ o.jsxs(
-    le,
+  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs(
+    pe,
     {
-      className: S("comment", { isOwner: v, isEditing: a, isHighlighted: $ }),
+      className: F("comment", {
+        isOwner: b,
+        isEditing: a,
+        isHighlighted: $,
+        category: !!o && !g
+      }),
       id: i,
-      $categoryPrimary: t == null ? void 0 : t.color,
+      $categoryPrimary: o == null ? void 0 : o.color,
       $categoryTertiary: s.primary,
       $categorySecondary: s.secondary,
       children: [
-        /* @__PURE__ */ o.jsx(
-          ve,
+        /* @__PURE__ */ t.jsx(
+          be,
           {
             name: c,
-            fullName: g,
-            date: V,
-            isRef: A,
+            fullName: h,
+            date: W,
+            isRef: w,
             activity: r,
             projectName: m,
-            entityType: q,
-            onReferenceClick: j,
-            onReferenceTooltip: w,
+            entityType: B,
+            onReferenceClick: T,
+            onReferenceTooltip: E,
             children: void 0
           }
         ),
-        /* @__PURE__ */ o.jsxs(pe, { className: S("comment-body", { isEditing: a }), children: [
-          !T && v ? /* @__PURE__ */ o.jsxs(de, { className: "tools", children: [
-            d && /* @__PURE__ */ o.jsx(
-              N,
+        /* @__PURE__ */ t.jsxs(de, { className: F("comment-body", { isEditing: a }), children: [
+          !R && b ? /* @__PURE__ */ t.jsxs(fe, { className: "tools", children: [
+            d && /* @__PURE__ */ t.jsx(
+              P,
               {
                 icon: "delete",
-                onClick: X,
+                onClick: Y,
                 tooltip: "Delete comment",
                 variant: "text"
               }
             ),
-            b && /* @__PURE__ */ o.jsx(N, { icon: "edit_square", onClick: b, variant: "text" })
-          ] }) : /* @__PURE__ */ o.jsx("div", { className: "tools" }),
-          !a && t && /* @__PURE__ */ o.jsx(
-            we,
+            A && /* @__PURE__ */ t.jsx(P, { icon: "edit_square", onClick: A, variant: "text" })
+          ] }) : /* @__PURE__ */ t.jsx("div", { className: "tools" }),
+          !a && !g && o && /* @__PURE__ */ t.jsx(
+            Ee,
             {
-              value: t.name,
-              color: t.color,
+              value: o.name,
+              color: o.color,
               style: {
                 top: -4,
                 left: -4
@@ -164,80 +170,81 @@ const yo = ({
               isCompact: !0
             }
           ),
-          a ? /* @__PURE__ */ o.jsx(
-            ne,
+          a ? /* @__PURE__ */ t.jsx(
+            me,
             {
-              initValue: y,
-              initFiles: h,
-              initCategory: t == null ? void 0 : t.name,
+              initValue: x,
+              initFiles: C,
+              initCategory: o == null ? void 0 : o.name,
               isEditing: !0,
-              onClose: z,
-              onSubmit: J,
+              onClose: J,
+              onSubmit: K,
               isOpen: !0,
-              ...H
+              ...q
             }
-          ) : /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-            /* @__PURE__ */ o.jsx(ue, { children: /* @__PURE__ */ o.jsx(
-              ee,
+          ) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+            /* @__PURE__ */ t.jsx(ye, { children: /* @__PURE__ */ t.jsx(
+              oe,
               {
-                remarkPlugins: [te, oe, re, ie],
+                remarkPlugins: [re, te, ie, ne],
                 urlTransform: (e) => e,
                 components: {
                   // a links
                   // @ts-ignore
                   a: (e) => (
                     // @ts-ignore
-                    he(e, {
+                    Ce(e, {
                       entityId: k,
                       projectName: m,
-                      onReferenceClick: j,
-                      onReferenceTooltip: w,
+                      onReferenceClick: T,
+                      onReferenceTooltip: E,
                       activityId: i,
-                      categoryPrimary: t == null ? void 0 : t.color,
+                      categoryPrimary: o == null ? void 0 : o.color,
                       categorySecondary: s.secondary
                     })
                   ),
                   // checkbox inputs
                   // @ts-ignore
-                  input: (e) => ge(e, { activity: r, onCheckChange: P }),
+                  input: (e) => he(e, { activity: r, onCheckChange: H }),
                   // code syntax highlighting
                   // eslint-disable-next-line
                   // @ts-ignore
-                  code: (e) => ye(e),
+                  code: (e) => xe(e),
                   // @ts-ignore
-                  blockquote: (e) => xe(e),
+                  blockquote: (e) => ge(e),
                   // @ts-ignore
-                  tip: (e) => /* @__PURE__ */ o.jsxs(fe, { children: [
-                    /* @__PURE__ */ o.jsx(je, { icon: "info" }),
+                  tip: (e) => /* @__PURE__ */ t.jsxs(ue, { children: [
+                    /* @__PURE__ */ t.jsx(Te, { icon: "info" }),
                     e.children
                   ] }),
                   // @ts-ignore
-                  status: (e) => /* @__PURE__ */ o.jsx(Te, { name: e.id, statuses: G, children: e.children })
+                  status: (e) => /* @__PURE__ */ t.jsx(Re, { name: e.id, statuses: L, children: e.children })
                 },
-                children: y
+                children: x
               }
             ) }),
-            /* @__PURE__ */ o.jsx(
-              ae,
+            /* @__PURE__ */ t.jsx(
+              ce,
               {
-                files: h,
-                isCompact: h.length > 6,
+                files: C,
+                isCompact: C.length > 6,
                 activityId: i,
                 projectName: m,
                 isDownloadable: !0,
-                onExpand: B,
-                onAnnotationClick: Z,
+                onExpand: G,
+                onAnnotationClick: D,
                 onRemove: void 0
               }
             )
           ] }),
-          !a && /* @__PURE__ */ o.jsx("div", { style: { marginTop: "16px" }, children: E && /* @__PURE__ */ o.jsx(
-            me,
+          !a && /* @__PURE__ */ t.jsx("div", { style: { marginTop: "16px" }, children: I && /* @__PURE__ */ t.jsx(
+            se,
             {
-              reactions: E,
-              changeHandler: Y,
-              readOnly: T,
-              categoryPrimary: t == null ? void 0 : t.color,
+              reactions: I,
+              changeHandler: Z,
+              readOnly: R,
+              category: o && !g ? o.name : void 0,
+              categoryPrimary: o == null ? void 0 : o.color,
               categorySecondary: s.secondary,
               categoryTertiary: s.primary
             }
@@ -248,6 +255,6 @@ const yo = ({
   ) });
 };
 export {
-  yo as default
+  ho as default
 };
 //# sourceMappingURL=ActivityComment.es.js.map

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

	@@ -1 +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'\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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"}
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'\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, isGuest } =\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', {\n isOwner,\n isEditing,\n isHighlighted,\n category: !!categoryData && !isGuest,\n })}\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 && !isGuest && 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 category={categoryData && !isGuest ? categoryData.name : undefined}\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","isGuest","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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"}

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

@@ -5,8 +5,12 @@
   --background-color: var(--md-sys-color-surface-container);
   --button-color-secondary: var(--md-sys-color-surface-container-high);
   --border-color: transparent;
-  /* CATEGORY */
-  ${({$categoryPrimary:a,$categorySecondary:n,$categoryTertiary:t})=>i.categoryColorCss(a,n,t)}
+  /* only apply category colours if category classname is present */
+  &.category {
+    /* CATEGORY */
+    ${({$categoryPrimary:a,$categorySecondary:t,$categoryTertiary:n})=>i.categoryColorCss(a,t,n)}
+  }
   /* reset default */
   list-style: none;

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

	@@ -1 +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'\nimport { categoryColorCss, CommentProps } from '../CommentInput/CommentInput.styled'\n\nexport const CommentWrapper = styled.div`\n border-radius: var(--border-radius-m);\n`\n\nexport const Comment = styled.li<CommentProps>`\n /* VARS /\n --background-color: var(--md-sys-color-surface-container);\n --button-color-secondary: var(--md-sys-color-surface-container-high);\n --border-color: transparent;\n / CATEGORY /\n ${({ $categoryPrimary, $categorySecondary, $categoryTertiary }) =>\n categoryColorCss($categoryPrimary, $categorySecondary, $categoryTertiary)}\n\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(--background-color);\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 & > :nth-child(2) + * {\n margin-top: 8px;\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(--button-color-secondary);\n border-radius: var(--border-radius-m);\n z-index: 50;\n padding: 2px;\n gap: var(--base-gap-small);\n`\n\nexport const ToolButton = styled(Button)`\n &.hasIcon {\n padding: 4px;\n }\n\n &:hover {\n background-color: var(--button-color-secondary);\n filter: brightness(1.2);\n }\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","$categoryPrimary","$categorySecondary","$categoryTertiary","categoryColorCss","Body","theme","QuoteLine","attachmentBase","css","BlockCode","Tools","ToolButton","Button","Tip"],"mappings":"uNAI8BA,EAAO;AAAA;AAAA,EAI9B,MAAMC,EAAUD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~IAM1B~~,CAAC,CAAE,iBAAAE,EAAkB,mBAAAC,EAAoB,kBAAAC,KACzCC,mBAAiBH,EAAkBC,EAAoBC,CAAiB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~EA0ChEE~~,EAAON,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,MAiCrBO,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,EAAYR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYLA,EAAO;AAAA;AAAA;AAAA;AAAA,EAMlC,MAAMS,EAAiBC,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBMV,EAAO;AAAA,IAChCS,CAAc;AAAA,EAGYT,EAAO;AAAA,IACjCS,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaET,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWpB,MAAMW,EAAYX,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiBnBY,EAAQZ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYfa,EAAab,EAAOc,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgB1BC,EAAMf,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
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'\nimport { categoryColorCss, CommentProps } from '../CommentInput/CommentInput.styled'\n\nexport const CommentWrapper = styled.div`\n border-radius: var(--border-radius-m);\n`\n\nexport const Comment = styled.li<CommentProps>`\n /* VARS /\n --background-color: var(--md-sys-color-surface-container);\n --button-color-secondary: var(--md-sys-color-surface-container-high);\n --border-color: transparent;\n\n / only apply category colours if category classname is present /\n &.category {\n / CATEGORY /\n ${({ $categoryPrimary, $categorySecondary, $categoryTertiary }) =>\n categoryColorCss($categoryPrimary, $categorySecondary, $categoryTertiary)}\n }\n\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(--background-color);\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 & > :nth-child(2) + * {\n margin-top: 8px;\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(--button-color-secondary);\n border-radius: var(--border-radius-m);\n z-index: 50;\n padding: 2px;\n gap: var(--base-gap-small);\n`\n\nexport const ToolButton = styled(Button)`\n &.hasIcon {\n padding: 4px;\n }\n\n &:hover {\n background-color: var(--button-color-secondary);\n filter: brightness(1.2);\n }\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","$categoryPrimary","$categorySecondary","$categoryTertiary","categoryColorCss","Body","theme","QuoteLine","attachmentBase","css","BlockCode","Tools","ToolButton","Button","Tip"],"mappings":"uNAI8BA,EAAO;AAAA;AAAA,EAI9B,MAAMC,EAAUD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MASxB,CAAC,CAAE,iBAAAE,EAAkB,mBAAAC,EAAoB,kBAAAC,KACzCC,mBAAiBH,EAAkBC,EAAoBC,CAAiB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA2ClEE,EAAON,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,MAiCrBO,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,EAAYR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYLA,EAAO;AAAA;AAAA;AAAA;AAAA,EAMlC,MAAMS,EAAiBC,EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBMV,EAAO;AAAA,IAChCS,CAAc;AAAA,EAGYT,EAAO;AAAA,IACjCS,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaET,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWpB,MAAMW,EAAYX,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiBnBY,EAAQZ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYfa,EAAab,EAAOc,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgB1BC,EAAMf,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 CHANGED Viewed

@@ -1,6 +1,6 @@
 import { theme as r, Button as t } from "@ynput/ayon-react-components";
-import o, { css as d } from "styled-components";
-import { categoryColorCss as s } from "../CommentInput/CommentInput.styled.es.js";
+import o, { css as s } from "styled-components";
+import { categoryColorCss as d } from "../CommentInput/CommentInput.styled.es.js";
 o.div`
   border-radius: var(--border-radius-m);
 `;
@@ -9,8 +9,12 @@ const m = o.li`
   --background-color: var(--md-sys-color-surface-container);
   --button-color-secondary: var(--md-sys-color-surface-container-high);
   --border-color: transparent;
-  /* CATEGORY */
-  ${({ $categoryPrimary: e, $categorySecondary: i, $categoryTertiary: n }) => s(e, i, n)}
+  /* only apply category colours if category classname is present */
+  &.category {
+    /* CATEGORY */
+    ${({ $categoryPrimary: e, $categorySecondary: i, $categoryTertiary: n }) => d(e, i, n)}
+  }
   /* reset default */
   list-style: none;
@@ -181,7 +185,7 @@ o.div`
   flex-wrap: wrap;
   gap: var(--base-gap-large);
 `;
-const a = d`
+const a = s`
   height: 100px;
   width: 100px;
   object-fit: contain;

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

	@@ -1 +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'\nimport { categoryColorCss, CommentProps } from '../CommentInput/CommentInput.styled'\n\nexport const CommentWrapper = styled.div`\n border-radius: var(--border-radius-m);\n`\n\nexport const Comment = styled.li<CommentProps>`\n /* VARS /\n --background-color: var(--md-sys-color-surface-container);\n --button-color-secondary: var(--md-sys-color-surface-container-high);\n --border-color: transparent;\n / CATEGORY /\n ${({ $categoryPrimary, $categorySecondary, $categoryTertiary }) =>\n categoryColorCss($categoryPrimary, $categorySecondary, $categoryTertiary)}\n\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(--background-color);\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 & > :nth-child(2) + * {\n margin-top: 8px;\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(--button-color-secondary);\n border-radius: var(--border-radius-m);\n z-index: 50;\n padding: 2px;\n gap: var(--base-gap-small);\n`\n\nexport const ToolButton = styled(Button)`\n &.hasIcon {\n padding: 4px;\n }\n\n &:hover {\n background-color: var(--button-color-secondary);\n filter: brightness(1.2);\n }\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","$categoryPrimary","$categorySecondary","$categoryTertiary","categoryColorCss","Body","theme","QuoteLine","attachmentBase","css","BlockCode","Tools","ToolButton","Button","Tip"],"mappings":";;;AAI8BA,EAAO;AAAA;AAAA;AAI9B,MAAMC,IAAUD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~IAM1B~~,CAAC,EAAE,kBAAAE,GAAkB,oBAAAC,GAAoB,mBAAAC,QACzCC,EAAiBH,GAAkBC,GAAoBC,CAAiB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,~~GA0ChEE~~,IAAON,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,MAiCrBO,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,IAAYR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYLA,EAAO;AAAA;AAAA;AAAA;AAAA;AAMlC,MAAMS,IAAiBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBMV,EAAO;AAAA,IAChCS,CAAc;AAAA;AAGYT,EAAO;AAAA,IACjCS,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaET,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWpB,MAAMW,IAAYX,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAiBnBY,IAAQZ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAYfa,IAAab,EAAOc,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAgB1BC,IAAMf,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
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'\nimport { categoryColorCss, CommentProps } from '../CommentInput/CommentInput.styled'\n\nexport const CommentWrapper = styled.div`\n border-radius: var(--border-radius-m);\n`\n\nexport const Comment = styled.li<CommentProps>`\n /* VARS /\n --background-color: var(--md-sys-color-surface-container);\n --button-color-secondary: var(--md-sys-color-surface-container-high);\n --border-color: transparent;\n\n / only apply category colours if category classname is present /\n &.category {\n / CATEGORY /\n ${({ $categoryPrimary, $categorySecondary, $categoryTertiary }) =>\n categoryColorCss($categoryPrimary, $categorySecondary, $categoryTertiary)}\n }\n\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(--background-color);\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 & > :nth-child(2) + * {\n margin-top: 8px;\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(--button-color-secondary);\n border-radius: var(--border-radius-m);\n z-index: 50;\n padding: 2px;\n gap: var(--base-gap-small);\n`\n\nexport const ToolButton = styled(Button)`\n &.hasIcon {\n padding: 4px;\n }\n\n &:hover {\n background-color: var(--button-color-secondary);\n filter: brightness(1.2);\n }\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","$categoryPrimary","$categorySecondary","$categoryTertiary","categoryColorCss","Body","theme","QuoteLine","attachmentBase","css","BlockCode","Tools","ToolButton","Button","Tip"],"mappings":";;;AAI8BA,EAAO;AAAA;AAAA;AAI9B,MAAMC,IAAUD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MASxB,CAAC,EAAE,kBAAAE,GAAkB,oBAAAC,GAAoB,mBAAAC,QACzCC,EAAiBH,GAAkBC,GAAoBC,CAAiB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA2ClEE,IAAON,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,MAiCrBO,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,IAAYR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYLA,EAAO;AAAA;AAAA;AAAA;AAAA;AAMlC,MAAMS,IAAiBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBMV,EAAO;AAAA,IAChCS,CAAc;AAAA;AAGYT,EAAO;AAAA,IACjCS,CAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaET,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWpB,MAAMW,IAAYX,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAiBnBY,IAAQZ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAYfa,IAAab,EAAOc,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAgB1BC,IAAMf,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/ActivityHeader/ActivityHeader.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";const t=require("../../../../../../_virtual/jsx-runtime.cjs.js"),e=require("./ActivityHeader.styled.cjs.js"),U=require("../ActivityReference/ActivityReference.cjs.js"),w=require("../ActivityDate.cjs.js"),H=require("@ynput/ayon-react-components"),S=require("../../../../components/UserImage/UserImage.cjs.js"),T=({name:o,fullName:j,date:a,isRef:m,activity:i={},children:h,projectName:y,entityType:E,onReferenceClick:r,onReferenceTooltip:x})=>{var c,l,p;const{referenceType:v,origin:s,activityType:b,versions:n,activityId:g}=i,u=v==="mention",R=b==="version.publish",q=n&&(n==null?void 0:n.length)>1?"published versions":"published a version",I=u?"mentioned":"commented",A=u?` ${E} on`:"on",d=((c=i.author)==null?void 0:c.deleted)||!((l=i.author)!=null&&l.active);return t.jsxRuntimeExports.jsxs(e.Header,{children:[t.jsxRuntimeExports.jsxs(e.Body,{children:[o&&!d&&t.jsxRuntimeExports.jsx(S.UserImage,{name:o,size:22}),d&&t.jsxRuntimeExports.jsx(H.Icon,{icon:"account_circle"}),t.jsxRuntimeExports.jsx("h5",{children:j||((p=i.activityData)==null?void 0:p.author)||"Unknown"}),m&&t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(e.Text,{children:t.jsxRuntimeExports.jsx("strong",{children:I})}),t.jsxRuntimeExports.jsx(e.Text,{style:{overflow:"hidden",textOverflow:"ellipsis"},children:A}),s&&t.jsxRuntimeExports.jsx(U,{id:s.id,type:s.type,variant:"text",onClick:()=>r==null?void 0:r({entityId:s.id,entityType:s.type,projectName:y,activityId:g}),onMouseEnter:(D,M)=>x==null?void 0:x({type:s.type,id:s.id,label:s.label,name:s.id,pos:M}),children:s.label||s.name})]}),R&&t.jsxRuntimeExports.jsx(e.Text,{children:q}),h]}),t.jsxRuntimeExports.jsx(w.default,{date:a})]})};module.exports=T;
+"use strict";const t=require("../../../../../../_virtual/jsx-runtime.cjs.js"),i=require("./ActivityHeader.styled.cjs.js"),w=require("../ActivityReference/ActivityReference.cjs.js"),H=require("../ActivityDate.cjs.js"),S=require("@ynput/ayon-react-components"),T=require("../../../../components/UserImage/UserImage.cjs.js"),_=({name:e,fullName:j,date:h,isRef:a,activity:n={},children:y,projectName:m,entityType:E,onReferenceClick:o,onReferenceTooltip:x})=>{var c,l,p;const{referenceType:g,origin:s,activityType:v,versions:r,activityId:b}=n,u=g==="mention",R=v==="version.publish",q=r&&(r==null?void 0:r.length)>1?"published versions":"published a version",I=u?"mentioned":"commented",A=u?` ${E} on`:"on",M=e==null?void 0:e.startsWith("guest."),d=(((c=n.author)==null?void 0:c.deleted)||!((l=n.author)!=null&&l.active))&&!M;return t.jsxRuntimeExports.jsxs(i.Header,{children:[t.jsxRuntimeExports.jsxs(i.Body,{children:[e&&!d&&t.jsxRuntimeExports.jsx(T.UserImage,{name:e,size:22}),d&&t.jsxRuntimeExports.jsx(S.Icon,{icon:"account_circle"}),t.jsxRuntimeExports.jsx("h5",{children:j||((p=n.activityData)==null?void 0:p.author)||"Unknown"}),a&&t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(i.Text,{children:t.jsxRuntimeExports.jsx("strong",{children:I})}),t.jsxRuntimeExports.jsx(i.Text,{style:{overflow:"hidden",textOverflow:"ellipsis"},children:A}),s&&t.jsxRuntimeExports.jsx(w,{id:s.id,type:s.type,variant:"text",onClick:()=>o==null?void 0:o({entityId:s.id,entityType:s.type,projectName:m,activityId:b}),onMouseEnter:(V,U)=>x==null?void 0:x({type:s.type,id:s.id,label:s.label,name:s.id,pos:U}),children:s.label||s.name})]}),R&&t.jsxRuntimeExports.jsx(i.Text,{children:q}),y]}),t.jsxRuntimeExports.jsx(H.default,{date:h})]})};module.exports=_;
 //# sourceMappingURL=ActivityHeader.cjs.js.map