@ynput/ayon-frontend-shared 0.4.3 → 0.4.4

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"),i=require("@ynput/ayon-react-components"),t=require("styled-components"),E=require("../utils/restrictedEntity.cjs.js"),l=require("../types/columnConfig.cjs.js"),R=require("../../../components/EntityIcon/EntityIcon.cjs.js"),k=require("../constants.cjs.js"),N=t(i.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;
-`,C=t.div`
+`,R=o.div`
   position: relative;
   display: flex;
   align-items: center;
@@ -16,7 +16,7 @@
   height: 100%;
   width: 100%;
   padding-right: 8px;
-`,S=t.div`
+`,k=o.div`
   width: 100%;
   height: 32px;
   overflow: hidden;
@@ -25,12 +25,12 @@
   &.stacked {
     height: 100%;
   }
-`,q=t.div`
+`,N=o.div`
   position: absolute;
   inset: 0;
   display: flex;
   align-items: center;
-`,W=t.div`
+`,T=o.div`
   display: flex;
   align-items: center;
   gap: var(--base-gap-large);
@@ -54,7 +54,7 @@
       color: var(--md-sys-color-primary);
     }
   } */
-`,M=t.div`
+`,C=o.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -68,7 +68,7 @@
   }
 
   .path {
-    ${i.theme.bodyMedium}
+    ${s.theme.bodyMedium}
     font-size: 14px;
     margin-bottom: -4px;
     color: var(--md-sys-color-outline);
@@ -84,7 +84,7 @@
   }
 
   .label {
-    ${i.theme.bodyMedium}
+    ${s.theme.bodyMedium}
     font-size: 14px;
     overflow: hidden;
     white-space: nowrap;
@@ -102,10 +102,10 @@
   }
 
   .divider {
-    ${i.theme.bodyMedium}
+    ${s.theme.bodyMedium}
     font-size: 14px;
     color: var(--md-sys-color-outline);
     flex-shrink: 0;
   }
-`,P=({id:c,label:d,name:p,path:n,isExpandable:x,entityType:r,subType:h,isExpanded:m,toggleExpandAll:u,toggleExpanded:g,rowHeight:y=40,columnDisplayConfig:a})=>{const v=E.isEntityRestricted(r),s=y<k.WRAP_MIN_ROW_HEIGHT,o=s?"compact":"stacked",w=l.getDisplayValue(a,"path","compact")??!0,f=l.getDisplayValue(a,"path","full")??!0,b=s?w:f;return e.jsxRuntimeExports.jsxs(C,{className:o,children:[x?e.jsxRuntimeExports.jsx(N,{onClick:j=>{j.altKey?u(c):g()},className:"expander",icon:m?"expand_more":"chevron_right"}):null,e.jsxRuntimeExports.jsx(S,{className:o,children:e.jsxRuntimeExports.jsx(q,{children:e.jsxRuntimeExports.jsxs(W,{className:o,children:[e.jsxRuntimeExports.jsx(R.EntityIcon,{entity:{entityType:r,subType:h||void 0}}),e.jsxRuntimeExports.jsxs(M,{className:o,children:[b&&!v&&e.jsxRuntimeExports.jsxs("span",{className:"path",children:[n,s&&n?"/":""]}),e.jsxRuntimeExports.jsx("span",{className:"label",children:d||p})]})]})})})]})};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 { isEntityRestricted } from '../utils/restrictedEntity'\nimport { getDisplayValue, type DisplayConfig, getColumnDisplayConfig } from '../types/columnConfig'\nimport { EntityIcon } from '@shared/components/EntityIcon/EntityIcon'\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  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  // 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 entity={{ entityType, subType: subType || undefined }} />\n            <StyledTextContent className={layout}>\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","WRAP_MIN_ROW_HEIGHT","layout","showPathCompact","getDisplayValue","showPathFull","shouldShowPath","jsxs","jsx","e","EntityIcon"],"mappings":"8YAOMA,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,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,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,KAAC5B,EAAA,CAAuB,UAAWuB,EAChC,SAAA,CAAAZ,EACCkB,EAAAA,kBAAAA,IAAChC,EAAA,CACC,QAAUiC,GAAM,CACVA,EAAE,OAEJf,EAAgBR,CAAE,EAGlBS,EAAA,CAEJ,EACA,UAAU,WACV,KAAMF,EAAa,cAAgB,eAAA,CAAA,EAEnC,KACJe,EAAAA,kBAAAA,IAAC5B,GAAqB,UAAWsB,EAC/B,iCAACrB,EAAA,CACC,SAAA0B,EAAAA,kBAAAA,KAACzB,EAAA,CAAc,UAAWoB,EACxB,SAAA,CAAAM,wBAACE,EAAAA,YAAW,OAAQ,CAAE,WAAAnB,EAAY,QAASC,GAAW,QAAa,EACnEe,EAAAA,kBAAAA,KAACxB,EAAA,CAAkB,UAAWmB,EAC3B,SAAA,CAAAI,GAAkB,CAACR,GAClBS,EAAAA,kBAAAA,KAAC,OAAA,CAAK,UAAU,OACb,SAAA,CAAAlB,EACAW,GAAaX,EAAO,IAAM,EAAA,EAC7B,EAEFmB,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,QAAS,YAASpB,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 r } from "@ynput/ayon-react-components";
-import t from "styled-components";
-import { isEntityRestricted as N } from "../utils/restrictedEntity.es.js";
-import { getDisplayValue as l } from "../types/columnConfig.es.js";
-import { EntityIcon as E } from "../../../components/EntityIcon/EntityIcon.es.js";
-import { WRAP_MIN_ROW_HEIGHT as C } from "../constants.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;
-`, R = t.div`
+`, T = o.div`
   position: relative;
   display: flex;
   align-items: center;
@@ -23,7 +23,7 @@ const S = t(j)`
   height: 100%;
   width: 100%;
   padding-right: 8px;
-`, W = t.div`
+`, E = o.div`
   width: 100%;
   height: 32px;
   overflow: hidden;
@@ -32,12 +32,12 @@ const S = t(j)`
   &.stacked {
     height: 100%;
   }
-`, _ = t.div`
+`, C = o.div`
   position: absolute;
   inset: 0;
   display: flex;
   align-items: center;
-`, M = t.div`
+`, S = o.div`
   display: flex;
   align-items: center;
   gap: var(--base-gap-large);
@@ -61,7 +61,7 @@ const S = t(j)`
       color: var(--md-sys-color-primary);
     }
   } */
-`, P = t.div`
+`, R = o.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -75,7 +75,7 @@ const S = t(j)`
   }
 
   .path {
-    ${r.bodyMedium}
+    ${s.bodyMedium}
     font-size: 14px;
     margin-bottom: -4px;
     color: var(--md-sys-color-outline);
@@ -91,7 +91,7 @@ const S = t(j)`
   }
 
   .label {
-    ${r.bodyMedium}
+    ${s.bodyMedium}
     font-size: 14px;
     overflow: hidden;
     white-space: nowrap;
@@ -109,50 +109,57 @@ const S = t(j)`
   }
 
   .divider {
-    ${r.bodyMedium}
+    ${s.bodyMedium}
     font-size: 14px;
     color: var(--md-sys-color-outline);
     flex-shrink: 0;
   }
-`, F = ({
+`, A = ({
   id: d,
-  label: c,
-  name: p,
-  path: s,
-  isExpandable: m,
-  entityType: a,
-  subType: h,
-  isExpanded: x,
-  toggleExpandAll: f,
-  toggleExpanded: u,
-  rowHeight: v = 40,
-  columnDisplayConfig: n
+  entity: t,
+  path: a,
+  isExpandable: c,
+  isExpanded: p,
+  toggleExpandAll: m,
+  toggleExpanded: h,
+  rowHeight: x = 40,
+  columnDisplayConfig: l
 }) => {
-  const g = N(a), i = v < C, o = i ? "compact" : "stacked", w = l(n, "path", "compact") ?? !0, y = l(n, "path", "full") ?? !0, b = i ? w : y;
-  return /* @__PURE__ */ e.jsxs(R, { className: o, children: [
-    m ? /* @__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: (k) => {
-          k.altKey ? f(d) : u();
+        onClick: (w) => {
+          w.altKey ? m(d) : h();
         },
         className: "expander",
-        icon: x ? "expand_more" : "chevron_right"
+        icon: p ? "expand_more" : "chevron_right"
       }
     ) : null,
-    /* @__PURE__ */ e.jsx(W, { className: o, children: /* @__PURE__ */ e.jsx(_, { children: /* @__PURE__ */ e.jsxs(M, { className: o, children: [
-      /* @__PURE__ */ e.jsx(E, { entity: { entityType: a, subType: h || void 0 } }),
-      /* @__PURE__ */ e.jsxs(P, { className: o, children: [
-        b && !g && /* @__PURE__ */ e.jsxs("span", { className: "path", children: [
-          s,
-          i && s ? "/" : ""
+    /* @__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: c || p })
+        /* @__PURE__ */ e.jsx("span", { className: "label", children: t.label || t.name })
       ] })
     ] }) }) })
   ] });
 };
 export {
-  F 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 { isEntityRestricted } from '../utils/restrictedEntity'\nimport { getDisplayValue, type DisplayConfig, getColumnDisplayConfig } from '../types/columnConfig'\nimport { EntityIcon } from '@shared/components/EntityIcon/EntityIcon'\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  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  // 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 entity={{ entityType, subType: subType || undefined }} />\n            <StyledTextContent className={layout}>\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","WRAP_MIN_ROW_HEIGHT","layout","showPathCompact","getDisplayValue","showPathFull","shouldShowPath","jsxs","jsx","e","EntityIcon"],"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;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,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,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,KAAC5B,GAAA,EAAuB,WAAWuB,GAChC,UAAA;AAAA,IAAAZ,IACCkB,gBAAAA,EAAAA;AAAAA,MAAChC;AAAA,MAAA;AAAA,QACC,SAAS,CAACiC,MAAM;AACd,UAAIA,EAAE,SAEJf,EAAgBR,CAAE,IAGlBS,EAAA;AAAA,QAEJ;AAAA,QACA,WAAU;AAAA,QACV,MAAMF,IAAa,gBAAgB;AAAA,MAAA;AAAA,IAAA,IAEnC;AAAA,IACJe,gBAAAA,EAAAA,IAAC5B,KAAqB,WAAWsB,GAC/B,gCAACrB,GAAA,EACC,UAAA0B,gBAAAA,EAAAA,KAACzB,GAAA,EAAc,WAAWoB,GACxB,UAAA;AAAA,MAAAM,gBAAAA,MAACE,KAAW,QAAQ,EAAE,YAAAnB,GAAY,SAASC,KAAW,UAAa;AAAA,MACnEe,gBAAAA,EAAAA,KAACxB,GAAA,EAAkB,WAAWmB,GAC3B,UAAA;AAAA,QAAAI,KAAkB,CAACR,KAClBS,gBAAAA,EAAAA,KAAC,QAAA,EAAK,WAAU,QACb,UAAA;AAAA,UAAAlB;AAAA,UACAW,KAAaX,IAAO,MAAM;AAAA,QAAA,GAC7B;AAAA,QAEFmB,gBAAAA,EAAAA,IAAC,QAAA,EAAK,WAAU,SAAS,eAASpB,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"}

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

@@ -9,12 +9,12 @@ import { StyledBaseTextWidget as C } from "./TextWidget.es.js";
 import { Icon as D } from "@ynput/ayon-react-components";
 import "../../../components/SearchFilter/filterDates.es.js";
 import "date-fns";
-import "short-uuid";
+import "uuid";
 import "../utils/columnIds.es.js";
 import "react-toastify";
 import "lodash";
-import "uuid";
 import "../../../api/queries/users/updateUsers.es.js";
+import "../../../util/searchTerms.es.js";
 import "../../../util/pubsub.es.js";
 import "../../Feed/components/ActivityCheckbox/ActivityCheckbox.styled.es.js";
 import "../../../components/DoneCheckbox/DoneCheckbox.es.js";
@@ -42,6 +42,7 @@ import "../../../api/generated/configuration.es.js";
 import "../../../api/generated/dataImport.es.js";
 import "../../../api/generated/desktop.es.js";
 import "../../../api/generated/entityLists.es.js";
+import "../../../api/generated/enums.es.js";
 import "../../../api/generated/events.es.js";
 import "../../../api/generated/files.es.js";
 import "../../../api/generated/folders.es.js";
@@ -67,6 +68,8 @@ import "../../../api/generated/workfiles.es.js";
 import "../../../api/generated/ynputCloud.es.js";
 import "../../../api/generated/grouping.es.js";
 import "../../../api/generated/views.es.js";
+import "../../../api/queries/accessGroups/getAccessGroups.es.js";
+import "../../../api/queries/accessGroups/updateAccessGroups.es.js";
 import "../../../api/queries/actions/getActions.es.js";
 import "../../../api/queries/activities/getActivities.es.js";
 import "../../../api/queries/activities/updateReaction.es.js";
@@ -97,6 +100,7 @@ import "../../../api/queries/entityLists/getListsAttributes.es.js";
 import "../../../api/queries/entityLists/listItemsColumnStats.es.js";
 import "../../../api/queries/entityLists/updateListsAttributes.es.js";
 import "../../../api/queries/entityLists/listFolders.es.js";
+import "../../../api/queries/enums/getEnums.es.js";
 import "../../../api/queries/folders/getFolders.es.js";
 import "../../../api/queries/folders/getFolderDeleteInfo.es.js";
 import "../../../api/queries/grouping/getGrouping.es.js";
@@ -131,6 +135,12 @@ import "../../../context/DeleteEntitiesContext.es.js";
 import "../../../context/GlobalContext.es.js";
 import "../context/ProjectDataContextInstance.es.js";
 import { READ_ONLY as S } from "../utils/restrictedEntity.es.js";
+import "../../Slicer/context/SlicerContextInstance.es.js";
+import "../../../context/RemoteModulesContext.es.js";
+import "../../../../../_virtual/runtime.es.js";
+import "../../../../../_virtual/semver.es.js";
+import "../../../context/PowerpackContextInstance.es.js";
+import "../../Slicer/components/SlicerDropdownFallback.es.js";
 import "../../../context/ProjectFoldersContextInstance.es.js";
 import "../buildTreeTableColumns.es.js";
 const j = i(C)`
@@ -161,7 +171,7 @@ const j = i(C)`
   ${s}:hover & {
     opacity: 1;
   }
-`, v = "entity-widget", oi = ({
+`, v = "entity-widget", li = ({
   rowId: a,
   columnId: c,
   value: l,
@@ -193,6 +203,6 @@ const j = i(C)`
 };
 export {
   v as ENTITY_WIDGET_CLASS,
-  oi as EntityWidget
+  li as EntityWidget
 };
 //# sourceMappingURL=EntityWidget.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"EntityWidget.es.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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAMA,IAAaC,EAAOC,CAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAaxCC,IAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAatBG,IAAWH,EAAOI,CAAI;AAAA;AAAA;AAAA,IAGxBF,CAAY;AAAA;AAAA;AAAA,GAKHG,IAAsB,iBAatBC,KAAsC,CAAC;AAAA,EAClD,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AACF,MAAM;AACJ,QAAMC,IAAgBC,EAAWC,CAAyB,GACpDC,IAAsBC,EAAA,GAEtBC,IAAa,CAACC,MAA4C;AAC9D,IAAIA,EAAM,WAAW,KAAK,CAACX,KAAY,CAACK,MAIxCG,GAAqB,mBAAA,GACrBH,EAAc,kBAAkB,EAAE,UAAAL,GAAU,YAAAC,EAAA,CAAY,GACxDU,EAAM,eAAA;AAAA,EACR,GAEMC,IAAqD,CAACD,MAAU;AACpE,IAAIA,EAAM,WAAW,KAAGD,EAAWC,CAAK;AAAA,EAC1C;AAEA,SACEE,gBAAAA,EAAAA;AAAAA,IAACxB;AAAA,IAAA;AAAA,MACC,IAAI,GAAGQ,CAAK,IAAIC,CAAQ;AAAA,MACxB,WAAWgB,EAAKnB,GAAqBoB,GAAWZ,GAAW,EAAE,SAASC,GAAW;AAAA,MACjF,aAAaQ;AAAA,MACb,sBAAoB;AAAA,MAEpB,UAAAI,gBAAAA,EAAAA,KAACxB,GAAA,EAAa,aAAakB,GACxB,UAAA;AAAA,QAAAR,2BAAYe,GAAA,EAAW,QAAQ,EAAE,YAAAhB,GAAY,SAAAC,KAAW;AAAA,QACxD,OAAOH,KAAS,EAAE;AAAA,QACnBc,gBAAAA,EAAAA,IAACpB,GAAA,EAAS,MAAK,eAAA,CAAe;AAAA,MAAA,EAAA,CAChC;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"EntityWidget.es.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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAMA,IAAaC,EAAOC,CAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAaxCC,IAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAatBG,IAAWH,EAAOI,CAAI;AAAA;AAAA;AAAA,IAGxBF,CAAY;AAAA;AAAA;AAAA,GAKHG,IAAsB,iBAatBC,KAAsC,CAAC;AAAA,EAClD,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AACF,MAAM;AACJ,QAAMC,IAAgBC,EAAWC,CAAyB,GACpDC,IAAsBC,EAAA,GAEtBC,IAAa,CAACC,MAA4C;AAC9D,IAAIA,EAAM,WAAW,KAAK,CAACX,KAAY,CAACK,MAIxCG,GAAqB,mBAAA,GACrBH,EAAc,kBAAkB,EAAE,UAAAL,GAAU,YAAAC,EAAA,CAAY,GACxDU,EAAM,eAAA;AAAA,EACR,GAEMC,IAAqD,CAACD,MAAU;AACpE,IAAIA,EAAM,WAAW,KAAGD,EAAWC,CAAK;AAAA,EAC1C;AAEA,SACEE,gBAAAA,EAAAA;AAAAA,IAACxB;AAAA,IAAA;AAAA,MACC,IAAI,GAAGQ,CAAK,IAAIC,CAAQ;AAAA,MACxB,WAAWgB,EAAKnB,GAAqBoB,GAAWZ,GAAW,EAAE,SAASC,GAAW;AAAA,MACjF,aAAaQ;AAAA,MACb,sBAAoB;AAAA,MAEpB,UAAAI,gBAAAA,EAAAA,KAACxB,GAAA,EAAa,aAAakB,GACxB,UAAA;AAAA,QAAAR,2BAAYe,GAAA,EAAW,QAAQ,EAAE,YAAAhB,GAAY,SAAAC,KAAW;AAAA,QACxD,OAAOH,KAAS,EAAE;AAAA,QACnBc,gBAAAA,EAAAA,IAACpB,GAAA,EAAS,MAAK,eAAA,CAAe;AAAA,MAAA,EAAA,CAChC;AAAA,IAAA;AAAA,EAAA;AAGN;"}

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

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("../../../../../_virtual/jsx-runtime.cjs.js"),b=require("@ynput/ayon-react-components"),v=require("clsx"),c=require("react"),C=require("styled-components"),x=require("./EnumCellValue.cjs.js"),A=require("./wrapMode.cjs.js"),V=C(b.Dropdown)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("../../../../../_virtual/jsx-runtime.cjs.js"),C=require("@ynput/ayon-react-components"),v=require("clsx"),i=require("react"),A=require("styled-components"),x=require("./EnumCellValue.cjs.js"),V=require("./wrapMode.cjs.js"),D=require("../../../util/attributeEnum.cjs.js"),I=A(C.Dropdown)`
   height: 100%;
   width: 100%;
 
   /* the value template clips against the button, so it has to grow with the cell */
-  ${({$multiSelect:f})=>f&&A.wrapMode`
+  ${({$multiSelect:p})=>p&&V.wrapMode`
       .button {
         height: 100%;
       }
     `}
-`,D=c.forwardRef(({value:f,isEditing:p,options:u,type:E,autoOpen:S=!0,isReadOnly:o,enableCustomValues:m,onOpen:T,onChange:j,onCancelEdit:q,onNext:_,pt:l,...s},k)=>{const h=f.map(t=>t?.toString()).filter(t=>!!t);let r=u.filter(t=>h.includes(t.value.toString()));const O=[];h.forEach(t=>{if(!u.find(e=>e.value===t)){const e={label:t,value:t,color:m?"var(--md-sys-color-surface-container)":"var(--md-sys-color-error)",icon:m?void 0:"warning"};r=[...r,e],O.push(e)}});const y=r.length>1,g=[...u,...O],n=c.useRef(null),[w,N]=c.useState(!1);c.useEffect(()=>{p&&n.current&&S?(!n.current.isOpen&&n.current?.open(),N(!0)):N(!1)},[p,n.current,S]),c.useEffect(()=>{if(w&&!s.search&&g.length<20){const e=n.current?.getOptions()?.querySelector("li");e&&(e.focus(),e.style.outline="none")}},[w,s.search,g.length]);const a=!!E?.includes("list"),M=t=>{let e=m?t:t.filter(i=>u.find(R=>R.value===i));E?.includes("list")||(e=Array.isArray(e)?e[0]:e),j(e,"Click")};return p?d.jsxRuntimeExports.jsx(V,{options:g,value:h,ref:n,valueTemplate:(t,e,i)=>d.jsxRuntimeExports.jsx(x.EnumCellValue,{selectedOptions:r,hasMultipleValues:e.length>1,isOpen:i,isReadOnly:o,isMultiSelect:a,...l?.template,placeholder:s.placeholder,className:v("enum-dropdown-value",l?.template?.className)}),itemTemplate:(t,e,i)=>d.jsxRuntimeExports.jsx(x.EnumCellValue,{selectedOptions:[t],hasMultipleValues:!1,isOpen:!1,isItem:!0,isMultiSelect:a,isSelected:i,...l?.template,className:v("enum-dropdown-item",l?.template?.className)}),widthExpand:!0,multiSelect:a,disableOpen:o,disabled:o,sortBySelected:!0,searchOnNumber:10,...s,$multiSelect:a,onChange:M,onClose:q,editable:m}):d.jsxRuntimeExports.jsx(x.EnumCellValue,{selectedOptions:r,hasMultipleValues:y,isMultiSelect:a,isReadOnly:o,...l?.template,placeholder:s.placeholder,className:v("enum-value",l?.template?.className,s.className)})});exports.EnumWidget=D;
+`,T=i.forwardRef(({value:p,isEditing:h,options:c,type:E,autoOpen:S=!0,isReadOnly:o,enableCustomValues:m,isLoadingOptions:j,onOpen:_,onChange:q,onCancelEdit:b,onNext:k,pt:l,...s},U)=>{const f=p.map(t=>t?.toString()).filter(t=>!!t);let r=c.filter(t=>f.includes(t.value.toString()));const w=[];f.forEach(t=>{if(!c.find(e=>e.value===t)){const e={label:t,value:t,color:m||j?"var(--md-sys-color-surface-container)":"var(--md-sys-color-error)",icon:m||j?void 0:"warning"};r=[...r,e],w.push(e)}});const y=r.length>1,g=[...D.getSelectableEnumItems(c,f),...w],n=i.useRef(null),[N,O]=i.useState(!1);i.useEffect(()=>{h&&n.current&&S?(!n.current.isOpen&&n.current?.open(),O(!0)):O(!1)},[h,n.current,S]),i.useEffect(()=>{if(N&&!s.search&&g.length<20){const e=n.current?.getOptions()?.querySelector("li");e&&(e.focus(),e.style.outline="none")}},[N,s.search,g.length]);const a=!!E?.includes("list"),M=t=>{let e=m?t:t.filter(u=>c.find(R=>R.value===u));E?.includes("list")||(e=Array.isArray(e)?e[0]:e),q(e,"Click")};return h?d.jsxRuntimeExports.jsx(I,{options:g,value:f,ref:n,valueTemplate:(t,e,u)=>d.jsxRuntimeExports.jsx(x.EnumCellValue,{selectedOptions:r,hasMultipleValues:e.length>1,isOpen:u,isReadOnly:o,isMultiSelect:a,...l?.template,placeholder:s.placeholder,className:v("enum-dropdown-value",l?.template?.className)}),itemTemplate:(t,e,u)=>d.jsxRuntimeExports.jsx(x.EnumCellValue,{selectedOptions:[t],hasMultipleValues:!1,isOpen:!1,isItem:!0,isMultiSelect:a,isSelected:u,...l?.template,className:v("enum-dropdown-item",l?.template?.className)}),widthExpand:!0,multiSelect:a,disableOpen:o,disabled:o,sortBySelected:!0,searchOnNumber:10,...s,$multiSelect:a,onChange:M,onClose:b,editable:m}):d.jsxRuntimeExports.jsx(x.EnumCellValue,{selectedOptions:r,hasMultipleValues:y,isMultiSelect:a,isReadOnly:o,...l?.template,placeholder:s.placeholder,className:v("enum-value",l?.template?.className,s.className)})});exports.EnumWidget=T;
 //# sourceMappingURL=EnumWidget.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"EnumWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumWidget.tsx"],"sourcesContent":["import { Dropdown, DropdownProps, DropdownRef } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport type { WidgetBaseProps } from './CellWidget'\nimport { EnumCellValue, EnumTemplateProps } from './EnumCellValue'\nimport type { AttributeData, EnumItem } from '@shared/api'\nimport { wrapMode } from './wrapMode'\n\nconst StyledDropdown = styled(Dropdown)<{ $multiSelect?: boolean }>`\n  height: 100%;\n  width: 100%;\n\n  /* the value template clips against the button, so it has to grow with the cell */\n  ${({ $multiSelect }) =>\n    $multiSelect &&\n    wrapMode`\n      .button {\n        height: 100%;\n      }\n    `}\n`\n\nexport interface EnumWidgetProps\n  extends Omit<DropdownProps, 'onChange' | 'value' | 'pt'>,\n    WidgetBaseProps {\n  value: (string | number | boolean)[]\n  options: EnumItem[]\n  type?: AttributeData['type']\n  autoOpen?: boolean\n  isReadOnly?: boolean\n  enableCustomValues?: boolean\n  pt?: {\n    template?: Partial<EnumTemplateProps>\n  }\n  onOpen?: () => void\n  onNext?: () => void\n}\n\nexport const EnumWidget = forwardRef<HTMLDivElement, EnumWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      options,\n      type,\n      autoOpen = true,\n      isReadOnly,\n      enableCustomValues,\n      onOpen,\n      onChange,\n      onCancelEdit,\n      onNext,\n      pt,\n      ...dropdownProps\n    },\n    _ref,\n  ) => {\n    // convert value to string array\n    const valueAsStrings = value.map((v) => v?.toString()).filter((v) => !!v)\n    let selectedOptions = options.filter((option) =>\n      valueAsStrings.includes(option.value.toString()),\n    )\n\n    // Check if all values are present in options, if not, add a warning\n    const invalidOptions: EnumItem[] = []\n    valueAsStrings.forEach((val) => {\n      if (!options.find((option) => option.value === val)) {\n        const invalidOption = {\n          label: val,\n          value: val,\n          color: enableCustomValues\n            ? 'var(--md-sys-color-surface-container)'\n            : 'var(--md-sys-color-error)',\n          icon: enableCustomValues ? undefined : 'warning',\n        }\n        selectedOptions = [...selectedOptions, invalidOption]\n        invalidOptions.push(invalidOption)\n      }\n    })\n    const hasMultipleValues = selectedOptions.length > 1\n\n    // Merge valid options with invalid options for the dropdown\n    const allOptions = [...options, ...invalidOptions]\n\n    const dropdownRef = useRef<DropdownRef>(null)\n\n    const [dropdownOpen, setDropdownOpen] = useState(false)\n    useEffect(() => {\n      if (isEditing && dropdownRef.current && autoOpen) {\n        !dropdownRef.current.isOpen && dropdownRef.current?.open()\n        setDropdownOpen(true)\n      } else {\n        setDropdownOpen(false)\n      }\n    }, [isEditing, dropdownRef.current, autoOpen])\n\n    // when the dropdown is open, focus the first item\n    useEffect(() => {\n      if (dropdownOpen && !dropdownProps.search && allOptions.length < 20) {\n        const optionsUlEl = dropdownRef.current?.getOptions() as HTMLUListElement\n        const firstItem = optionsUlEl?.querySelector('li')\n        if (firstItem) {\n          firstItem.focus()\n          // set style of li to have no outline (no focus ring)\n          firstItem.style.outline = 'none'\n        }\n      }\n    }, [dropdownOpen, dropdownProps.search, allOptions.length])\n\n    const isMultiSelect = !!type?.includes('list')\n\n    const handleChange = (newValue: string[]) => {\n      let filteredValue: string | string[] = enableCustomValues\n        ? newValue\n        : newValue.filter((v) => options.find((o) => o.value === v))\n\n      if (type?.includes('list')) {\n        onChange(filteredValue, 'Click')\n      } else {\n        // check if the value is an array or a string and for arrays take the first value only\n        filteredValue = Array.isArray(filteredValue) ? filteredValue[0] : filteredValue\n\n        // take first value as the type is not list]\n        onChange(filteredValue, 'Click')\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <StyledDropdown\n          options={allOptions}\n          value={valueAsStrings}\n          ref={dropdownRef}\n          valueTemplate={(_value, selected, isOpen) => (\n            <EnumCellValue\n              selectedOptions={selectedOptions}\n              hasMultipleValues={selected.length > 1}\n              isOpen={isOpen}\n              isReadOnly={isReadOnly}\n              isMultiSelect={isMultiSelect}\n              {...pt?.template}\n              placeholder={dropdownProps.placeholder}\n              className={clsx('enum-dropdown-value', pt?.template?.className)}\n            />\n          )}\n          itemTemplate={(option, _isActive, isSelected) => (\n            <EnumCellValue\n              selectedOptions={[option]}\n              hasMultipleValues={false}\n              isOpen={false}\n              isItem\n              isMultiSelect={isMultiSelect}\n              isSelected={isSelected}\n              {...pt?.template}\n              className={clsx('enum-dropdown-item', pt?.template?.className)}\n            />\n          )}\n          widthExpand\n          multiSelect={isMultiSelect}\n          disableOpen={isReadOnly}\n          disabled={isReadOnly}\n          sortBySelected\n          searchOnNumber={10}\n          {...dropdownProps}\n          $multiSelect={isMultiSelect}\n          onChange={handleChange}\n          onClose={onCancelEdit}\n          editable={enableCustomValues}\n        />\n      )\n    }\n\n    return (\n      <EnumCellValue\n        selectedOptions={selectedOptions}\n        hasMultipleValues={hasMultipleValues}\n        isMultiSelect={isMultiSelect}\n        isReadOnly={isReadOnly}\n        {...pt?.template}\n        placeholder={dropdownProps.placeholder}\n        className={clsx('enum-value', pt?.template?.className, dropdownProps.className)}\n      />\n    )\n  },\n)\n"],"names":["StyledDropdown","styled","Dropdown","$multiSelect","wrapMode","EnumWidget","forwardRef","value","isEditing","options","type","autoOpen","isReadOnly","enableCustomValues","onOpen","onChange","onCancelEdit","onNext","pt","dropdownProps","_ref","valueAsStrings","v","selectedOptions","option","invalidOptions","val","invalidOption","hasMultipleValues","allOptions","dropdownRef","useRef","dropdownOpen","setDropdownOpen","useState","useEffect","firstItem","isMultiSelect","handleChange","newValue","filteredValue","o","jsx","_value","selected","isOpen","EnumCellValue","clsx","_isActive","isSelected"],"mappings":"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"}
+{"version":3,"file":"EnumWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumWidget.tsx"],"sourcesContent":["import { Dropdown, DropdownProps, DropdownRef } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport type { WidgetBaseProps } from './CellWidget'\nimport { EnumCellValue, EnumTemplateProps } from './EnumCellValue'\nimport type { AttributeData, EnumItem } from '@shared/api'\nimport { wrapMode } from './wrapMode'\nimport { getSelectableEnumItems } from '@shared/util/attributeEnum'\n\nconst StyledDropdown = styled(Dropdown)<{ $multiSelect?: boolean }>`\n  height: 100%;\n  width: 100%;\n\n  /* the value template clips against the button, so it has to grow with the cell */\n  ${({ $multiSelect }) =>\n    $multiSelect &&\n    wrapMode`\n      .button {\n        height: 100%;\n      }\n    `}\n`\n\nexport interface EnumWidgetProps\n  extends Omit<DropdownProps, 'onChange' | 'value' | 'pt'>,\n    WidgetBaseProps {\n  value: (string | number | boolean)[]\n  options: EnumItem[]\n  type?: AttributeData['type']\n  autoOpen?: boolean\n  isReadOnly?: boolean\n  enableCustomValues?: boolean\n  isLoadingOptions?: boolean\n  pt?: {\n    template?: Partial<EnumTemplateProps>\n  }\n  onOpen?: () => void\n  onNext?: () => void\n}\n\nexport const EnumWidget = forwardRef<HTMLDivElement, EnumWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      options,\n      type,\n      autoOpen = true,\n      isReadOnly,\n      enableCustomValues,\n      isLoadingOptions,\n      onOpen,\n      onChange,\n      onCancelEdit,\n      onNext,\n      pt,\n      ...dropdownProps\n    },\n    _ref,\n  ) => {\n    // convert value to string array\n    const valueAsStrings = value.map((v) => v?.toString()).filter((v) => !!v)\n    let selectedOptions = options.filter((option) =>\n      valueAsStrings.includes(option.value.toString()),\n    )\n\n    // Check if all values are present in options, if not, add a warning\n    const invalidOptions: EnumItem[] = []\n    valueAsStrings.forEach((val) => {\n      if (!options.find((option) => option.value === val)) {\n        const invalidOption = {\n          label: val,\n          value: val,\n          // options that are still loading cannot be validated against yet\n          color:\n            enableCustomValues || isLoadingOptions\n              ? 'var(--md-sys-color-surface-container)'\n              : 'var(--md-sys-color-error)',\n          icon: enableCustomValues || isLoadingOptions ? undefined : 'warning',\n        }\n        selectedOptions = [...selectedOptions, invalidOption]\n        invalidOptions.push(invalidOption)\n      }\n    })\n    const hasMultipleValues = selectedOptions.length > 1\n\n    // Merge valid options with invalid options for the dropdown\n    const allOptions = [...getSelectableEnumItems(options, valueAsStrings), ...invalidOptions]\n\n    const dropdownRef = useRef<DropdownRef>(null)\n\n    const [dropdownOpen, setDropdownOpen] = useState(false)\n    useEffect(() => {\n      if (isEditing && dropdownRef.current && autoOpen) {\n        !dropdownRef.current.isOpen && dropdownRef.current?.open()\n        setDropdownOpen(true)\n      } else {\n        setDropdownOpen(false)\n      }\n    }, [isEditing, dropdownRef.current, autoOpen])\n\n    // when the dropdown is open, focus the first item\n    useEffect(() => {\n      if (dropdownOpen && !dropdownProps.search && allOptions.length < 20) {\n        const optionsUlEl = dropdownRef.current?.getOptions() as HTMLUListElement\n        const firstItem = optionsUlEl?.querySelector('li')\n        if (firstItem) {\n          firstItem.focus()\n          // set style of li to have no outline (no focus ring)\n          firstItem.style.outline = 'none'\n        }\n      }\n    }, [dropdownOpen, dropdownProps.search, allOptions.length])\n\n    const isMultiSelect = !!type?.includes('list')\n\n    const handleChange = (newValue: string[]) => {\n      let filteredValue: string | string[] = enableCustomValues\n        ? newValue\n        : newValue.filter((v) => options.find((o) => o.value === v))\n\n      if (type?.includes('list')) {\n        onChange(filteredValue, 'Click')\n      } else {\n        // check if the value is an array or a string and for arrays take the first value only\n        filteredValue = Array.isArray(filteredValue) ? filteredValue[0] : filteredValue\n\n        // take first value as the type is not list]\n        onChange(filteredValue, 'Click')\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <StyledDropdown\n          options={allOptions}\n          value={valueAsStrings}\n          ref={dropdownRef}\n          valueTemplate={(_value, selected, isOpen) => (\n            <EnumCellValue\n              selectedOptions={selectedOptions}\n              hasMultipleValues={selected.length > 1}\n              isOpen={isOpen}\n              isReadOnly={isReadOnly}\n              isMultiSelect={isMultiSelect}\n              {...pt?.template}\n              placeholder={dropdownProps.placeholder}\n              className={clsx('enum-dropdown-value', pt?.template?.className)}\n            />\n          )}\n          itemTemplate={(option, _isActive, isSelected) => (\n            <EnumCellValue\n              selectedOptions={[option]}\n              hasMultipleValues={false}\n              isOpen={false}\n              isItem\n              isMultiSelect={isMultiSelect}\n              isSelected={isSelected}\n              {...pt?.template}\n              className={clsx('enum-dropdown-item', pt?.template?.className)}\n            />\n          )}\n          widthExpand\n          multiSelect={isMultiSelect}\n          disableOpen={isReadOnly}\n          disabled={isReadOnly}\n          sortBySelected\n          searchOnNumber={10}\n          {...dropdownProps}\n          $multiSelect={isMultiSelect}\n          onChange={handleChange}\n          onClose={onCancelEdit}\n          editable={enableCustomValues}\n        />\n      )\n    }\n\n    return (\n      <EnumCellValue\n        selectedOptions={selectedOptions}\n        hasMultipleValues={hasMultipleValues}\n        isMultiSelect={isMultiSelect}\n        isReadOnly={isReadOnly}\n        {...pt?.template}\n        placeholder={dropdownProps.placeholder}\n        className={clsx('enum-value', pt?.template?.className, dropdownProps.className)}\n      />\n    )\n  },\n)\n"],"names":["StyledDropdown","styled","Dropdown","$multiSelect","wrapMode","EnumWidget","forwardRef","value","isEditing","options","type","autoOpen","isReadOnly","enableCustomValues","isLoadingOptions","onOpen","onChange","onCancelEdit","onNext","pt","dropdownProps","_ref","valueAsStrings","v","selectedOptions","option","invalidOptions","val","invalidOption","hasMultipleValues","allOptions","getSelectableEnumItems","dropdownRef","useRef","dropdownOpen","setDropdownOpen","useState","useEffect","firstItem","isMultiSelect","handleChange","newValue","filteredValue","o","jsx","_value","selected","isOpen","EnumCellValue","clsx","_isActive","isSelected"],"mappings":"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"}