@ynput/ayon-frontend-shared 0.2.34 → 0.2.36

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

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

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

@@ -1 +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;"}
+{"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\nexport const isCategoryHidden = (\n  categories: ActivityCategory[],\n  { isGuest, isUser }: { isGuest?: boolean; isUser: boolean },\n) => {\n  // guest can never see categories. They create comments with categories but cannot see them\n  if (isGuest) return true\n  // if there are no categories a regular user has access to, hide the category select\n  if (!categories.length && isUser) return true\n  // admins always see the category select, even if there are no categories\n  return false\n}\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  isHidden?: 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  isHidden,\n  isCompact,\n  hasPowerpack,\n  onPowerFeature,\n  onChange,\n  ...props\n}) => {\n  if (isHidden) return null\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":["isCategoryHidden","categories","isGuest","isUser","CATEGORY_PP_MIN_VERSION","StyledDropdown","styled","Dropdown","ActivityCategorySelect","value","readonly","isHidden","isCompact","hasPowerpack","onPowerFeature","onChange","props","category","cat","color","jsx","CategoryTag","toast","options","val","option","isActive","isSelected","index","CategoryDropdownItem"],"mappings":";;;;;;AASO,MAAMA,IAAmB,CAC9BC,GACA,EAAE,SAAAC,GAAS,QAAAC,QAGP,GAAAD,KAEA,CAACD,EAAW,UAAUE,IAKtBC,IAA0B,SAE1BC,IAAiBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAyBzBC,IAA0D,CAAC;AAAA,EACtE,OAAAC;AAAA,EACA,YAAAR;AAAA,EACA,UAAAS;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,MAAIL,EAAiB,QAAA;AAErB,QAAMM,IAAWhB,EAAW,KAAK,CAACiB,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,MAAIJ;AACF,iCAAQW,GAAY,EAAA,OAAAZ,GAAc,OAAAU,GAAc,WAAAP,GAAsB,OAAOI,EAAM,OAAO;AAGxF,MAAA,CAACf,EAAW;AAEZ,WAAAmB,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,GAAGR,EAAW,IAAI,CAACiB,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

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../../../../../_virtual/jsx-runtime.cjs.js"),d=require("@ynput/ayon-react-components"),x=require("clsx"),g=require("react"),m=require("styled-components"),y=m.span`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../../../../../_virtual/jsx-runtime.cjs.js"),s=require("@ynput/ayon-react-components"),d=require("clsx"),g=require("react"),m=require("styled-components"),y=m.span`
   display: flex;
   justify-content: flex-start;
   align-items: center;
@@ -17,5 +17,5 @@
       color: var(--md-sys-color-on-surface) !important;
     }
   }
-`,f=g.forwardRef(({label:r,color:e,icon:t,isSelected:o,startContent:n,endContent:a,isClear:c,style:i,className:p,...l},u)=>s.jsxRuntimeExports.jsxs(y,{...l,className:x(p,{selected:o}),style:{backgroundColor:o&&e?e:"",...i},ref:u,children:[n,s.jsxRuntimeExports.jsx(d.Icon,{icon:t||(c?"clear":"crop_square"),style:{color:e||""}}),r,a]}));exports.CategoryDropdownItem=f;
+`,f=g.forwardRef(({label:n,color:e,icon:o,isSelected:t,startContent:a,endContent:c,isClear:i,style:p,className:u,...l},x)=>r.jsxRuntimeExports.jsxs(y,{...l,className:d(u,{selected:t}),style:{backgroundColor:t&&e?e:"",color:s.getTextColor(t&&e?e:""),...p},ref:x,children:[a,r.jsxRuntimeExports.jsx(s.Icon,{icon:o||(i?"clear":"crop_square"),style:{color:e||""}}),n,c]}));exports.CategoryDropdownItem=f;
 //# sourceMappingURL=CategoryDropdownItem.cjs.js.map

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

@@ -1 +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  white-space: nowrap;\n\n  [icon='crop_square'] {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n    font-size: 16px;\n  }\n\n  &.selected {\n    [icon='crop_square'] {\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\nexport interface CategoryDropdownItemProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {\n  label: string\n  color: string | null\n  icon?: string // override icon if needed\n  startContent?: React.ReactNode\n  endContent?: React.ReactNode\n  isClear?: boolean\n  isSelected?: boolean\n}\n\nexport const CategoryDropdownItem = forwardRef<HTMLSpanElement, CategoryDropdownItemProps>(\n  (\n    {\n      label,\n      color,\n      icon,\n      isSelected,\n      startContent,\n      endContent,\n      isClear,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <StyledItem\n        {...props}\n        className={clsx(className, { selected: isSelected })}\n        style={{ backgroundColor: isSelected && color ? color : '', ...style }}\n        ref={ref}\n      >\n        {startContent}\n        {\n          <Icon\n            icon={icon ? icon : isClear ? 'clear' : 'crop_square'}\n            style={{ color: color || '' }}\n          />\n        }\n        {label}\n        {endContent}\n      </StyledItem>\n    )\n  },\n)\n"],"names":["StyledItem","styled","CategoryDropdownItem","forwardRef","label","color","icon","isSelected","startContent","endContent","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;AAAA,EAgCbC,EAAuBC,EAAA,WAClC,CACE,CACE,MAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,aAAAC,EACA,WAAAC,EACA,QAAAC,EACA,MAAAC,EACA,UAAAC,EACA,GAAGC,GAELC,IAGEC,EAAA,kBAAA,KAACf,EAAA,CACE,GAAGa,EACJ,UAAWG,EAAKJ,EAAW,CAAE,SAAUL,EAAY,EACnD,MAAO,CAAE,gBAAiBA,GAAcF,EAAQA,EAAQ,GAAI,GAAGM,CAAM,EACrE,IAAAG,EAEC,SAAA,CAAAN,EAECS,EAAA,kBAAA,IAACC,EAAA,KAAA,CACC,KAAMZ,IAAcI,EAAU,QAAU,eACxC,MAAO,CAAE,MAAOL,GAAS,EAAG,CAAA,CAC9B,EAEDD,EACAK,CAAA,CAAA,CACH,CAGN"}
+{"version":3,"file":"CategoryDropdownItem.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.tsx"],"sourcesContent":["import { getTextColor, 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  white-space: nowrap;\n\n  [icon='crop_square'] {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n    font-size: 16px;\n  }\n\n  &.selected {\n    [icon='crop_square'] {\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\nexport interface CategoryDropdownItemProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {\n  label: string\n  color: string | null\n  icon?: string // override icon if needed\n  startContent?: React.ReactNode\n  endContent?: React.ReactNode\n  isClear?: boolean\n  isSelected?: boolean\n}\n\nexport const CategoryDropdownItem = forwardRef<HTMLSpanElement, CategoryDropdownItemProps>(\n  (\n    {\n      label,\n      color,\n      icon,\n      isSelected,\n      startContent,\n      endContent,\n      isClear,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <StyledItem\n        {...props}\n        className={clsx(className, { selected: isSelected })}\n        style={{ backgroundColor: isSelected && color ? color : '', color: getTextColor(isSelected && color ? color : ''), ...style }}\n        ref={ref}\n      >\n        {startContent}\n        {\n          <Icon\n            icon={icon ? icon : isClear ? 'clear' : 'crop_square'}\n            style={{ color: color || '' }}\n          />\n        }\n        {label}\n        {endContent}\n      </StyledItem>\n    )\n  },\n)\n"],"names":["StyledItem","styled","CategoryDropdownItem","forwardRef","label","color","icon","isSelected","startContent","endContent","isClear","style","className","props","ref","jsxs","clsx","getTextColor","jsx","Icon"],"mappings":"+PAKMA,EAAaC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgCbC,EAAuBC,EAAA,WAClC,CACE,CACE,MAAAC,EACA,MAAAC,EACA,KAAAC,EACA,WAAAC,EACA,aAAAC,EACA,WAAAC,EACA,QAAAC,EACA,MAAAC,EACA,UAAAC,EACA,GAAGC,GAELC,IAGEC,EAAA,kBAAA,KAACf,EAAA,CACE,GAAGa,EACJ,UAAWG,EAAKJ,EAAW,CAAE,SAAUL,EAAY,EACnD,MAAO,CAAE,gBAAiBA,GAAcF,EAAQA,EAAQ,GAAI,MAAOY,EAAAA,aAAaV,GAAcF,EAAQA,EAAQ,EAAE,EAAG,GAAGM,CAAM,EAC5H,IAAAG,EAEC,SAAA,CAAAN,EAECU,EAAA,kBAAA,IAACC,EAAA,KAAA,CACC,KAAMb,IAAcI,EAAU,QAAU,eACxC,MAAO,CAAE,MAAOL,GAAS,EAAG,CAAA,CAC9B,EAEDD,EACAK,CAAA,CAAA,CACH,CAGN"}

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

@@ -1,9 +1,9 @@
 import { j as s } from "../../../../../../_virtual/jsx-runtime.es.js";
-import { Icon as f } from "@ynput/ayon-react-components";
-import x from "clsx";
-import { forwardRef as d } from "react";
-import g from "styled-components";
-const u = g.span`
+import { getTextColor as l, Icon as x } from "@ynput/ayon-react-components";
+import d from "clsx";
+import { forwardRef as g } from "react";
+import u from "styled-components";
+const y = u.span`
   display: flex;
   justify-content: flex-start;
   align-items: center;
@@ -22,32 +22,32 @@ const u = g.span`
       color: var(--md-sys-color-on-surface) !important;
     }
   }
-`, L = d(
+`, R = g(
   ({
     label: e,
-    color: o,
-    icon: t,
-    isSelected: r,
+    color: t,
+    icon: r,
+    isSelected: o,
     startContent: n,
     endContent: a,
     isClear: p,
     style: i,
     className: c,
     ...m
-  }, l) => /* @__PURE__ */ s.jsxs(
-    u,
+  }, f) => /* @__PURE__ */ s.jsxs(
+    y,
     {
       ...m,
-      className: x(c, { selected: r }),
-      style: { backgroundColor: r && o ? o : "", ...i },
-      ref: l,
+      className: d(c, { selected: o }),
+      style: { backgroundColor: o && t ? t : "", color: l(o && t ? t : ""), ...i },
+      ref: f,
       children: [
         n,
         /* @__PURE__ */ s.jsx(
-          f,
+          x,
           {
-            icon: t || (p ? "clear" : "crop_square"),
-            style: { color: o || "" }
+            icon: r || (p ? "clear" : "crop_square"),
+            style: { color: t || "" }
           }
         ),
         e,
@@ -57,6 +57,6 @@ const u = g.span`
   )
 );
 export {
-  L as CategoryDropdownItem
+  R as CategoryDropdownItem
 };
 //# sourceMappingURL=CategoryDropdownItem.es.js.map

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

@@ -1 +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  white-space: nowrap;\n\n  [icon='crop_square'] {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n    font-size: 16px;\n  }\n\n  &.selected {\n    [icon='crop_square'] {\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\nexport interface CategoryDropdownItemProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {\n  label: string\n  color: string | null\n  icon?: string // override icon if needed\n  startContent?: React.ReactNode\n  endContent?: React.ReactNode\n  isClear?: boolean\n  isSelected?: boolean\n}\n\nexport const CategoryDropdownItem = forwardRef<HTMLSpanElement, CategoryDropdownItemProps>(\n  (\n    {\n      label,\n      color,\n      icon,\n      isSelected,\n      startContent,\n      endContent,\n      isClear,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <StyledItem\n        {...props}\n        className={clsx(className, { selected: isSelected })}\n        style={{ backgroundColor: isSelected && color ? color : '', ...style }}\n        ref={ref}\n      >\n        {startContent}\n        {\n          <Icon\n            icon={icon ? icon : isClear ? 'clear' : 'crop_square'}\n            style={{ color: color || '' }}\n          />\n        }\n        {label}\n        {endContent}\n      </StyledItem>\n    )\n  },\n)\n"],"names":["StyledItem","styled","CategoryDropdownItem","forwardRef","label","color","icon","isSelected","startContent","endContent","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;AAAA,GAgCbC,IAAuBC;AAAA,EAClC,CACE;AAAA,IACE,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,SAAAC;AAAA,IACA,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,KAELC,MAGEC,gBAAAA,EAAA;AAAA,IAACf;AAAA,IAAA;AAAA,MACE,GAAGa;AAAA,MACJ,WAAWG,EAAKJ,GAAW,EAAE,UAAUL,GAAY;AAAA,MACnD,OAAO,EAAE,iBAAiBA,KAAcF,IAAQA,IAAQ,IAAI,GAAGM,EAAM;AAAA,MACrE,KAAAG;AAAA,MAEC,UAAA;AAAA,QAAAN;AAAA,QAECS,gBAAAA,EAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,MAAMZ,MAAcI,IAAU,UAAU;AAAA,YACxC,OAAO,EAAE,OAAOL,KAAS,GAAG;AAAA,UAAA;AAAA,QAC9B;AAAA,QAEDD;AAAA,QACAK;AAAA,MAAA;AAAA,IAAA;AAAA,EACH;AAGN;"}
+{"version":3,"file":"CategoryDropdownItem.es.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.tsx"],"sourcesContent":["import { getTextColor, 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  white-space: nowrap;\n\n  [icon='crop_square'] {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n    font-size: 16px;\n  }\n\n  &.selected {\n    [icon='crop_square'] {\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\nexport interface CategoryDropdownItemProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'> {\n  label: string\n  color: string | null\n  icon?: string // override icon if needed\n  startContent?: React.ReactNode\n  endContent?: React.ReactNode\n  isClear?: boolean\n  isSelected?: boolean\n}\n\nexport const CategoryDropdownItem = forwardRef<HTMLSpanElement, CategoryDropdownItemProps>(\n  (\n    {\n      label,\n      color,\n      icon,\n      isSelected,\n      startContent,\n      endContent,\n      isClear,\n      style,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <StyledItem\n        {...props}\n        className={clsx(className, { selected: isSelected })}\n        style={{ backgroundColor: isSelected && color ? color : '', color: getTextColor(isSelected && color ? color : ''), ...style }}\n        ref={ref}\n      >\n        {startContent}\n        {\n          <Icon\n            icon={icon ? icon : isClear ? 'clear' : 'crop_square'}\n            style={{ color: color || '' }}\n          />\n        }\n        {label}\n        {endContent}\n      </StyledItem>\n    )\n  },\n)\n"],"names":["StyledItem","styled","CategoryDropdownItem","forwardRef","label","color","icon","isSelected","startContent","endContent","isClear","style","className","props","ref","jsxs","clsx","getTextColor","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;AAAA,GAgCbC,IAAuBC;AAAA,EAClC,CACE;AAAA,IACE,OAAAC;AAAA,IACA,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,YAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC;AAAA,IACA,SAAAC;AAAA,IACA,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,KAELC,MAGEC,gBAAAA,EAAA;AAAA,IAACf;AAAA,IAAA;AAAA,MACE,GAAGa;AAAA,MACJ,WAAWG,EAAKJ,GAAW,EAAE,UAAUL,GAAY;AAAA,MACnD,OAAO,EAAE,iBAAiBA,KAAcF,IAAQA,IAAQ,IAAI,OAAOY,EAAaV,KAAcF,IAAQA,IAAQ,EAAE,GAAG,GAAGM,EAAM;AAAA,MAC5H,KAAAG;AAAA,MAEC,UAAA;AAAA,QAAAN;AAAA,QAECU,gBAAAA,EAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,MAAMb,MAAcI,IAAU,UAAU;AAAA,YACxC,OAAO,EAAE,OAAOL,KAAS,GAAG;AAAA,UAAA;AAAA,QAC9B;AAAA,QAEDD;AAAA,QACAK;AAAA,MAAA;AAAA,IAAA;AAAA,EACH;AAGN;"}

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

@@ -1,4 +1,4 @@
-"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`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../../../../../_virtual/jsx-runtime.cjs.js"),o=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;
@@ -24,7 +24,7 @@
 
   &.compact {
     padding: 1px 2px;
-    ${u.theme.labelMedium}
+    ${o.theme.labelMedium}
   }
 
   &.editing {
@@ -47,5 +47,5 @@
       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;
+`,b=p.forwardRef(({value:r,color:e,isCompact:t,isEditing:n,isPower:s,isDisabled:a,style:i,className:c,...d},l)=>u.jsxRuntimeExports.jsx(m,{...d,ref:l,className:g(c,{none:!r,compact:t,editing:n,power:s,disabled:a}),style:{...i,...e&&{backgroundColor:e,borderColor:e,color:o.getTextColor(e)}},children:r||v}));exports.CategoryTag=b;
 //# sourceMappingURL=CategoryTag.cjs.js.map

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

@@ -1 +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"}
+{"version":3,"file":"CategoryTag.cjs.js","sources":["../../../../../../../src/containers/Feed/components/ActivityCategorySelect/CategoryTag.tsx"],"sourcesContent":["import { getTextColor, 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\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={{\n          ...style,\n          ...(color && {\n            backgroundColor: color,\n            borderColor: color,\n            color: getTextColor(color)\n          })\n        }}\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","getTextColor"],"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,IAIEC,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,CACL,GAAGC,EACH,GAAIL,GAAS,CACX,gBAAiBA,EACjB,YAAaA,EACb,MAAOW,eAAaX,CAAK,CAAA,CAE7B,EAEC,SAASD,GAAAN,CAAA,CACZ,CAGN"}

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

@@ -1,9 +1,9 @@
 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`
+import { theme as p, getTextColor as m } from "@ynput/ayon-react-components";
+import g from "clsx";
+import { forwardRef as y } from "react";
+import v from "styled-components";
+const f = "Category", u = v.div`
   display: flex;
   padding: 2px 4px;
   justify-content: center;
@@ -52,25 +52,32 @@ const v = "Category", f = y.div`
       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,
+`, k = y(
+  ({ value: r, color: o, isCompact: e, isEditing: t, isPower: n, isDisabled: i, style: s, className: a, ...c }, d) => /* @__PURE__ */ l.jsx(
+    u,
     {
       ...c,
       ref: d,
-      className: m(a, {
-        none: !o,
+      className: g(a, {
+        none: !r,
         compact: e,
         editing: t,
         power: n,
         disabled: i
       }),
-      style: { ...s, backgroundColor: r, borderColor: r },
-      children: o || v
+      style: {
+        ...s,
+        ...o && {
+          backgroundColor: o,
+          borderColor: o,
+          color: m(o)
+        }
+      },
+      children: r || f
     }
   )
 );
 export {
-  j as CategoryTag
+  k as CategoryTag
 };
 //# sourceMappingURL=CategoryTag.es.js.map

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

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

@@ -11,7 +11,7 @@ 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 de, Body as pe, Tools as fe, ToolButton as P, Tip as ue } from "./ActivityComment.styled.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";
@@ -36,12 +36,13 @@ import "../../../../context/AddonContext.es.js";
 import "../../../../context/PowerpackContext.es.js";
 import "../../../../context/MoveEntityContext.es.js";
 import "../../../../context/MenuContext.es.js";
+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 xo = ({
+const ho = ({
   activity: r = {},
   onCheckChange: H,
-  onDelete: p,
+  onDelete: d,
   onUpdate: f,
   projectInfo: Ie,
   editProps: q,
@@ -56,8 +57,8 @@ const xo = ({
 }) => {
   var S;
   const { userName: u, createReaction: O, deleteReaction: Q, editingId: V, setEditingId: y, categories: v, isGuest: g } = ve(), o = N(() => v.find((e) => {
-    var d;
-    return e.name === ((d = r.activityData) == null ? void 0 : d.category);
+    var p;
+    return e.name === ((p = r.activityData) == null ? void 0 : p.category);
   }) || null, [(S = r == null ? void 0 : r.activityData) == null ? void 0 : S.category, v]), s = we(o == null ? void 0 : o.color);
   let {
     body: x,
@@ -77,11 +78,11 @@ const xo = ({
     y(i);
   }, J = () => {
     y(null);
-  }, K = async (e, d, U) => {
-    await (f == null ? void 0 : f(e, d, void 0, U)), 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 }), p && await p(i, k, e);
+    w && j && e.push({ id: j.id, type: j.type }), d && await d(i, k, e);
   }, Y = () => {
     ke({
       title: "Delete comment",
@@ -116,7 +117,7 @@ const xo = ({
     [l]
   );
   return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs(
-    de,
+    pe,
     {
       className: F("comment", {
         isOwner: b,
@@ -144,9 +145,9 @@ const xo = ({
             children: void 0
           }
         ),
-        /* @__PURE__ */ t.jsxs(pe, { className: F("comment-body", { isEditing: a }), children: [
+        /* @__PURE__ */ t.jsxs(de, { className: F("comment-body", { isEditing: a }), children: [
           !R && b ? /* @__PURE__ */ t.jsxs(fe, { className: "tools", children: [
-            p && /* @__PURE__ */ t.jsx(
+            d && /* @__PURE__ */ t.jsx(
               P,
               {
                 icon: "delete",
@@ -254,6 +255,6 @@ const xo = ({
   ) });
 };
 export {
-  xo as default
+  ho as default
 };
 //# sourceMappingURL=ActivityComment.es.js.map