@ynput/ayon-frontend-shared 0.4.2 → 0.4.4

package/dist/shared/src/containers/ProjectTreeTable/widgets/DateWidget.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/DateWidget.tsx"],"sourcesContent":["import { format, subMilliseconds } from 'date-fns'\nimport { forwardRef } from 'react'\nimport { DateWidgetInput } from './DateWidgetInput'\nimport { WidgetBaseProps } from './CellWidget'\nimport { formatUTCDate } from '../../../util/formatUTCDate'\n\nexport interface DateWidgetProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'onChange'>,\n    WidgetBaseProps {\n  value?: string\n  isReadOnly?: boolean\n  isInherited?: boolean\n  showTime?: boolean\n  isMidnightExclusive?: boolean\n}\n\nexport const DateWidget = forwardRef<HTMLSpanElement, DateWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      isReadOnly,\n      isInherited,\n      onChange,\n      onCancelEdit,\n      showTime = false,\n      isMidnightExclusive = false,\n      ...props\n    },\n    ref,\n  ) => {\n    let dateString = ''\n    if (value) {\n      try {\n        const formatString = showTime ? 'dd-MM-yyyy HH:mm:ss' : 'dd-MM-yyyy'\n        const date = isMidnightExclusive ? subMilliseconds(new Date(value), 1) : new Date(value)\n        dateString = showTime ? format(date, formatString) : formatUTCDate(date, formatString)\n      } catch (error) {\n        console.error('Invalid date value:', value)\n        dateString = 'Invalid Date'\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <DateWidgetInput\n          value={value}\n          onChange={onChange}\n          onCancel={onCancelEdit}\n          readOnly={isReadOnly}\n          disabled={isReadOnly}\n          isMidnightExclusive={isMidnightExclusive}\n          {...(props as any)}\n        />\n      )\n    }\n\n    return (\n      <span {...props} ref={ref} style={{ whiteSpace: 'nowrap' }}>\n        {dateString}\n      </span>\n    )\n  },\n)\n"],"names":["DateWidget","forwardRef","value","isEditing","isReadOnly","isInherited","onChange","onCancelEdit","showTime","isMidnightExclusive","props","ref","dateString","formatString","date","subMilliseconds","format","formatUTCDate","jsx","DateWidgetInput"],"mappings":"6QAgBaA,EAAaC,EAAAA,WACxB,CACE,CACE,MAAAC,EACA,UAAAC,EACA,WAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,SAAAC,EAAW,GACX,oBAAAC,EAAsB,GACtB,GAAGC,CAAA,EAELC,IACG,CACH,IAAIC,EAAa,GACjB,GAAIV,EACF,GAAI,CACF,MAAMW,EAAeL,EAAW,sBAAwB,aAClDM,EAAOL,EAAsBM,EAAAA,gBAAgB,IAAI,KAAKb,CAAK,EAAG,CAAC,EAAI,IAAI,KAAKA,CAAK,EACvFU,EAAaJ,EAAWQ,EAAAA,OAAOF,EAAMD,CAAY,EAAII,EAAAA,cAAcH,EAAMD,CAAY,CACvF,MAAgB,CACd,QAAQ,MAAM,sBAAuBX,CAAK,EAC1CU,EAAa,cACf,CAGF,OAAIT,EAEAe,EAAAA,kBAAAA,IAACC,EAAAA,gBAAA,CACC,MAAAjB,EACA,SAAAI,EACA,SAAUC,EACV,SAAUH,EACV,SAAUA,EACV,oBAAAK,EACC,GAAIC,CAAA,CAAA,EAMTQ,wBAAC,OAAA,CAAM,GAAGR,EAAO,IAAAC,EAAU,MAAO,CAAE,WAAY,QAAA,EAC7C,SAAAC,CAAA,CACH,CAEJ,CACF"}
+{"version":3,"file":"DateWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/DateWidget.tsx"],"sourcesContent":["import { format, subMilliseconds } from 'date-fns'\nimport { forwardRef, Fragment } from 'react'\nimport styled from 'styled-components'\nimport { DateWidgetInput } from './DateWidgetInput'\nimport { WidgetBaseProps } from './CellWidget'\nimport { formatUTCDate } from '../../../util/formatUTCDate'\nimport { wrapMode } from './wrapMode'\n\nconst StyledDateValue = styled.span`\n  white-space: nowrap;\n\n  ${wrapMode`\n    white-space: normal;\n  `}\n`\n\n// nowrap per part so the line can only break between date and time, never inside either\nconst StyledDatePart = styled.span`\n  white-space: nowrap;\n`\n\nexport interface DateWidgetProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'onChange'>,\n    WidgetBaseProps {\n  value?: string\n  isReadOnly?: boolean\n  isInherited?: boolean\n  showTime?: boolean\n  isMidnightExclusive?: boolean\n}\n\nexport const DateWidget = forwardRef<HTMLSpanElement, DateWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      isReadOnly,\n      isInherited,\n      onChange,\n      onCancelEdit,\n      showTime = false,\n      isMidnightExclusive = false,\n      ...props\n    },\n    ref,\n  ) => {\n    let dateString = ''\n    let isInvalid = false\n    if (value) {\n      try {\n        const formatString = showTime ? 'dd-MM-yyyy HH:mm:ss' : 'dd-MM-yyyy'\n        const date = isMidnightExclusive ? subMilliseconds(new Date(value), 1) : new Date(value)\n        dateString = showTime ? format(date, formatString) : formatUTCDate(date, formatString)\n      } catch (error) {\n        console.error('Invalid date value:', value)\n        dateString = 'Invalid Date'\n        isInvalid = true\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <DateWidgetInput\n          value={value}\n          onChange={onChange}\n          onCancel={onCancelEdit}\n          readOnly={isReadOnly}\n          disabled={isReadOnly}\n          isMidnightExclusive={isMidnightExclusive}\n          {...(props as any)}\n        />\n      )\n    }\n\n    const parts = dateString && !isInvalid ? dateString.split(' ') : []\n\n    return (\n      <StyledDateValue {...props} ref={ref}>\n        {isInvalid\n          ? dateString\n          : parts.map((part, index) => (\n              <Fragment key={index}>\n                {index > 0 && ' '}\n                <StyledDatePart>{part}</StyledDatePart>\n              </Fragment>\n            ))}\n      </StyledDateValue>\n    )\n  },\n)\n"],"names":["StyledDateValue","styled","wrapMode","StyledDatePart","DateWidget","forwardRef","value","isEditing","isReadOnly","isInherited","onChange","onCancelEdit","showTime","isMidnightExclusive","props","ref","dateString","isInvalid","formatString","date","subMilliseconds","format","formatUTCDate","jsx","DateWidgetInput","parts","part","index","Fragment"],"mappings":"2UAQMA,EAAkBC,EAAO;AAAA;AAAA;AAAA,IAG3BC,EAAAA;AAAAA;AAAAA,GAED;AAAA,EAIGC,EAAiBF,EAAO;AAAA;AAAA,EAcjBG,EAAaC,EAAAA,WACxB,CACE,CACE,MAAAC,EACA,UAAAC,EACA,WAAAC,EACA,YAAAC,EACA,SAAAC,EACA,aAAAC,EACA,SAAAC,EAAW,GACX,oBAAAC,EAAsB,GACtB,GAAGC,CAAA,EAELC,IACG,CACH,IAAIC,EAAa,GACbC,EAAY,GAChB,GAAIX,EACF,GAAI,CACF,MAAMY,EAAeN,EAAW,sBAAwB,aAClDO,EAAON,EAAsBO,EAAAA,gBAAgB,IAAI,KAAKd,CAAK,EAAG,CAAC,EAAI,IAAI,KAAKA,CAAK,EACvFU,EAAaJ,EAAWS,EAAAA,OAAOF,EAAMD,CAAY,EAAII,EAAAA,cAAcH,EAAMD,CAAY,CACvF,MAAgB,CACd,QAAQ,MAAM,sBAAuBZ,CAAK,EAC1CU,EAAa,eACbC,EAAY,EACd,CAGF,GAAIV,EACF,OACEgB,EAAAA,kBAAAA,IAACC,EAAAA,gBAAA,CACC,MAAAlB,EACA,SAAAI,EACA,SAAUC,EACV,SAAUH,EACV,SAAUA,EACV,oBAAAK,EACC,GAAIC,CAAA,CAAA,EAKX,MAAMW,EAAQT,GAAc,CAACC,EAAYD,EAAW,MAAM,GAAG,EAAI,CAAA,EAEjE,OACEO,EAAAA,kBAAAA,IAACvB,EAAA,CAAiB,GAAGc,EAAO,IAAAC,EACzB,SAAAE,EACGD,EACAS,EAAM,IAAI,CAACC,EAAMC,6BACdC,EAAAA,SAAA,CACE,SAAA,CAAAD,EAAQ,GAAK,IACdJ,EAAAA,kBAAAA,IAACpB,GAAgB,SAAAuB,CAAA,CAAK,CAAA,GAFTC,CAGf,CACD,EACP,CAEJ,CACF"}

package/dist/shared/src/containers/ProjectTreeTable/widgets/DateWidget.es.js

@@ -1,43 +1,59 @@
-import { j as m } from "../../../../../_virtual/jsx-runtime.es.js";
-import { subMilliseconds as p, format as l } from "date-fns";
-import { forwardRef as D } from "react";
-import { DateWidgetInput as j } from "./DateWidgetInput.es.js";
-import { formatUTCDate as w } from "../../../util/formatUTCDate.es.js";
-const h = D(
+import { j as o } from "../../../../../_virtual/jsx-runtime.es.js";
+import { subMilliseconds as D, format as h } from "date-fns";
+import { forwardRef as j, Fragment as x } from "react";
+import p from "styled-components";
+import { DateWidgetInput as I } from "./DateWidgetInput.es.js";
+import { formatUTCDate as M } from "../../../util/formatUTCDate.es.js";
+import { wrapMode as g } from "./wrapMode.es.js";
+const S = p.span`
+  white-space: nowrap;
+
+  ${g`
+    white-space: normal;
+  `}
+`, u = p.span`
+  white-space: nowrap;
+`, V = j(
   ({
     value: t,
-    isEditing: s,
-    isReadOnly: o,
-    isInherited: x,
+    isEditing: l,
+    isReadOnly: s,
+    isInherited: b,
     onChange: f,
-    onCancelEdit: y,
-    showTime: a = !1,
-    isMidnightExclusive: n = !1,
-    ...d
-  }, c) => {
-    let r = "";
+    onCancelEdit: c,
+    showTime: i = !1,
+    isMidnightExclusive: d = !1,
+    ...m
+  }, y) => {
+    let r = "", n = !1;
     if (t)
       try {
-        const e = a ? "dd-MM-yyyy HH:mm:ss" : "dd-MM-yyyy", i = n ? p(new Date(t), 1) : new Date(t);
-        r = a ? l(i, e) : w(i, e);
+        const e = i ? "dd-MM-yyyy HH:mm:ss" : "dd-MM-yyyy", a = d ? D(new Date(t), 1) : new Date(t);
+        r = i ? h(a, e) : M(a, e);
       } catch {
-        console.error("Invalid date value:", t), r = "Invalid Date";
+        console.error("Invalid date value:", t), r = "Invalid Date", n = !0;
       }
-    return s ? /* @__PURE__ */ m.jsx(
-      j,
-      {
-        value: t,
-        onChange: f,
-        onCancel: y,
-        readOnly: o,
-        disabled: o,
-        isMidnightExclusive: n,
-        ...d
-      }
-    ) : /* @__PURE__ */ m.jsx("span", { ...d, ref: c, style: { whiteSpace: "nowrap" }, children: r });
+    if (l)
+      return /* @__PURE__ */ o.jsx(
+        I,
+        {
+          value: t,
+          onChange: f,
+          onCancel: c,
+          readOnly: s,
+          disabled: s,
+          isMidnightExclusive: d,
+          ...m
+        }
+      );
+    const w = r && !n ? r.split(" ") : [];
+    return /* @__PURE__ */ o.jsx(S, { ...m, ref: y, children: n ? r : w.map((e, a) => /* @__PURE__ */ o.jsxs(x, { children: [
+      a > 0 && " ",
+      /* @__PURE__ */ o.jsx(u, { children: e })
+    ] }, a)) });
   }
 );
 export {
-  h as DateWidget
+  V as DateWidget
 };
 //# sourceMappingURL=DateWidget.es.js.map

package/dist/shared/src/containers/ProjectTreeTable/widgets/DateWidget.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateWidget.es.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/DateWidget.tsx"],"sourcesContent":["import { format, subMilliseconds } from 'date-fns'\nimport { forwardRef } from 'react'\nimport { DateWidgetInput } from './DateWidgetInput'\nimport { WidgetBaseProps } from './CellWidget'\nimport { formatUTCDate } from '../../../util/formatUTCDate'\n\nexport interface DateWidgetProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'onChange'>,\n    WidgetBaseProps {\n  value?: string\n  isReadOnly?: boolean\n  isInherited?: boolean\n  showTime?: boolean\n  isMidnightExclusive?: boolean\n}\n\nexport const DateWidget = forwardRef<HTMLSpanElement, DateWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      isReadOnly,\n      isInherited,\n      onChange,\n      onCancelEdit,\n      showTime = false,\n      isMidnightExclusive = false,\n      ...props\n    },\n    ref,\n  ) => {\n    let dateString = ''\n    if (value) {\n      try {\n        const formatString = showTime ? 'dd-MM-yyyy HH:mm:ss' : 'dd-MM-yyyy'\n        const date = isMidnightExclusive ? subMilliseconds(new Date(value), 1) : new Date(value)\n        dateString = showTime ? format(date, formatString) : formatUTCDate(date, formatString)\n      } catch (error) {\n        console.error('Invalid date value:', value)\n        dateString = 'Invalid Date'\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <DateWidgetInput\n          value={value}\n          onChange={onChange}\n          onCancel={onCancelEdit}\n          readOnly={isReadOnly}\n          disabled={isReadOnly}\n          isMidnightExclusive={isMidnightExclusive}\n          {...(props as any)}\n        />\n      )\n    }\n\n    return (\n      <span {...props} ref={ref} style={{ whiteSpace: 'nowrap' }}>\n        {dateString}\n      </span>\n    )\n  },\n)\n"],"names":["DateWidget","forwardRef","value","isEditing","isReadOnly","isInherited","onChange","onCancelEdit","showTime","isMidnightExclusive","props","ref","dateString","formatString","date","subMilliseconds","format","formatUTCDate","jsx","DateWidgetInput"],"mappings":";;;;;AAgBO,MAAMA,IAAaC;AAAA,EACxB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,YAAAC;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,qBAAAC,IAAsB;AAAA,IACtB,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,QAAIC,IAAa;AACjB,QAAIV;AACF,UAAI;AACF,cAAMW,IAAeL,IAAW,wBAAwB,cAClDM,IAAOL,IAAsBM,EAAgB,IAAI,KAAKb,CAAK,GAAG,CAAC,IAAI,IAAI,KAAKA,CAAK;AACvF,QAAAU,IAAaJ,IAAWQ,EAAOF,GAAMD,CAAY,IAAII,EAAcH,GAAMD,CAAY;AAAA,MACvF,QAAgB;AACd,gBAAQ,MAAM,uBAAuBX,CAAK,GAC1CU,IAAa;AAAA,MACf;AAGF,WAAIT,IAEAe,gBAAAA,EAAAA;AAAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAAjB;AAAA,QACA,UAAAI;AAAA,QACA,UAAUC;AAAA,QACV,UAAUH;AAAA,QACV,UAAUA;AAAA,QACV,qBAAAK;AAAA,QACC,GAAIC;AAAA,MAAA;AAAA,IAAA,IAMTQ,gBAAAA,MAAC,QAAA,EAAM,GAAGR,GAAO,KAAAC,GAAU,OAAO,EAAE,YAAY,SAAA,GAC7C,UAAAC,EAAA,CACH;AAAA,EAEJ;AACF;"}
+{"version":3,"file":"DateWidget.es.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/DateWidget.tsx"],"sourcesContent":["import { format, subMilliseconds } from 'date-fns'\nimport { forwardRef, Fragment } from 'react'\nimport styled from 'styled-components'\nimport { DateWidgetInput } from './DateWidgetInput'\nimport { WidgetBaseProps } from './CellWidget'\nimport { formatUTCDate } from '../../../util/formatUTCDate'\nimport { wrapMode } from './wrapMode'\n\nconst StyledDateValue = styled.span`\n  white-space: nowrap;\n\n  ${wrapMode`\n    white-space: normal;\n  `}\n`\n\n// nowrap per part so the line can only break between date and time, never inside either\nconst StyledDatePart = styled.span`\n  white-space: nowrap;\n`\n\nexport interface DateWidgetProps\n  extends Omit<React.HTMLAttributes<HTMLSpanElement>, 'onChange'>,\n    WidgetBaseProps {\n  value?: string\n  isReadOnly?: boolean\n  isInherited?: boolean\n  showTime?: boolean\n  isMidnightExclusive?: boolean\n}\n\nexport const DateWidget = forwardRef<HTMLSpanElement, DateWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      isReadOnly,\n      isInherited,\n      onChange,\n      onCancelEdit,\n      showTime = false,\n      isMidnightExclusive = false,\n      ...props\n    },\n    ref,\n  ) => {\n    let dateString = ''\n    let isInvalid = false\n    if (value) {\n      try {\n        const formatString = showTime ? 'dd-MM-yyyy HH:mm:ss' : 'dd-MM-yyyy'\n        const date = isMidnightExclusive ? subMilliseconds(new Date(value), 1) : new Date(value)\n        dateString = showTime ? format(date, formatString) : formatUTCDate(date, formatString)\n      } catch (error) {\n        console.error('Invalid date value:', value)\n        dateString = 'Invalid Date'\n        isInvalid = true\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <DateWidgetInput\n          value={value}\n          onChange={onChange}\n          onCancel={onCancelEdit}\n          readOnly={isReadOnly}\n          disabled={isReadOnly}\n          isMidnightExclusive={isMidnightExclusive}\n          {...(props as any)}\n        />\n      )\n    }\n\n    const parts = dateString && !isInvalid ? dateString.split(' ') : []\n\n    return (\n      <StyledDateValue {...props} ref={ref}>\n        {isInvalid\n          ? dateString\n          : parts.map((part, index) => (\n              <Fragment key={index}>\n                {index > 0 && ' '}\n                <StyledDatePart>{part}</StyledDatePart>\n              </Fragment>\n            ))}\n      </StyledDateValue>\n    )\n  },\n)\n"],"names":["StyledDateValue","styled","wrapMode","StyledDatePart","DateWidget","forwardRef","value","isEditing","isReadOnly","isInherited","onChange","onCancelEdit","showTime","isMidnightExclusive","props","ref","dateString","isInvalid","formatString","date","subMilliseconds","format","formatUTCDate","jsx","DateWidgetInput","parts","part","index","Fragment"],"mappings":";;;;;;;AAQA,MAAMA,IAAkBC,EAAO;AAAA;AAAA;AAAA,IAG3BC;AAAA;AAAA,GAED;AAAA,GAIGC,IAAiBF,EAAO;AAAA;AAAA,GAcjBG,IAAaC;AAAA,EACxB,CACE;AAAA,IACE,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,YAAAC;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,qBAAAC,IAAsB;AAAA,IACtB,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,QAAIC,IAAa,IACbC,IAAY;AAChB,QAAIX;AACF,UAAI;AACF,cAAMY,IAAeN,IAAW,wBAAwB,cAClDO,IAAON,IAAsBO,EAAgB,IAAI,KAAKd,CAAK,GAAG,CAAC,IAAI,IAAI,KAAKA,CAAK;AACvF,QAAAU,IAAaJ,IAAWS,EAAOF,GAAMD,CAAY,IAAII,EAAcH,GAAMD,CAAY;AAAA,MACvF,QAAgB;AACd,gBAAQ,MAAM,uBAAuBZ,CAAK,GAC1CU,IAAa,gBACbC,IAAY;AAAA,MACd;AAGF,QAAIV;AACF,aACEgB,gBAAAA,EAAAA;AAAAA,QAACC;AAAA,QAAA;AAAA,UACC,OAAAlB;AAAA,UACA,UAAAI;AAAA,UACA,UAAUC;AAAA,UACV,UAAUH;AAAA,UACV,UAAUA;AAAA,UACV,qBAAAK;AAAA,UACC,GAAIC;AAAA,QAAA;AAAA,MAAA;AAKX,UAAMW,IAAQT,KAAc,CAACC,IAAYD,EAAW,MAAM,GAAG,IAAI,CAAA;AAEjE,WACEO,gBAAAA,EAAAA,IAACvB,GAAA,EAAiB,GAAGc,GAAO,KAAAC,GACzB,UAAAE,IACGD,IACAS,EAAM,IAAI,CAACC,GAAMC,6BACdC,GAAA,EACE,UAAA;AAAA,MAAAD,IAAQ,KAAK;AAAA,MACdJ,gBAAAA,EAAAA,IAACpB,KAAgB,UAAAuB,EAAA,CAAK;AAAA,IAAA,KAFTC,CAGf,CACD,GACP;AAAA,EAEJ;AACF;"}

package/dist/shared/src/containers/ProjectTreeTable/widgets/EntityNameWidget.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../../_virtual/jsx-runtime.cjs.js"),o=require("@ynput/ayon-react-components"),t=require("styled-components"),b=require("clsx"),E=require("../utils/restrictedEntity.cjs.js"),a=require("../types/columnConfig.cjs.js"),R=require("../../../components/EntityIcon/EntityIcon.cjs.js"),C=t(o.Button)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../../_virtual/jsx-runtime.cjs.js"),s=require("@ynput/ayon-react-components"),o=require("styled-components"),w=require("../utils/restrictedEntity.cjs.js"),l=require("../types/columnConfig.cjs.js"),f=require("../../../components/EntityIcon/EntityIcon.cjs.js"),j=require("../constants.cjs.js"),E=o(s.Button)`
   &.expander {
     background-color: unset;
     padding: 2px;
@@ -8,7 +8,7 @@
     }
   }
   cursor: pointer;
-`,S=t.div`
+`,R=o.div`
   position: relative;
   display: flex;
   align-items: center;
@@ -16,15 +16,21 @@
   height: 100%;
   width: 100%;
   padding-right: 8px;
-`,q=t.div`
+`,k=o.div`
   width: 100%;
   height: 32px;
   overflow: hidden;
   position: relative;
-`,N=t.div`
+
+  &.stacked {
+    height: 100%;
+  }
+`,N=o.div`
   position: absolute;
   inset: 0;
-`,k=t.div`
+  display: flex;
+  align-items: center;
+`,T=o.div`
   display: flex;
   align-items: center;
   gap: var(--base-gap-large);
@@ -36,6 +42,11 @@
   max-width: 100%;
   height: 100%;
 
+  &.stacked {
+    height: auto;
+    max-height: 100%;
+  }
+
   /* &:hover {
     &,
     .icon,
@@ -43,7 +54,7 @@
       color: var(--md-sys-color-primary);
     }
   } */
-`,M=t.div`
+`,C=o.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -57,7 +68,7 @@
   }
 
   .path {
-    ${o.theme.bodyMedium}
+    ${s.theme.bodyMedium}
     font-size: 14px;
     margin-bottom: -4px;
     color: var(--md-sys-color-outline);
@@ -73,7 +84,7 @@
   }
 
   .label {
-    ${o.theme.bodyMedium}
+    ${s.theme.bodyMedium}
     font-size: 14px;
     overflow: hidden;
     white-space: nowrap;
@@ -82,11 +93,19 @@
     min-width: 0;
   }
 
+  &.stacked .label {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    white-space: normal;
+    word-break: break-word;
+  }
+
   .divider {
-    ${o.theme.bodyMedium}
+    ${s.theme.bodyMedium}
     font-size: 14px;
     color: var(--md-sys-color-outline);
     flex-shrink: 0;
   }
-`,P=({id:l,label:c,name:d,path:s,isExpandable:p,entityType:n,subType:x,isExpanded:h,toggleExpandAll:m,toggleExpanded:u,rowHeight:g=40,columnDisplayConfig:r})=>{const v=E.isEntityRestricted(n),i=g<50,y=a.getDisplayValue(r,"path","compact")??!0,f=a.getDisplayValue(r,"path","full")??!0,w=i?y:f;return e.jsxRuntimeExports.jsxs(S,{children:[p?e.jsxRuntimeExports.jsx(C,{onClick:j=>{j.altKey?m(l):u()},className:"expander",icon:h?"expand_more":"chevron_right"}):null,e.jsxRuntimeExports.jsx(q,{children:e.jsxRuntimeExports.jsx(N,{children:e.jsxRuntimeExports.jsxs(k,{children:[e.jsxRuntimeExports.jsx(R.EntityIcon,{entity:{entityType:n,subType:x||void 0}}),e.jsxRuntimeExports.jsxs(M,{className:b({compact:i}),children:[w&&!v&&e.jsxRuntimeExports.jsxs("span",{className:"path",children:[s,i&&s?"/":""]}),e.jsxRuntimeExports.jsx("span",{className:"label",children:c||d})]})]})})})]})};exports.EntityNameWidget=P;
+`,S=({id:c,entity:t,path:r,isExpandable:d,isExpanded:p,toggleExpandAll:x,toggleExpanded:m,rowHeight:h=40,columnDisplayConfig:a})=>{const u=w.isEntityRestricted(t.entityType),n=h<j.WRAP_MIN_ROW_HEIGHT,i=n?"compact":"stacked",y=l.getDisplayValue(a,"path","compact")??!0,g=l.getDisplayValue(a,"path","full")??!0,v=n?y:g;return e.jsxRuntimeExports.jsxs(R,{className:i,children:[d?e.jsxRuntimeExports.jsx(E,{onClick:b=>{b.altKey?x(c):m()},className:"expander",icon:p?"expand_more":"chevron_right"}):null,e.jsxRuntimeExports.jsx(k,{className:i,children:e.jsxRuntimeExports.jsx(N,{children:e.jsxRuntimeExports.jsxs(T,{className:i,children:[e.jsxRuntimeExports.jsx(f.EntityIcon,{entity:{entityType:t.entityType,subType:"subType"in t?t.subType:void 0},icon:t.icon||void 0,color:t.color||void 0}),e.jsxRuntimeExports.jsxs(C,{className:i,children:[v&&!u&&e.jsxRuntimeExports.jsxs("span",{className:"path",children:[r,n&&r?"/":""]}),e.jsxRuntimeExports.jsx("span",{className:"label",children:t.label||t.name})]})]})})})]})};exports.EntityNameWidget=S;
 //# sourceMappingURL=EntityNameWidget.cjs.js.map

package/dist/shared/src/containers/ProjectTreeTable/widgets/EntityNameWidget.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityNameWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EntityNameWidget.tsx"],"sourcesContent":["import { Button, theme } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\nimport clsx from 'clsx'\nimport { isEntityRestricted } from '../utils/restrictedEntity'\nimport { getDisplayValue, type DisplayConfig, getColumnDisplayConfig } from '../types/columnConfig'\nimport { EntityIcon } from '@shared/components/EntityIcon/EntityIcon'\n\nconst Expander = styled(Button)`\n  &.expander {\n    background-color: unset;\n    padding: 2px;\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-high-hover);\n    }\n  }\n  cursor: pointer;\n`\n\nconst StyledEntityNameWidget = styled.div`\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  height: 100%;\n  width: 100%;\n  padding-right: 8px;\n`\n\nconst StyledContentWrapper = styled.div`\n  width: 100%;\n  height: 32px;\n  overflow: hidden;\n  position: relative;\n`\n\nconst StyledContentAbsolute = styled.div`\n  position: absolute;\n  inset: 0;\n`\n\nconst StyledContent = styled.div`\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-large);\n  padding: 2px 4px;\n  border-radius: var(--border-radius-m);\n  cursor: pointer;\n  overflow: hidden;\n  width: fit-content;\n  max-width: 100%;\n  height: 100%;\n\n  /* &:hover {\n    &,\n    .icon,\n    .path {\n      color: var(--md-sys-color-primary);\n    }\n  } */\n`\n\nconst StyledTextContent = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  overflow: hidden;\n  flex: 1;\n  min-width: 0;\n\n  &.compact {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .path {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    margin-bottom: -4px;\n    color: var(--md-sys-color-outline);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  &.compact .path {\n    margin-bottom: 0;\n    text-overflow: unset;\n    flex-shrink: 0 1 auto;\n  }\n\n  .label {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n\n  .divider {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    color: var(--md-sys-color-outline);\n    flex-shrink: 0;\n  }\n`\n\ntype EntityNameWidgetProps = {\n  id: string\n  label: string\n  name: string\n  path?: string | null\n  isExpandable?: boolean\n  entityType: string\n  subType?: string | null\n  isExpanded: boolean\n  toggleExpandAll: (id: string) => void\n  toggleExpanded: () => void\n  rowHeight?: number\n  columnDisplayConfig?: DisplayConfig\n}\n\nexport const EntityNameWidget = ({\n  id,\n  label,\n  name,\n  path,\n  isExpandable,\n  entityType,\n  subType,\n  isExpanded,\n  toggleExpandAll,\n  toggleExpanded,\n  rowHeight = 40,\n  columnDisplayConfig,\n}: EntityNameWidgetProps) => {\n  // Check if this is a restricted access entity\n  const isRestricted = isEntityRestricted(entityType)\n\n  // Determine layout based on row height\n  // < 50px = single line (compact), >= 50px = stacked\n  const isCompact = rowHeight < 50\n\n  // Determine if path should be shown based on display configuration\n  // Check layout-specific setting first, then general setting\n  const showPathCompact = getDisplayValue(columnDisplayConfig, 'path', 'compact') ?? true\n  const showPathFull = getDisplayValue(columnDisplayConfig, 'path', 'full') ?? true\n  const shouldShowPath = isCompact ? showPathCompact : showPathFull\n\n  return (\n    <StyledEntityNameWidget>\n      {isExpandable ? (\n        <Expander\n          onClick={(e) => {\n            if (e.altKey) {\n              // expand/collapse all children\n              toggleExpandAll(id)\n            } else {\n              // use built-in toggleExpanded function\n              toggleExpanded()\n            }\n          }}\n          className=\"expander\"\n          icon={isExpanded ? 'expand_more' : 'chevron_right'}\n        />\n      ) : null}\n      <StyledContentWrapper>\n        <StyledContentAbsolute>\n          <StyledContent>\n            <EntityIcon entity={{ entityType, subType: subType || undefined }} />\n            <StyledTextContent className={clsx({ compact: isCompact })}>\n              {shouldShowPath && !isRestricted && (\n                <span className=\"path\">\n                  {path}\n                  {isCompact && path ? '/' : ''}\n                </span>\n              )}\n              <span className=\"label\">{label || name}</span>\n            </StyledTextContent>\n          </StyledContent>\n        </StyledContentAbsolute>\n      </StyledContentWrapper>\n    </StyledEntityNameWidget>\n  )\n}\n"],"names":["Expander","styled","Button","StyledEntityNameWidget","StyledContentWrapper","StyledContentAbsolute","StyledContent","StyledTextContent","theme","EntityNameWidget","id","label","name","path","isExpandable","entityType","subType","isExpanded","toggleExpandAll","toggleExpanded","rowHeight","columnDisplayConfig","isRestricted","isEntityRestricted","isCompact","showPathCompact","getDisplayValue","showPathFull","shouldShowPath","jsx","e","EntityIcon","jsxs","clsx"],"mappings":"+XAOMA,EAAWC,EAAOC,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYxBC,EAAyBF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUhCG,EAAuBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAO9BI,EAAwBJ,EAAO;AAAA;AAAA;AAAA,EAK/BK,EAAgBL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqBvBM,EAAoBN,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAc3BO,EAAAA,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAgBhBA,EAAAA,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAUhBA,EAAAA,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAsBTC,EAAmB,CAAC,CAC/B,GAAAC,EACA,MAAAC,EACA,KAAAC,EACA,KAAAC,EACA,aAAAC,EACA,WAAAC,EACA,QAAAC,EACA,WAAAC,EACA,gBAAAC,EACA,eAAAC,EACA,UAAAC,EAAY,GACZ,oBAAAC,CACF,IAA6B,CAE3B,MAAMC,EAAeC,EAAAA,mBAAmBR,CAAU,EAI5CS,EAAYJ,EAAY,GAIxBK,EAAkBC,EAAAA,gBAAgBL,EAAqB,OAAQ,SAAS,GAAK,GAC7EM,EAAeD,EAAAA,gBAAgBL,EAAqB,OAAQ,MAAM,GAAK,GACvEO,EAAiBJ,EAAYC,EAAkBE,EAErD,gCACGxB,EAAA,CACE,SAAA,CAAAW,EACCe,EAAAA,kBAAAA,IAAC7B,EAAA,CACC,QAAU8B,GAAM,CACVA,EAAE,OAEJZ,EAAgBR,CAAE,EAGlBS,EAAA,CAEJ,EACA,UAAU,WACV,KAAMF,EAAa,cAAgB,eAAA,CAAA,EAEnC,KACJY,EAAAA,kBAAAA,IAACzB,EAAA,CACC,SAAAyB,wBAACxB,EAAA,CACC,kCAACC,EAAA,CACC,SAAA,CAAAuB,wBAACE,EAAAA,YAAW,OAAQ,CAAE,WAAAhB,EAAY,QAASC,GAAW,QAAa,EACnEgB,yBAACzB,GAAkB,UAAW0B,EAAK,CAAE,QAAST,EAAW,EACtD,SAAA,CAAAI,GAAkB,CAACN,GAClBU,EAAAA,kBAAAA,KAAC,OAAA,CAAK,UAAU,OACb,SAAA,CAAAnB,EACAW,GAAaX,EAAO,IAAM,EAAA,EAC7B,EAEFgB,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,QAAS,YAASjB,CAAA,CAAK,CAAA,CAAA,CACzC,CAAA,CAAA,CACF,EACF,CAAA,CACF,CAAA,EACF,CAEJ"}
+{"version":3,"file":"EntityNameWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EntityNameWidget.tsx"],"sourcesContent":["import { Button, theme } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\nimport { isEntityRestricted } from '../utils/restrictedEntity'\nimport { getDisplayValue, type DisplayConfig, getColumnDisplayConfig } from '../types/columnConfig'\nimport { EntityIcon } from '@shared/components/EntityIcon/EntityIcon'\nimport type { EntityData } from '../types/table'\nimport { WRAP_MIN_ROW_HEIGHT } from '../constants'\n\nconst Expander = styled(Button)`\n  &.expander {\n    background-color: unset;\n    padding: 2px;\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-high-hover);\n    }\n  }\n  cursor: pointer;\n`\n\nconst StyledEntityNameWidget = styled.div`\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  height: 100%;\n  width: 100%;\n  padding-right: 8px;\n`\n\nconst StyledContentWrapper = styled.div`\n  width: 100%;\n  height: 32px;\n  overflow: hidden;\n  position: relative;\n\n  &.stacked {\n    height: 100%;\n  }\n`\n\nconst StyledContentAbsolute = styled.div`\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n`\n\nconst StyledContent = styled.div`\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-large);\n  padding: 2px 4px;\n  border-radius: var(--border-radius-m);\n  cursor: pointer;\n  overflow: hidden;\n  width: fit-content;\n  max-width: 100%;\n  height: 100%;\n\n  &.stacked {\n    height: auto;\n    max-height: 100%;\n  }\n\n  /* &:hover {\n    &,\n    .icon,\n    .path {\n      color: var(--md-sys-color-primary);\n    }\n  } */\n`\n\nconst StyledTextContent = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  overflow: hidden;\n  flex: 1;\n  min-width: 0;\n\n  &.compact {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .path {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    margin-bottom: -4px;\n    color: var(--md-sys-color-outline);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  &.compact .path {\n    margin-bottom: 0;\n    text-overflow: unset;\n    flex-shrink: 0 1 auto;\n  }\n\n  .label {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n\n  &.stacked .label {\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 2;\n    white-space: normal;\n    word-break: break-word;\n  }\n\n  .divider {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    color: var(--md-sys-color-outline);\n    flex-shrink: 0;\n  }\n`\n\ntype EntityNameWidgetProps = {\n  id: string\n  entity: EntityData\n  path?: string | null\n  isExpandable?: boolean\n  isExpanded: boolean\n  toggleExpandAll: (id: string) => void\n  toggleExpanded: () => void\n  rowHeight?: number\n  columnDisplayConfig?: DisplayConfig\n}\n\nexport const EntityNameWidget = ({\n  id,\n  entity,\n  path,\n  isExpandable,\n  isExpanded,\n  toggleExpandAll,\n  toggleExpanded,\n  rowHeight = 40,\n  columnDisplayConfig,\n}: EntityNameWidgetProps) => {\n  // Check if this is a restricted access entity\n  const isRestricted = isEntityRestricted(entity.entityType)\n\n  // Determine layout based on row height\n  // below the wrap threshold = single line (compact), above = stacked\n  const isCompact = rowHeight < WRAP_MIN_ROW_HEIGHT\n  const layout = isCompact ? 'compact' : 'stacked'\n\n  // Determine if path should be shown based on display configuration\n  // Check layout-specific setting first, then general setting\n  const showPathCompact = getDisplayValue(columnDisplayConfig, 'path', 'compact') ?? true\n  const showPathFull = getDisplayValue(columnDisplayConfig, 'path', 'full') ?? true\n  const shouldShowPath = isCompact ? showPathCompact : showPathFull\n\n  return (\n    <StyledEntityNameWidget className={layout}>\n      {isExpandable ? (\n        <Expander\n          onClick={(e) => {\n            if (e.altKey) {\n              // expand/collapse all children\n              toggleExpandAll(id)\n            } else {\n              // use built-in toggleExpanded function\n              toggleExpanded()\n            }\n          }}\n          className=\"expander\"\n          icon={isExpanded ? 'expand_more' : 'chevron_right'}\n        />\n      ) : null}\n      <StyledContentWrapper className={layout}>\n        <StyledContentAbsolute>\n          <StyledContent className={layout}>\n            <EntityIcon\n              entity={{\n                entityType: entity.entityType,\n                subType: 'subType' in entity ? entity.subType : undefined,\n              }}\n              icon={entity.icon || undefined}\n              color={entity.color || undefined}\n            />\n            <StyledTextContent className={layout}>\n              {shouldShowPath && !isRestricted && (\n                <span className=\"path\">\n                  {path}\n                  {isCompact && path ? '/' : ''}\n                </span>\n              )}\n              <span className=\"label\">{entity.label || entity.name}</span>\n            </StyledTextContent>\n          </StyledContent>\n        </StyledContentAbsolute>\n      </StyledContentWrapper>\n    </StyledEntityNameWidget>\n  )\n}\n"],"names":["Expander","styled","Button","StyledEntityNameWidget","StyledContentWrapper","StyledContentAbsolute","StyledContent","StyledTextContent","theme","EntityNameWidget","id","entity","path","isExpandable","isExpanded","toggleExpandAll","toggleExpanded","rowHeight","columnDisplayConfig","isRestricted","isEntityRestricted","isCompact","WRAP_MIN_ROW_HEIGHT","layout","showPathCompact","getDisplayValue","showPathFull","shouldShowPath","jsxs","jsx","e","EntityIcon"],"mappings":"8YAQMA,EAAWC,EAAOC,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYxBC,EAAyBF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUhCG,EAAuBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAW9BI,EAAwBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAO/BK,EAAgBL,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,EA0BvBM,EAAoBN,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAc3BO,EAAAA,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAgBhBA,EAAAA,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAkBhBA,EAAAA,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAmBTC,EAAmB,CAAC,CAC/B,GAAAC,EACA,OAAAC,EACA,KAAAC,EACA,aAAAC,EACA,WAAAC,EACA,gBAAAC,EACA,eAAAC,EACA,UAAAC,EAAY,GACZ,oBAAAC,CACF,IAA6B,CAE3B,MAAMC,EAAeC,EAAAA,mBAAmBT,EAAO,UAAU,EAInDU,EAAYJ,EAAYK,EAAAA,oBACxBC,EAASF,EAAY,UAAY,UAIjCG,EAAkBC,EAAAA,gBAAgBP,EAAqB,OAAQ,SAAS,GAAK,GAC7EQ,EAAeD,EAAAA,gBAAgBP,EAAqB,OAAQ,MAAM,GAAK,GACvES,EAAiBN,EAAYG,EAAkBE,EAErD,OACEE,EAAAA,kBAAAA,KAACzB,EAAA,CAAuB,UAAWoB,EAChC,SAAA,CAAAV,EACCgB,EAAAA,kBAAAA,IAAC7B,EAAA,CACC,QAAU8B,GAAM,CACVA,EAAE,OAEJf,EAAgBL,CAAE,EAGlBM,EAAA,CAEJ,EACA,UAAU,WACV,KAAMF,EAAa,cAAgB,eAAA,CAAA,EAEnC,KACJe,EAAAA,kBAAAA,IAACzB,GAAqB,UAAWmB,EAC/B,iCAAClB,EAAA,CACC,SAAAuB,EAAAA,kBAAAA,KAACtB,EAAA,CAAc,UAAWiB,EACxB,SAAA,CAAAM,EAAAA,kBAAAA,IAACE,EAAAA,WAAA,CACC,OAAQ,CACN,WAAYpB,EAAO,WACnB,QAAS,YAAaA,EAASA,EAAO,QAAU,MAAA,EAElD,KAAMA,EAAO,MAAQ,OACrB,MAAOA,EAAO,OAAS,MAAA,CAAA,EAEzBiB,EAAAA,kBAAAA,KAACrB,EAAA,CAAkB,UAAWgB,EAC3B,SAAA,CAAAI,GAAkB,CAACR,GAClBS,EAAAA,kBAAAA,KAAC,OAAA,CAAK,UAAU,OACb,SAAA,CAAAhB,EACAS,GAAaT,EAAO,IAAM,EAAA,EAC7B,0BAED,OAAA,CAAK,UAAU,QAAS,SAAAD,EAAO,OAASA,EAAO,IAAA,CAAK,CAAA,CAAA,CACvD,CAAA,CAAA,CACF,EACF,CAAA,CACF,CAAA,EACF,CAEJ"}

package/dist/shared/src/containers/ProjectTreeTable/widgets/EntityNameWidget.es.js

@@ -1,11 +1,11 @@
 import { j as e } from "../../../../../_virtual/jsx-runtime.es.js";
-import { Button as j, theme as i } from "@ynput/ayon-react-components";
-import t from "styled-components";
-import C from "clsx";
-import { isEntityRestricted as E } from "../utils/restrictedEntity.es.js";
-import { getDisplayValue as a } from "../types/columnConfig.es.js";
-import { EntityIcon as N } from "../../../components/EntityIcon/EntityIcon.es.js";
-const S = t(j)`
+import { Button as y, theme as s } from "@ynput/ayon-react-components";
+import o from "styled-components";
+import { isEntityRestricted as b } from "../utils/restrictedEntity.es.js";
+import { getDisplayValue as n } from "../types/columnConfig.es.js";
+import { EntityIcon as k } from "../../../components/EntityIcon/EntityIcon.es.js";
+import { WRAP_MIN_ROW_HEIGHT as j } from "../constants.es.js";
+const N = o(y)`
   &.expander {
     background-color: unset;
     padding: 2px;
@@ -15,7 +15,7 @@ const S = t(j)`
     }
   }
   cursor: pointer;
-`, k = t.div`
+`, T = o.div`
   position: relative;
   display: flex;
   align-items: center;
@@ -23,15 +23,21 @@ const S = t(j)`
   height: 100%;
   width: 100%;
   padding-right: 8px;
-`, z = t.div`
+`, E = o.div`
   width: 100%;
   height: 32px;
   overflow: hidden;
   position: relative;
-`, M = t.div`
+
+  &.stacked {
+    height: 100%;
+  }
+`, C = o.div`
   position: absolute;
   inset: 0;
-`, P = t.div`
+  display: flex;
+  align-items: center;
+`, S = o.div`
   display: flex;
   align-items: center;
   gap: var(--base-gap-large);
@@ -43,6 +49,11 @@ const S = t(j)`
   max-width: 100%;
   height: 100%;
 
+  &.stacked {
+    height: auto;
+    max-height: 100%;
+  }
+
   /* &:hover {
     &,
     .icon,
@@ -50,7 +61,7 @@ const S = t(j)`
       color: var(--md-sys-color-primary);
     }
   } */
-`, R = t.div`
+`, R = o.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -64,7 +75,7 @@ const S = t(j)`
   }
 
   .path {
-    ${i.bodyMedium}
+    ${s.bodyMedium}
     font-size: 14px;
     margin-bottom: -4px;
     color: var(--md-sys-color-outline);
@@ -80,7 +91,7 @@ const S = t(j)`
   }
 
   .label {
-    ${i.bodyMedium}
+    ${s.bodyMedium}
     font-size: 14px;
     overflow: hidden;
     white-space: nowrap;
@@ -89,51 +100,66 @@ const S = t(j)`
     min-width: 0;
   }
 
+  &.stacked .label {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    white-space: normal;
+    word-break: break-word;
+  }
+
   .divider {
-    ${i.bodyMedium}
+    ${s.bodyMedium}
     font-size: 14px;
     color: var(--md-sys-color-outline);
     flex-shrink: 0;
   }
-`, K = ({
-  id: l,
-  label: d,
-  name: c,
-  path: r,
-  isExpandable: p,
-  entityType: s,
-  subType: m,
-  isExpanded: h,
-  toggleExpandAll: x,
-  toggleExpanded: f,
-  rowHeight: u = 40,
-  columnDisplayConfig: n
+`, A = ({
+  id: d,
+  entity: t,
+  path: a,
+  isExpandable: c,
+  isExpanded: p,
+  toggleExpandAll: m,
+  toggleExpanded: h,
+  rowHeight: x = 40,
+  columnDisplayConfig: l
 }) => {
-  const v = E(s), o = u < 50, g = a(n, "path", "compact") ?? !0, w = a(n, "path", "full") ?? !0, y = o ? g : w;
-  return /* @__PURE__ */ e.jsxs(k, { children: [
-    p ? /* @__PURE__ */ e.jsx(
-      S,
+  const u = b(t.entityType), r = x < j, i = r ? "compact" : "stacked", f = n(l, "path", "compact") ?? !0, v = n(l, "path", "full") ?? !0, g = r ? f : v;
+  return /* @__PURE__ */ e.jsxs(T, { className: i, children: [
+    c ? /* @__PURE__ */ e.jsx(
+      N,
       {
-        onClick: (b) => {
-          b.altKey ? x(l) : f();
+        onClick: (w) => {
+          w.altKey ? m(d) : h();
         },
         className: "expander",
-        icon: h ? "expand_more" : "chevron_right"
+        icon: p ? "expand_more" : "chevron_right"
       }
     ) : null,
-    /* @__PURE__ */ e.jsx(z, { children: /* @__PURE__ */ e.jsx(M, { children: /* @__PURE__ */ e.jsxs(P, { children: [
-      /* @__PURE__ */ e.jsx(N, { entity: { entityType: s, subType: m || void 0 } }),
-      /* @__PURE__ */ e.jsxs(R, { className: C({ compact: o }), children: [
-        y && !v && /* @__PURE__ */ e.jsxs("span", { className: "path", children: [
-          r,
-          o && r ? "/" : ""
+    /* @__PURE__ */ e.jsx(E, { className: i, children: /* @__PURE__ */ e.jsx(C, { children: /* @__PURE__ */ e.jsxs(S, { className: i, children: [
+      /* @__PURE__ */ e.jsx(
+        k,
+        {
+          entity: {
+            entityType: t.entityType,
+            subType: "subType" in t ? t.subType : void 0
+          },
+          icon: t.icon || void 0,
+          color: t.color || void 0
+        }
+      ),
+      /* @__PURE__ */ e.jsxs(R, { className: i, children: [
+        g && !u && /* @__PURE__ */ e.jsxs("span", { className: "path", children: [
+          a,
+          r && a ? "/" : ""
         ] }),
-        /* @__PURE__ */ e.jsx("span", { className: "label", children: d || c })
+        /* @__PURE__ */ e.jsx("span", { className: "label", children: t.label || t.name })
       ] })
     ] }) }) })
   ] });
 };
 export {
-  K as EntityNameWidget
+  A as EntityNameWidget
 };
 //# sourceMappingURL=EntityNameWidget.es.js.map

package/dist/shared/src/containers/ProjectTreeTable/widgets/EntityNameWidget.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityNameWidget.es.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EntityNameWidget.tsx"],"sourcesContent":["import { Button, theme } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\nimport clsx from 'clsx'\nimport { isEntityRestricted } from '../utils/restrictedEntity'\nimport { getDisplayValue, type DisplayConfig, getColumnDisplayConfig } from '../types/columnConfig'\nimport { EntityIcon } from '@shared/components/EntityIcon/EntityIcon'\n\nconst Expander = styled(Button)`\n  &.expander {\n    background-color: unset;\n    padding: 2px;\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-high-hover);\n    }\n  }\n  cursor: pointer;\n`\n\nconst StyledEntityNameWidget = styled.div`\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  height: 100%;\n  width: 100%;\n  padding-right: 8px;\n`\n\nconst StyledContentWrapper = styled.div`\n  width: 100%;\n  height: 32px;\n  overflow: hidden;\n  position: relative;\n`\n\nconst StyledContentAbsolute = styled.div`\n  position: absolute;\n  inset: 0;\n`\n\nconst StyledContent = styled.div`\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-large);\n  padding: 2px 4px;\n  border-radius: var(--border-radius-m);\n  cursor: pointer;\n  overflow: hidden;\n  width: fit-content;\n  max-width: 100%;\n  height: 100%;\n\n  /* &:hover {\n    &,\n    .icon,\n    .path {\n      color: var(--md-sys-color-primary);\n    }\n  } */\n`\n\nconst StyledTextContent = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  overflow: hidden;\n  flex: 1;\n  min-width: 0;\n\n  &.compact {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .path {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    margin-bottom: -4px;\n    color: var(--md-sys-color-outline);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  &.compact .path {\n    margin-bottom: 0;\n    text-overflow: unset;\n    flex-shrink: 0 1 auto;\n  }\n\n  .label {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n\n  .divider {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    color: var(--md-sys-color-outline);\n    flex-shrink: 0;\n  }\n`\n\ntype EntityNameWidgetProps = {\n  id: string\n  label: string\n  name: string\n  path?: string | null\n  isExpandable?: boolean\n  entityType: string\n  subType?: string | null\n  isExpanded: boolean\n  toggleExpandAll: (id: string) => void\n  toggleExpanded: () => void\n  rowHeight?: number\n  columnDisplayConfig?: DisplayConfig\n}\n\nexport const EntityNameWidget = ({\n  id,\n  label,\n  name,\n  path,\n  isExpandable,\n  entityType,\n  subType,\n  isExpanded,\n  toggleExpandAll,\n  toggleExpanded,\n  rowHeight = 40,\n  columnDisplayConfig,\n}: EntityNameWidgetProps) => {\n  // Check if this is a restricted access entity\n  const isRestricted = isEntityRestricted(entityType)\n\n  // Determine layout based on row height\n  // < 50px = single line (compact), >= 50px = stacked\n  const isCompact = rowHeight < 50\n\n  // Determine if path should be shown based on display configuration\n  // Check layout-specific setting first, then general setting\n  const showPathCompact = getDisplayValue(columnDisplayConfig, 'path', 'compact') ?? true\n  const showPathFull = getDisplayValue(columnDisplayConfig, 'path', 'full') ?? true\n  const shouldShowPath = isCompact ? showPathCompact : showPathFull\n\n  return (\n    <StyledEntityNameWidget>\n      {isExpandable ? (\n        <Expander\n          onClick={(e) => {\n            if (e.altKey) {\n              // expand/collapse all children\n              toggleExpandAll(id)\n            } else {\n              // use built-in toggleExpanded function\n              toggleExpanded()\n            }\n          }}\n          className=\"expander\"\n          icon={isExpanded ? 'expand_more' : 'chevron_right'}\n        />\n      ) : null}\n      <StyledContentWrapper>\n        <StyledContentAbsolute>\n          <StyledContent>\n            <EntityIcon entity={{ entityType, subType: subType || undefined }} />\n            <StyledTextContent className={clsx({ compact: isCompact })}>\n              {shouldShowPath && !isRestricted && (\n                <span className=\"path\">\n                  {path}\n                  {isCompact && path ? '/' : ''}\n                </span>\n              )}\n              <span className=\"label\">{label || name}</span>\n            </StyledTextContent>\n          </StyledContent>\n        </StyledContentAbsolute>\n      </StyledContentWrapper>\n    </StyledEntityNameWidget>\n  )\n}\n"],"names":["Expander","styled","Button","StyledEntityNameWidget","StyledContentWrapper","StyledContentAbsolute","StyledContent","StyledTextContent","theme","EntityNameWidget","id","label","name","path","isExpandable","entityType","subType","isExpanded","toggleExpandAll","toggleExpanded","rowHeight","columnDisplayConfig","isRestricted","isEntityRestricted","isCompact","showPathCompact","getDisplayValue","showPathFull","shouldShowPath","jsx","e","EntityIcon","jsxs","clsx"],"mappings":";;;;;;;AAOA,MAAMA,IAAWC,EAAOC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAYxBC,IAAyBF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUhCG,IAAuBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAO9BI,IAAwBJ,EAAO;AAAA;AAAA;AAAA,GAK/BK,IAAgBL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAqBvBM,IAAoBN,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAc3BO,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAgBhBA,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAUhBA,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,GAsBTC,IAAmB,CAAC;AAAA,EAC/B,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,qBAAAC;AACF,MAA6B;AAE3B,QAAMC,IAAeC,EAAmBR,CAAU,GAI5CS,IAAYJ,IAAY,IAIxBK,IAAkBC,EAAgBL,GAAqB,QAAQ,SAAS,KAAK,IAC7EM,IAAeD,EAAgBL,GAAqB,QAAQ,MAAM,KAAK,IACvEO,IAAiBJ,IAAYC,IAAkBE;AAErD,gCACGxB,GAAA,EACE,UAAA;AAAA,IAAAW,IACCe,gBAAAA,EAAAA;AAAAA,MAAC7B;AAAA,MAAA;AAAA,QACC,SAAS,CAAC8B,MAAM;AACd,UAAIA,EAAE,SAEJZ,EAAgBR,CAAE,IAGlBS,EAAA;AAAA,QAEJ;AAAA,QACA,WAAU;AAAA,QACV,MAAMF,IAAa,gBAAgB;AAAA,MAAA;AAAA,IAAA,IAEnC;AAAA,IACJY,gBAAAA,EAAAA,IAACzB,GAAA,EACC,UAAAyB,gBAAAA,MAACxB,GAAA,EACC,iCAACC,GAAA,EACC,UAAA;AAAA,MAAAuB,gBAAAA,MAACE,KAAW,QAAQ,EAAE,YAAAhB,GAAY,SAASC,KAAW,UAAa;AAAA,MACnEgB,gBAAAA,OAACzB,KAAkB,WAAW0B,EAAK,EAAE,SAAST,GAAW,GACtD,UAAA;AAAA,QAAAI,KAAkB,CAACN,KAClBU,gBAAAA,EAAAA,KAAC,QAAA,EAAK,WAAU,QACb,UAAA;AAAA,UAAAnB;AAAA,UACAW,KAAaX,IAAO,MAAM;AAAA,QAAA,GAC7B;AAAA,QAEFgB,gBAAAA,EAAAA,IAAC,QAAA,EAAK,WAAU,SAAS,eAASjB,EAAA,CAAK;AAAA,MAAA,EAAA,CACzC;AAAA,IAAA,EAAA,CACF,GACF,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"EntityNameWidget.es.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EntityNameWidget.tsx"],"sourcesContent":["import { Button, theme } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\nimport { isEntityRestricted } from '../utils/restrictedEntity'\nimport { getDisplayValue, type DisplayConfig, getColumnDisplayConfig } from '../types/columnConfig'\nimport { EntityIcon } from '@shared/components/EntityIcon/EntityIcon'\nimport type { EntityData } from '../types/table'\nimport { WRAP_MIN_ROW_HEIGHT } from '../constants'\n\nconst Expander = styled(Button)`\n  &.expander {\n    background-color: unset;\n    padding: 2px;\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-high-hover);\n    }\n  }\n  cursor: pointer;\n`\n\nconst StyledEntityNameWidget = styled.div`\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  height: 100%;\n  width: 100%;\n  padding-right: 8px;\n`\n\nconst StyledContentWrapper = styled.div`\n  width: 100%;\n  height: 32px;\n  overflow: hidden;\n  position: relative;\n\n  &.stacked {\n    height: 100%;\n  }\n`\n\nconst StyledContentAbsolute = styled.div`\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n`\n\nconst StyledContent = styled.div`\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-large);\n  padding: 2px 4px;\n  border-radius: var(--border-radius-m);\n  cursor: pointer;\n  overflow: hidden;\n  width: fit-content;\n  max-width: 100%;\n  height: 100%;\n\n  &.stacked {\n    height: auto;\n    max-height: 100%;\n  }\n\n  /* &:hover {\n    &,\n    .icon,\n    .path {\n      color: var(--md-sys-color-primary);\n    }\n  } */\n`\n\nconst StyledTextContent = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  overflow: hidden;\n  flex: 1;\n  min-width: 0;\n\n  &.compact {\n    flex-direction: row;\n    align-items: center;\n  }\n\n  .path {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    margin-bottom: -4px;\n    color: var(--md-sys-color-outline);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  &.compact .path {\n    margin-bottom: 0;\n    text-overflow: unset;\n    flex-shrink: 0 1 auto;\n  }\n\n  .label {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    flex: 1 1 auto;\n    min-width: 0;\n  }\n\n  &.stacked .label {\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 2;\n    white-space: normal;\n    word-break: break-word;\n  }\n\n  .divider {\n    ${theme.bodyMedium}\n    font-size: 14px;\n    color: var(--md-sys-color-outline);\n    flex-shrink: 0;\n  }\n`\n\ntype EntityNameWidgetProps = {\n  id: string\n  entity: EntityData\n  path?: string | null\n  isExpandable?: boolean\n  isExpanded: boolean\n  toggleExpandAll: (id: string) => void\n  toggleExpanded: () => void\n  rowHeight?: number\n  columnDisplayConfig?: DisplayConfig\n}\n\nexport const EntityNameWidget = ({\n  id,\n  entity,\n  path,\n  isExpandable,\n  isExpanded,\n  toggleExpandAll,\n  toggleExpanded,\n  rowHeight = 40,\n  columnDisplayConfig,\n}: EntityNameWidgetProps) => {\n  // Check if this is a restricted access entity\n  const isRestricted = isEntityRestricted(entity.entityType)\n\n  // Determine layout based on row height\n  // below the wrap threshold = single line (compact), above = stacked\n  const isCompact = rowHeight < WRAP_MIN_ROW_HEIGHT\n  const layout = isCompact ? 'compact' : 'stacked'\n\n  // Determine if path should be shown based on display configuration\n  // Check layout-specific setting first, then general setting\n  const showPathCompact = getDisplayValue(columnDisplayConfig, 'path', 'compact') ?? true\n  const showPathFull = getDisplayValue(columnDisplayConfig, 'path', 'full') ?? true\n  const shouldShowPath = isCompact ? showPathCompact : showPathFull\n\n  return (\n    <StyledEntityNameWidget className={layout}>\n      {isExpandable ? (\n        <Expander\n          onClick={(e) => {\n            if (e.altKey) {\n              // expand/collapse all children\n              toggleExpandAll(id)\n            } else {\n              // use built-in toggleExpanded function\n              toggleExpanded()\n            }\n          }}\n          className=\"expander\"\n          icon={isExpanded ? 'expand_more' : 'chevron_right'}\n        />\n      ) : null}\n      <StyledContentWrapper className={layout}>\n        <StyledContentAbsolute>\n          <StyledContent className={layout}>\n            <EntityIcon\n              entity={{\n                entityType: entity.entityType,\n                subType: 'subType' in entity ? entity.subType : undefined,\n              }}\n              icon={entity.icon || undefined}\n              color={entity.color || undefined}\n            />\n            <StyledTextContent className={layout}>\n              {shouldShowPath && !isRestricted && (\n                <span className=\"path\">\n                  {path}\n                  {isCompact && path ? '/' : ''}\n                </span>\n              )}\n              <span className=\"label\">{entity.label || entity.name}</span>\n            </StyledTextContent>\n          </StyledContent>\n        </StyledContentAbsolute>\n      </StyledContentWrapper>\n    </StyledEntityNameWidget>\n  )\n}\n"],"names":["Expander","styled","Button","StyledEntityNameWidget","StyledContentWrapper","StyledContentAbsolute","StyledContent","StyledTextContent","theme","EntityNameWidget","id","entity","path","isExpandable","isExpanded","toggleExpandAll","toggleExpanded","rowHeight","columnDisplayConfig","isRestricted","isEntityRestricted","isCompact","WRAP_MIN_ROW_HEIGHT","layout","showPathCompact","getDisplayValue","showPathFull","shouldShowPath","jsxs","jsx","e","EntityIcon"],"mappings":";;;;;;;AAQA,MAAMA,IAAWC,EAAOC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAYxBC,IAAyBF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUhCG,IAAuBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAW9BI,IAAwBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAO/BK,IAAgBL,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,GA0BvBM,IAAoBN,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAc3BO,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAgBhBA,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAkBhBA,EAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,GAmBTC,IAAmB,CAAC;AAAA,EAC/B,IAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,qBAAAC;AACF,MAA6B;AAE3B,QAAMC,IAAeC,EAAmBT,EAAO,UAAU,GAInDU,IAAYJ,IAAYK,GACxBC,IAASF,IAAY,YAAY,WAIjCG,IAAkBC,EAAgBP,GAAqB,QAAQ,SAAS,KAAK,IAC7EQ,IAAeD,EAAgBP,GAAqB,QAAQ,MAAM,KAAK,IACvES,IAAiBN,IAAYG,IAAkBE;AAErD,SACEE,gBAAAA,EAAAA,KAACzB,GAAA,EAAuB,WAAWoB,GAChC,UAAA;AAAA,IAAAV,IACCgB,gBAAAA,EAAAA;AAAAA,MAAC7B;AAAA,MAAA;AAAA,QACC,SAAS,CAAC8B,MAAM;AACd,UAAIA,EAAE,SAEJf,EAAgBL,CAAE,IAGlBM,EAAA;AAAA,QAEJ;AAAA,QACA,WAAU;AAAA,QACV,MAAMF,IAAa,gBAAgB;AAAA,MAAA;AAAA,IAAA,IAEnC;AAAA,IACJe,gBAAAA,EAAAA,IAACzB,KAAqB,WAAWmB,GAC/B,gCAAClB,GAAA,EACC,UAAAuB,gBAAAA,EAAAA,KAACtB,GAAA,EAAc,WAAWiB,GACxB,UAAA;AAAA,MAAAM,gBAAAA,EAAAA;AAAAA,QAACE;AAAA,QAAA;AAAA,UACC,QAAQ;AAAA,YACN,YAAYpB,EAAO;AAAA,YACnB,SAAS,aAAaA,IAASA,EAAO,UAAU;AAAA,UAAA;AAAA,UAElD,MAAMA,EAAO,QAAQ;AAAA,UACrB,OAAOA,EAAO,SAAS;AAAA,QAAA;AAAA,MAAA;AAAA,MAEzBiB,gBAAAA,EAAAA,KAACrB,GAAA,EAAkB,WAAWgB,GAC3B,UAAA;AAAA,QAAAI,KAAkB,CAACR,KAClBS,gBAAAA,EAAAA,KAAC,QAAA,EAAK,WAAU,QACb,UAAA;AAAA,UAAAhB;AAAA,UACAS,KAAaT,IAAO,MAAM;AAAA,QAAA,GAC7B;AAAA,8BAED,QAAA,EAAK,WAAU,SAAS,UAAAD,EAAO,SAASA,EAAO,KAAA,CAAK;AAAA,MAAA,EAAA,CACvD;AAAA,IAAA,EAAA,CACF,GACF,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/shared/src/containers/ProjectTreeTable/widgets/EntityWidget.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../../../../_virtual/jsx-runtime.cjs.js"),g=require("react"),m=require("clsx"),i=require("styled-components"),R=require("../../../components/EntityIcon/EntityIcon.cjs.js"),S=require("../context/DetailsPanelEntityContext.cjs.js"),C=require("../context/SelectedRowsContext.cjs.js"),j=require("./TextWidget.cjs.js"),D=require("@ynput/ayon-react-components");require("../../../components/SearchFilter/filterDates.cjs.js");require("date-fns");require("short-uuid");require("../utils/columnIds.cjs.js");require("react-toastify");require("lodash");require("uuid");require("../../../api/queries/users/updateUsers.cjs.js");require("../../../util/pubsub.cjs.js");require("../../Feed/components/ActivityCheckbox/ActivityCheckbox.styled.cjs.js");require("../../../components/DoneCheckbox/DoneCheckbox.cjs.js");require("../../Feed/components/ActivityReference/ActivityReference.styled.cjs.js");require("../../Feed/components/ActivityComment/ActivityComment.styled.cjs.js");require("react-router-dom");require("../context/CellEditingContext.cjs.js");require("../context/SelectionCellsContext.cjs.js");require("../context/ProjectTableQueriesContext.cjs.js");require("../../../context/ProjectContext.cjs.js");require("../context/ColumnSettingsContext.cjs.js");require("../context/ProjectTableContextInstance.cjs.js");require("../../../api/base/client.cjs.js");require("../../../api/generated/graphql.cjs.js");require("../../../api/generated/graphqlLinks.cjs.js");require("../../../api/generated/access.cjs.js");require("../../../api/generated/actions.cjs.js");require("../../../api/generated/activityFeed.cjs.js");require("../../../api/generated/addons.cjs.js");require("../../../api/generated/anatomy.cjs.js");require("../../../api/generated/attributes.cjs.js");require("../../../api/generated/authentication.cjs.js");require("../../../api/generated/bundles.cjs.js");require("../../../api/generated/configuration.cjs.js");require("../../../api/generated/dataImport.cjs.js");require("../../../api/generated/desktop.cjs.js");require("../../../api/generated/entityLists.cjs.js");require("../../../api/generated/events.cjs.js");require("../../../api/generated/files.cjs.js");require("../../../api/generated/folders.cjs.js");require("../../../api/generated/inbox.cjs.js");require("../../../api/generated/links.cjs.js");require("../../../api/generated/market.cjs.js");require("../../../api/generated/onboarding.cjs.js");require("../../../api/generated/operations.cjs.js");require("../../../api/generated/products.cjs.js");require("../../../api/generated/projectDashboard.cjs.js");require("../../../api/generated/projects.cjs.js");require("../../../api/generated/projectFolders.cjs.js");require("../../../api/generated/reviewables.cjs.js");require("../../../api/generated/services.cjs.js");require("../../../api/generated/system.cjs.js");require("../../../api/generated/tasks.cjs.js");require("../../../api/generated/teams.cjs.js");require("../../../api/generated/thumbnails.cjs.js");require("../../../api/generated/uRIs.cjs.js");require("../../../api/generated/users.cjs.js");require("../../../api/generated/versions.cjs.js");require("../../../api/generated/workfiles.cjs.js");require("../../../api/generated/ynputCloud.cjs.js");require("../../../api/generated/grouping.cjs.js");require("../../../api/generated/views.cjs.js");require("../../../api/queries/actions/getActions.cjs.js");require("../../../api/queries/activities/getActivities.cjs.js");require("../../../api/queries/activities/updateReaction.cjs.js");require("../../../api/queries/activities/getMentions.cjs.js");require("../../../api/queries/activities/getCategories.cjs.js");require("../../../api/queries/addons/getAddons.cjs.js");require("../../../api/queries/addons/updateAddons.cjs.js");require("../../../api/queries/attributes/getAttributes.cjs.js");require("../../../api/queries/attributes/updateAttributes.cjs.js");require("../../../api/queries/authentication/getAuthentication.cjs.js");require("../../../api/queries/bundles/getBundles.cjs.js");require("../../../api/queries/bundles/updateBundles.cjs.js");require("../../../api/queries/cloud/cloud.cjs.js");require("../../../api/queries/columnStats/metricTargets.cjs.js");require("../../../api/queries/columnStats/groupCounts.cjs.js");require("../../../api/queries/config/getConfig.cjs.js");require("../../../api/queries/config/updateConfig.cjs.js");require("../../../api/queries/entities/getEntity.cjs.js");require("../../../api/queries/entities/getEntityPanel.cjs.js");require("../../../api/queries/overview/getOverview.cjs.js");require("../../../api/queries/overview/updateOverview.cjs.js");require("../../../api/queries/versions/getVersionsProducts.cjs.js");require("../../../api/queries/links/getEntityLinks.cjs.js");require("../../../api/queries/entities/updateEntity.cjs.js");require("../../../api/queries/entityLists/getLists.cjs.js");require("../../../api/queries/entityLists/updateLists.cjs.js");require("../../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../../api/queries/entityLists/listItemsColumnStats.cjs.js");require("../../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../../api/queries/entityLists/listFolders.cjs.js");require("../../../api/queries/folders/getFolders.cjs.js");require("../../../api/queries/folders/getFolderDeleteInfo.cjs.js");require("../../../api/queries/grouping/getGrouping.cjs.js");require("../../../api/queries/links/updateLinks.cjs.js");require("../../../api/queries/links/getLinks.cjs.js");require("../../../api/queries/permissions/getPermissions.cjs.js");require("../../../api/queries/products/createProduct.cjs.js");require("../../../api/queries/products/getFolderProducts.cjs.js");require("../../../api/queries/project/getProject.cjs.js");require("../../../api/queries/project/updateProject.cjs.js");require("../../../api/queries/projectFolders/projectFolders.cjs.js");require("../../../api/queries/review/getReview.cjs.js");require("../../../api/queries/review/updateReview.cjs.js");require("../../../api/queries/share/share.cjs.js");require("../../../api/queries/system/getSystem.cjs.js");require("../../../api/queries/tasks/getTasks.cjs.js");require("../../../api/queries/tasks/updateTasks.cjs.js");require("../../../api/queries/teams/getTeams.cjs.js");require("../../../api/queries/userDashboard/getUserDashboard.cjs.js");require("../../../api/queries/users/getUsers.cjs.js");require("../../../api/queries/users/guests.cjs.js");require("../../../api/queries/versions/updateVersions.cjs.js");require("../../../api/queries/views/getViews.cjs.js");require("../../../api/queries/views/updateViews.cjs.js");require("../../../api/queries/watchers/getWatchers.cjs.js");require("../../../api/queries/uris/getUris.cjs.js");require("../context/ClipboardContext.cjs.js");require("@tanstack/react-table");;/* empty css                                      */require("../../ContextMenu/ContextMenuContext.cjs.js");require("../../../context/DeleteEntitiesContext.cjs.js");require("../../../context/GlobalContext.cjs.js");require("../context/ProjectDataContextInstance.cjs.js");const h=require("../utils/restrictedEntity.cjs.js");require("../../../context/ProjectFoldersContextInstance.cjs.js");require("../buildTreeTableColumns.cjs.js");const w=i(j.StyledBaseTextWidget)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../../../../_virtual/jsx-runtime.cjs.js"),g=require("react"),m=require("clsx"),i=require("styled-components"),R=require("../../../components/EntityIcon/EntityIcon.cjs.js"),S=require("../context/DetailsPanelEntityContext.cjs.js"),C=require("../context/SelectedRowsContext.cjs.js"),j=require("./TextWidget.cjs.js"),D=require("@ynput/ayon-react-components");require("../../../components/SearchFilter/filterDates.cjs.js");require("date-fns");require("uuid");require("../utils/columnIds.cjs.js");require("react-toastify");require("lodash");require("../../../api/queries/users/updateUsers.cjs.js");require("../../../util/searchTerms.cjs.js");require("../../../util/pubsub.cjs.js");require("../../Feed/components/ActivityCheckbox/ActivityCheckbox.styled.cjs.js");require("../../../components/DoneCheckbox/DoneCheckbox.cjs.js");require("../../Feed/components/ActivityReference/ActivityReference.styled.cjs.js");require("../../Feed/components/ActivityComment/ActivityComment.styled.cjs.js");require("react-router-dom");require("../context/CellEditingContext.cjs.js");require("../context/SelectionCellsContext.cjs.js");require("../context/ProjectTableQueriesContext.cjs.js");require("../../../context/ProjectContext.cjs.js");require("../context/ColumnSettingsContext.cjs.js");require("../context/ProjectTableContextInstance.cjs.js");require("../../../api/base/client.cjs.js");require("../../../api/generated/graphql.cjs.js");require("../../../api/generated/graphqlLinks.cjs.js");require("../../../api/generated/access.cjs.js");require("../../../api/generated/actions.cjs.js");require("../../../api/generated/activityFeed.cjs.js");require("../../../api/generated/addons.cjs.js");require("../../../api/generated/anatomy.cjs.js");require("../../../api/generated/attributes.cjs.js");require("../../../api/generated/authentication.cjs.js");require("../../../api/generated/bundles.cjs.js");require("../../../api/generated/configuration.cjs.js");require("../../../api/generated/dataImport.cjs.js");require("../../../api/generated/desktop.cjs.js");require("../../../api/generated/entityLists.cjs.js");require("../../../api/generated/enums.cjs.js");require("../../../api/generated/events.cjs.js");require("../../../api/generated/files.cjs.js");require("../../../api/generated/folders.cjs.js");require("../../../api/generated/inbox.cjs.js");require("../../../api/generated/links.cjs.js");require("../../../api/generated/market.cjs.js");require("../../../api/generated/onboarding.cjs.js");require("../../../api/generated/operations.cjs.js");require("../../../api/generated/products.cjs.js");require("../../../api/generated/projectDashboard.cjs.js");require("../../../api/generated/projects.cjs.js");require("../../../api/generated/projectFolders.cjs.js");require("../../../api/generated/reviewables.cjs.js");require("../../../api/generated/services.cjs.js");require("../../../api/generated/system.cjs.js");require("../../../api/generated/tasks.cjs.js");require("../../../api/generated/teams.cjs.js");require("../../../api/generated/thumbnails.cjs.js");require("../../../api/generated/uRIs.cjs.js");require("../../../api/generated/users.cjs.js");require("../../../api/generated/versions.cjs.js");require("../../../api/generated/workfiles.cjs.js");require("../../../api/generated/ynputCloud.cjs.js");require("../../../api/generated/grouping.cjs.js");require("../../../api/generated/views.cjs.js");require("../../../api/queries/accessGroups/getAccessGroups.cjs.js");require("../../../api/queries/accessGroups/updateAccessGroups.cjs.js");require("../../../api/queries/actions/getActions.cjs.js");require("../../../api/queries/activities/getActivities.cjs.js");require("../../../api/queries/activities/updateReaction.cjs.js");require("../../../api/queries/activities/getMentions.cjs.js");require("../../../api/queries/activities/getCategories.cjs.js");require("../../../api/queries/addons/getAddons.cjs.js");require("../../../api/queries/addons/updateAddons.cjs.js");require("../../../api/queries/attributes/getAttributes.cjs.js");require("../../../api/queries/attributes/updateAttributes.cjs.js");require("../../../api/queries/authentication/getAuthentication.cjs.js");require("../../../api/queries/bundles/getBundles.cjs.js");require("../../../api/queries/bundles/updateBundles.cjs.js");require("../../../api/queries/cloud/cloud.cjs.js");require("../../../api/queries/columnStats/metricTargets.cjs.js");require("../../../api/queries/columnStats/groupCounts.cjs.js");require("../../../api/queries/config/getConfig.cjs.js");require("../../../api/queries/config/updateConfig.cjs.js");require("../../../api/queries/entities/getEntity.cjs.js");require("../../../api/queries/entities/getEntityPanel.cjs.js");require("../../../api/queries/overview/getOverview.cjs.js");require("../../../api/queries/overview/updateOverview.cjs.js");require("../../../api/queries/versions/getVersionsProducts.cjs.js");require("../../../api/queries/links/getEntityLinks.cjs.js");require("../../../api/queries/entities/updateEntity.cjs.js");require("../../../api/queries/entityLists/getLists.cjs.js");require("../../../api/queries/entityLists/updateLists.cjs.js");require("../../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../../api/queries/entityLists/listItemsColumnStats.cjs.js");require("../../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../../api/queries/entityLists/listFolders.cjs.js");require("../../../api/queries/enums/getEnums.cjs.js");require("../../../api/queries/folders/getFolders.cjs.js");require("../../../api/queries/folders/getFolderDeleteInfo.cjs.js");require("../../../api/queries/grouping/getGrouping.cjs.js");require("../../../api/queries/links/updateLinks.cjs.js");require("../../../api/queries/links/getLinks.cjs.js");require("../../../api/queries/permissions/getPermissions.cjs.js");require("../../../api/queries/products/createProduct.cjs.js");require("../../../api/queries/products/getFolderProducts.cjs.js");require("../../../api/queries/project/getProject.cjs.js");require("../../../api/queries/project/updateProject.cjs.js");require("../../../api/queries/projectFolders/projectFolders.cjs.js");require("../../../api/queries/review/getReview.cjs.js");require("../../../api/queries/review/updateReview.cjs.js");require("../../../api/queries/share/share.cjs.js");require("../../../api/queries/system/getSystem.cjs.js");require("../../../api/queries/tasks/getTasks.cjs.js");require("../../../api/queries/tasks/updateTasks.cjs.js");require("../../../api/queries/teams/getTeams.cjs.js");require("../../../api/queries/userDashboard/getUserDashboard.cjs.js");require("../../../api/queries/users/getUsers.cjs.js");require("../../../api/queries/users/guests.cjs.js");require("../../../api/queries/versions/updateVersions.cjs.js");require("../../../api/queries/views/getViews.cjs.js");require("../../../api/queries/views/updateViews.cjs.js");require("../../../api/queries/watchers/getWatchers.cjs.js");require("../../../api/queries/uris/getUris.cjs.js");require("../context/ClipboardContext.cjs.js");require("@tanstack/react-table");;/* empty css                                      */require("../../ContextMenu/ContextMenuContext.cjs.js");require("../../../context/DeleteEntitiesContext.cjs.js");require("../../../context/GlobalContext.cjs.js");require("../context/ProjectDataContextInstance.cjs.js");const h=require("../utils/restrictedEntity.cjs.js");require("../../Slicer/context/SlicerContextInstance.cjs.js");require("../../../context/RemoteModulesContext.cjs.js");require("../../../../../_virtual/runtime.cjs.js");require("../../../../../_virtual/semver.cjs.js");require("../../../context/PowerpackContextInstance.cjs.js");require("../../Slicer/components/SlicerDropdownFallback.cjs.js");require("../../../context/ProjectFoldersContextInstance.cjs.js");require("../buildTreeTableColumns.cjs.js");const w=i(j.StyledBaseTextWidget)`
   position: absolute;
   inset: 0;
   padding: 4px 8px;

package/dist/shared/src/containers/ProjectTreeTable/widgets/EntityWidget.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EntityWidget.tsx"],"sourcesContent":["import { FC, MouseEventHandler, useContext } from 'react'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\nimport { CellValue } from './CellWidget'\nimport { EntityIcon } from '@shared/components/EntityIcon/EntityIcon'\nimport { DetailsPanelEntityContext } from '../context/DetailsPanelEntityContext'\nimport { useOptionalSelectedRowsContext } from '../context/SelectedRowsContext'\nimport { StyledBaseTextWidget } from './TextWidget'\nimport { READ_ONLY } from '../utils'\nimport { Icon } from '@ynput/ayon-react-components'\n\nconst EntityCell = styled(StyledBaseTextWidget)`\n  position: absolute;\n  inset: 0;\n  padding: 4px 8px;\n  align-items: center;\n\n  &.loading {\n    inset: 4px;\n    border-radius: 4px;\n    opacity: 1;\n  }\n`\n\nconst EntityButton = styled.div`\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  border-radius: 4px;\n  cursor: pointer;\n  padding: 2px 4px;\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n`\n\nconst OpenIcon = styled(Icon)`\n  opacity: 0;\n\n  ${EntityButton}:hover & {\n    opacity: 1;\n  }\n`\n\nexport const ENTITY_WIDGET_CLASS = 'entity-widget'\n\ntype EntityWidgetProps = {\n  rowId: string\n  columnId: string\n  value: CellValue\n  entityId?: string | null\n  entityType: 'folder' | 'task' | 'version'\n  subType?: string | null\n  className?: string\n  isLoading?: boolean\n}\n\nexport const EntityWidget: FC<EntityWidgetProps> = ({\n  rowId,\n  columnId,\n  value,\n  entityId,\n  entityType,\n  subType,\n  className,\n  isLoading,\n}) => {\n  const entityContext = useContext(DetailsPanelEntityContext)\n  const selectedRowsContext = useOptionalSelectedRowsContext()\n\n  const openEntity = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (event.button !== 0 || !entityId || !entityContext) {\n      return\n    }\n\n    selectedRowsContext?.clearRowsSelection()\n    entityContext.setSelectedEntity({ entityId, entityType })\n    event.preventDefault()\n  }\n\n  const handleMouseDown: MouseEventHandler<HTMLDivElement> = (event) => {\n    if (event.detail === 2) openEntity(event)\n  }\n\n  return (\n    <EntityCell\n      id={`${rowId}-${columnId}`}\n      className={clsx(ENTITY_WIDGET_CLASS, READ_ONLY, className, { loading: isLoading })}\n      onMouseDown={handleMouseDown}\n      data-tooltip-delay={200}\n    >\n      <EntityButton onMouseDown={openEntity}>\n        {subType && <EntityIcon entity={{ entityType, subType }} />}\n        {String(value ?? '')}\n        <OpenIcon icon=\"dock_to_left\" />\n      </EntityButton>\n    </EntityCell>\n  )\n}\n"],"names":["EntityCell","styled","StyledBaseTextWidget","EntityButton","OpenIcon","Icon","ENTITY_WIDGET_CLASS","EntityWidget","rowId","columnId","value","entityId","entityType","subType","className","isLoading","entityContext","useContext","DetailsPanelEntityContext","selectedRowsContext","useOptionalSelectedRowsContext","openEntity","event","handleMouseDown","jsx","clsx","READ_ONLY","jsxs","EntityIcon"],"mappings":"upOAWA,MAAMA,EAAaC,EAAOC,sBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaxCC,EAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAatBG,EAAWH,EAAOI,MAAI;AAAA;AAAA;AAAA,IAGxBF,CAAY;AAAA;AAAA;AAAA,EAKHG,EAAsB,gBAatBC,EAAsC,CAAC,CAClD,MAAAC,EACA,SAAAC,EACA,MAAAC,EACA,SAAAC,EACA,WAAAC,EACA,QAAAC,EACA,UAAAC,EACA,UAAAC,CACF,IAAM,CACJ,MAAMC,EAAgBC,EAAAA,WAAWC,2BAAyB,EACpDC,EAAsBC,EAAAA,+BAAA,EAEtBC,EAAcC,GAA4C,CAC1DA,EAAM,SAAW,GAAK,CAACX,GAAY,CAACK,IAIxCG,GAAqB,mBAAA,EACrBH,EAAc,kBAAkB,CAAE,SAAAL,EAAU,WAAAC,CAAA,CAAY,EACxDU,EAAM,eAAA,EACR,EAEMC,EAAsDD,GAAU,CAChEA,EAAM,SAAW,GAAGD,EAAWC,CAAK,CAC1C,EAEA,OACEE,EAAAA,kBAAAA,IAACxB,EAAA,CACC,GAAI,GAAGQ,CAAK,IAAIC,CAAQ,GACxB,UAAWgB,EAAKnB,EAAqBoB,EAAAA,UAAWZ,EAAW,CAAE,QAASC,EAAW,EACjF,YAAaQ,EACb,qBAAoB,IAEpB,SAAAI,EAAAA,kBAAAA,KAACxB,EAAA,CAAa,YAAakB,EACxB,SAAA,CAAAR,2BAAYe,aAAA,CAAW,OAAQ,CAAE,WAAAhB,EAAY,QAAAC,GAAW,EACxD,OAAOH,GAAS,EAAE,EACnBc,EAAAA,kBAAAA,IAACpB,EAAA,CAAS,KAAK,cAAA,CAAe,CAAA,CAAA,CAChC,CAAA,CAAA,CAGN"}
+{"version":3,"file":"EntityWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EntityWidget.tsx"],"sourcesContent":["import { FC, MouseEventHandler, useContext } from 'react'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\nimport { CellValue } from './CellWidget'\nimport { EntityIcon } from '@shared/components/EntityIcon/EntityIcon'\nimport { DetailsPanelEntityContext } from '../context/DetailsPanelEntityContext'\nimport { useOptionalSelectedRowsContext } from '../context/SelectedRowsContext'\nimport { StyledBaseTextWidget } from './TextWidget'\nimport { READ_ONLY } from '../utils'\nimport { Icon } from '@ynput/ayon-react-components'\n\nconst EntityCell = styled(StyledBaseTextWidget)`\n  position: absolute;\n  inset: 0;\n  padding: 4px 8px;\n  align-items: center;\n\n  &.loading {\n    inset: 4px;\n    border-radius: 4px;\n    opacity: 1;\n  }\n`\n\nconst EntityButton = styled.div`\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  border-radius: 4px;\n  cursor: pointer;\n  padding: 2px 4px;\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n`\n\nconst OpenIcon = styled(Icon)`\n  opacity: 0;\n\n  ${EntityButton}:hover & {\n    opacity: 1;\n  }\n`\n\nexport const ENTITY_WIDGET_CLASS = 'entity-widget'\n\ntype EntityWidgetProps = {\n  rowId: string\n  columnId: string\n  value: CellValue\n  entityId?: string | null\n  entityType: 'folder' | 'task' | 'version'\n  subType?: string | null\n  className?: string\n  isLoading?: boolean\n}\n\nexport const EntityWidget: FC<EntityWidgetProps> = ({\n  rowId,\n  columnId,\n  value,\n  entityId,\n  entityType,\n  subType,\n  className,\n  isLoading,\n}) => {\n  const entityContext = useContext(DetailsPanelEntityContext)\n  const selectedRowsContext = useOptionalSelectedRowsContext()\n\n  const openEntity = (event: React.MouseEvent<HTMLDivElement>) => {\n    if (event.button !== 0 || !entityId || !entityContext) {\n      return\n    }\n\n    selectedRowsContext?.clearRowsSelection()\n    entityContext.setSelectedEntity({ entityId, entityType })\n    event.preventDefault()\n  }\n\n  const handleMouseDown: MouseEventHandler<HTMLDivElement> = (event) => {\n    if (event.detail === 2) openEntity(event)\n  }\n\n  return (\n    <EntityCell\n      id={`${rowId}-${columnId}`}\n      className={clsx(ENTITY_WIDGET_CLASS, READ_ONLY, className, { loading: isLoading })}\n      onMouseDown={handleMouseDown}\n      data-tooltip-delay={200}\n    >\n      <EntityButton onMouseDown={openEntity}>\n        {subType && <EntityIcon entity={{ entityType, subType }} />}\n        {String(value ?? '')}\n        <OpenIcon icon=\"dock_to_left\" />\n      </EntityButton>\n    </EntityCell>\n  )\n}\n"],"names":["EntityCell","styled","StyledBaseTextWidget","EntityButton","OpenIcon","Icon","ENTITY_WIDGET_CLASS","EntityWidget","rowId","columnId","value","entityId","entityType","subType","className","isLoading","entityContext","useContext","DetailsPanelEntityContext","selectedRowsContext","useOptionalSelectedRowsContext","openEntity","event","handleMouseDown","jsx","clsx","READ_ONLY","jsxs","EntityIcon"],"mappings":"kvPAWA,MAAMA,EAAaC,EAAOC,sBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaxCC,EAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAatBG,EAAWH,EAAOI,MAAI;AAAA;AAAA;AAAA,IAGxBF,CAAY;AAAA;AAAA;AAAA,EAKHG,EAAsB,gBAatBC,EAAsC,CAAC,CAClD,MAAAC,EACA,SAAAC,EACA,MAAAC,EACA,SAAAC,EACA,WAAAC,EACA,QAAAC,EACA,UAAAC,EACA,UAAAC,CACF,IAAM,CACJ,MAAMC,EAAgBC,EAAAA,WAAWC,2BAAyB,EACpDC,EAAsBC,EAAAA,+BAAA,EAEtBC,EAAcC,GAA4C,CAC1DA,EAAM,SAAW,GAAK,CAACX,GAAY,CAACK,IAIxCG,GAAqB,mBAAA,EACrBH,EAAc,kBAAkB,CAAE,SAAAL,EAAU,WAAAC,CAAA,CAAY,EACxDU,EAAM,eAAA,EACR,EAEMC,EAAsDD,GAAU,CAChEA,EAAM,SAAW,GAAGD,EAAWC,CAAK,CAC1C,EAEA,OACEE,EAAAA,kBAAAA,IAACxB,EAAA,CACC,GAAI,GAAGQ,CAAK,IAAIC,CAAQ,GACxB,UAAWgB,EAAKnB,EAAqBoB,EAAAA,UAAWZ,EAAW,CAAE,QAASC,EAAW,EACjF,YAAaQ,EACb,qBAAoB,IAEpB,SAAAI,EAAAA,kBAAAA,KAACxB,EAAA,CAAa,YAAakB,EACxB,SAAA,CAAAR,2BAAYe,aAAA,CAAW,OAAQ,CAAE,WAAAhB,EAAY,QAAAC,GAAW,EACxD,OAAOH,GAAS,EAAE,EACnBc,EAAAA,kBAAAA,IAACpB,EAAA,CAAS,KAAK,cAAA,CAAe,CAAA,CAAA,CAChC,CAAA,CAAA,CAGN"}