@ynput/ayon-frontend-shared 0.2.35 → 0.2.36

package/dist/shared/src/containers/ProjectTreeTable/ProjectTreeTable.styled.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("styled-components"),s="inset 0 1px 0 0 var(--md-sys-color-primary)",a="inset -1px 0 0 0 var(--md-sys-color-primary)",r="inset 0 -1px 0 0 var(--md-sys-color-primary)",n="inset 1px 0 0 0 var(--md-sys-color-primary)",e=o=>o?"inset -2px -1px 0 0 var(--md-sys-color-surface-container), inset 1px 0 0 0 var(--md-sys-color-surface-container)":"inset 1px -1px 0 0 var(--md-sys-color-surface-container)",i="drag-handle",d=t.tr`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("styled-components"),a="inset 0 1px 0 0 var(--md-sys-color-primary)",s="inset -1px 0 0 0 var(--md-sys-color-primary)",r="inset 0 -1px 0 0 var(--md-sys-color-primary)",n="inset 1px 0 0 0 var(--md-sys-color-primary)",e=o=>o?"inset -2px -1px 0 0 var(--md-sys-color-surface-container), inset 1px 0 0 0 var(--md-sys-color-surface-container)":"inset 1px -1px 0 0 var(--md-sys-color-surface-container)",i="drag-handle",d=t.tr`
   display: flex;
   position: absolute;
   width: 100%;
@@ -21,7 +21,7 @@
 
     /* row selection hover */
     td:not(.selected) {
-      background-color: hsl(215 14% 15%);
+      background-color: var(--color-table-row-hover);
     }
   }
 
@@ -51,12 +51,8 @@
     margin: 0px 5px;
     padding: 0 !important;
     width: calc(100% - 10px);
-    height: 28px;
+    height: calc(100% - 6px);
     margin-top: 3px;
-
-    &:not(.hierarchy) {
-      height: 32px;
-    }
   }
 
   &:focus-visible {
@@ -91,16 +87,17 @@
   display: flex;
   align-items: center;
   min-height: fit-content;
+  white-space: nowrap;
 
   &:hover {
     .resize-handle {
       opacity: 1;
     }
-    
+
     .actions {
       display: flex !important;
     }
-    
+
     .actions .header-menu {
       display: flex !important;
     }
@@ -133,7 +130,7 @@
       display: none;
     }
   }
-`,u=t.div`
+`,b=t.div`
   display: none;
 
   ${({$isOpen:o})=>o&&`
@@ -163,7 +160,7 @@
   .sort-button.visible {
     display: flex !important;
   }
-  
+
   .sort-button.selected {
     display: flex !important;
   }
@@ -171,19 +168,19 @@
   .header-menu {
     display: none;
   }
-  
+
   ${({$isOpen:o})=>o&&`
     .header-menu {
       display: flex !important;
     }
   `}
-  
+
   .header-menu.open,
   .header-menu.active {
     display: flex !important;
   }
 
-   .resizing & {
+  .resizing & {
     .sort-button,
     .header-menu {
       display: none !important;
@@ -192,7 +189,7 @@
 `,w=t.td`
   position: relative;
   box-shadow: ${e(!1)};
-  background-color: var(--md-sys-color-surface-container-low);
+  background-color: var(--color-table-row);
 
   &.${i} {
     // Styles for the button inside the drag handle cell
@@ -215,29 +212,29 @@
     }
   }
 
-  --task-background-color: hsl(216 15% 11.5% / 1);
-  &.task {
-    background-color: var(--task-background-color);
+  /* Lighter background for expandable rows */
+  &.expandable {
+    background-color: var(--color-table-row-high);
   }
 
   &.selected-row {
-    background-color: var(--md-sys-color-surface-container-high);
+    background-color: var(--color-table-selected-row);
   }
 
   /* show hover effect only if direct child div does NOT have .readonly and is not selected */
   &:not(:has(> div.readonly)) {
     cursor: pointer;
     &:hover {
-      background-color: var(--md-sys-color-surface-container);
+      background-color: var(--color-table-hover);
     }
 
     &.selected {
-      background-color: var(--md-sys-color-secondary-container);
+      background-color: var(--color-table-selected);
     }
   }
 
   &.selected {
-    background-color: var(--md-sys-color-secondary-container);
+    background-color: var(--color-table-selected);
     position: relative;
     z-index: 1;
   }
@@ -256,11 +253,11 @@
 
   /* Shadow combinations - single side */
   &.shadow-top:not(.shadow-right):not(.shadow-bottom):not(.shadow-left) {
-    box-shadow: ${s}, ${({$isLastPinned:o})=>e(o||!1)};
+    box-shadow: ${a}, ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-right:not(.shadow-top):not(.shadow-bottom):not(.shadow-left) {
-    box-shadow: ${a}, ${({$isLastPinned:o})=>e(o||!1)};
+    box-shadow: ${s}, ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-bottom:not(.shadow-top):not(.shadow-right):not(.shadow-left) {
@@ -273,27 +270,27 @@
 
   /* Two sides */
   &.shadow-top.shadow-right:not(.shadow-bottom):not(.shadow-left) {
-    box-shadow: ${s}, ${a},
+    box-shadow: ${a}, ${s},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-top.shadow-bottom:not(.shadow-right):not(.shadow-left) {
-    box-shadow: ${s}, ${r},
+    box-shadow: ${a}, ${r},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-top.shadow-left:not(.shadow-right):not(.shadow-bottom) {
-    box-shadow: ${s}, ${n},
+    box-shadow: ${a}, ${n},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-right.shadow-bottom:not(.shadow-top):not(.shadow-left) {
-    box-shadow: ${a}, ${r},
+    box-shadow: ${s}, ${r},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-right.shadow-left:not(.shadow-top):not(.shadow-bottom) {
-    box-shadow: ${a}, ${n},
+    box-shadow: ${s}, ${n},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
@@ -304,28 +301,28 @@
 
   /* Three sides */
   &.shadow-top.shadow-right.shadow-bottom:not(.shadow-left) {
-    box-shadow: ${s}, ${a}, ${r},
+    box-shadow: ${a}, ${s}, ${r},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-top.shadow-right.shadow-left:not(.shadow-bottom) {
-    box-shadow: ${s}, ${a}, ${n},
+    box-shadow: ${a}, ${s}, ${n},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-top.shadow-bottom.shadow-left:not(.shadow-right) {
-    box-shadow: ${s}, ${r}, ${n},
+    box-shadow: ${a}, ${r}, ${n},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   &.shadow-right.shadow-bottom.shadow-left:not(.shadow-top) {
-    box-shadow: ${a}, ${r}, ${n},
+    box-shadow: ${s}, ${r}, ${n},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
   /* All four sides */
   &.shadow-top.shadow-right.shadow-bottom.shadow-left {
-    box-shadow: ${s}, ${a}, ${r}, ${n},
+    box-shadow: ${a}, ${s}, ${r}, ${n},
       ${({$isLastPinned:o})=>e(o||!1)};
   }
 
@@ -350,11 +347,10 @@
   /* read only fields are dimmed down for bg and border */
   &:has(> div.readonly) {
     &:not(.multiple-selected) {
-      --focused-readonly-color: hsl(212 15% 18% / 1);
       &.focused {
-        background-color: var(--focused-readonly-color);
+        background-color: var(--color-table-readonly-focused);
         &::after {
-          border-color: var(--focused-readonly-color);
+          border-color: var(--color-table-readonly-focused);
         }
       }
     }
@@ -369,7 +365,7 @@
 
   /* if there is no cell widget element (no children) then the cell should not be selectable at all */
   &:not(:has(> div)) {
-    pointer-events: none;
+    /* pointer-events: none; */
     cursor: default;
   }
 
@@ -398,7 +394,7 @@
       }
     }
   }
-`,b=t.thead`
+`,u=t.thead`
   display: grid !important;
   position: sticky;
   top: 0;
@@ -409,14 +405,14 @@
   .resizing & {
     cursor: col-resize !important;
   }
-`,f=t.div`
+`,m=t.div`
   overflow: hidden;
   position: absolute;
   inset: 0;
   border-radius: var(--border-radius-m);
 
   background-color: var(--md-sys-color-surface-container-low);
-`,m=t.div`
+`,f=t.div`
   display: flex;
 
   height: 100%;
@@ -464,5 +460,18 @@
     font-size: 18px;
     color: var(--md-sys-color-outline);
   }
-`;exports.ColumnHeader=h;exports.HeaderButtons=u;exports.HeaderCell=p;exports.LinkColumnHeader=g;exports.ResizedHandler=c;exports.TR=d;exports.TableCell=w;exports.TableCellContent=l;exports.TableContainer=m;exports.TableHeader=b;exports.TableWrapper=f;
+`,y=t.div`
+  animation: fadeIn 20ms ease-in forwards;
+  animation-delay: 300ms;
+  opacity: 0;
+
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+`;exports.AnimatedEmptyPlaceholder=y;exports.ColumnHeader=h;exports.HeaderButtons=b;exports.HeaderCell=p;exports.LinkColumnHeader=g;exports.ResizedHandler=c;exports.TR=d;exports.TableCell=w;exports.TableCellContent=l;exports.TableContainer=f;exports.TableHeader=u;exports.TableWrapper=m;
 //# sourceMappingURL=ProjectTreeTable.styled.cjs.js.map

package/dist/shared/src/containers/ProjectTreeTable/ProjectTreeTable.styled.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProjectTreeTable.styled.cjs.js","sources":["../../../../../src/containers/ProjectTreeTable/ProjectTreeTable.styled.ts"],"sourcesContent":["import styled from 'styled-components'\n\n// Create shadow mixins to make combinations work properly\nconst topShadow = `inset 0 1px 0 0 var(--md-sys-color-primary)`\nconst rightShadow = `inset -1px 0 0 0 var(--md-sys-color-primary)`\nconst bottomShadow = `inset 0 -1px 0 0 var(--md-sys-color-primary)`\nconst leftShadow = `inset 1px 0 0 0 var(--md-sys-color-primary)`\n\nconst getDefaultShadow = (isLastPinned: boolean) => {\n  const defaultShadow = `inset 1px -1px 0 0 var(--md-sys-color-surface-container)`\n  const defaultShadowLastPinned = `inset -2px -1px 0 0 var(--md-sys-color-surface-container), inset 1px 0 0 0 var(--md-sys-color-surface-container)`\n  return isLastPinned ? defaultShadowLastPinned : defaultShadow\n}\n\n// Use the known string literal for DRAG_HANDLE_COLUMN_ID to avoid import complexities here\nconst DRAG_HANDLE_CLASS = 'drag-handle'\n\nexport const TR = styled.tr`\n  display: flex;\n  position: absolute;\n  width: 100%;\n\n  &:hover {\n    // When the row (TR) is hovered...\n\n    // Target the button inside the drag handle cell to make it visible at 50% opacity.\n    // This uses a more specific selector by including 'td' to ensure it correctly targets the cell.\n    td.${DRAG_HANDLE_CLASS} button {\n      opacity: 0.5;\n      visibility: visible;\n    }\n\n    // When the row (TR) is hovered AND the button inside drag handle cell is also hovered...\n    // Make the button 100% opacity. This selector is more specific and will override the above.\n    td.${DRAG_HANDLE_CLASS} button:hover {\n      opacity: 1;\n    }\n\n    /* row selection hover */\n    td:not(.selected) {\n      background-color: hsl(215 14% 15%);\n    }\n  }\n\n  &.group-row {\n    td {\n      /* group headers do not have vertical grid lines */\n      box-shadow: inset 0px -1px 0 0 var(--md-sys-color-surface-container);\n    }\n  }\n`\n\nexport const TableCellContent = styled.div`\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  height: 100%;\n  width: 100%;\n  padding: 0px 8px;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n  user-select: none;\n  padding-right: 0;\n\n  &.bold {\n    font-weight: 600;\n  }\n\n  &.loading {\n    margin: 0px 5px;\n    padding: 0 !important;\n    width: calc(100% - 10px);\n    height: 28px;\n    margin-top: 3px;\n\n    &:not(.hierarchy) {\n      height: 32px;\n    }\n  }\n\n  &:focus-visible {\n    outline: none;\n  }\n\n  .resizing & {\n    cursor: col-resize !important;\n  }\n`\n\nexport const ResizedHandler = styled.div`\n  position: absolute;\n  right: -1px;\n  top: 0;\n  bottom: 0;\n  width: 6px;\n  cursor: col-resize !important;\n  background-color: var(--md-sys-color-surface-container-high);\n\n  opacity: 0;\n\n  &.resizing {\n    background-color: var(--md-sys-color-primary);\n    opacity: 1;\n    cursor: col-resize !important;\n  }\n`\n\nexport const ColumnHeader = styled.tr`\n  background-color: var(--md-sys-color-surface-container-low);\n`\n\nexport const HeaderCell = styled.th`\n  position: relative;\n  background-color: var(--md-sys-color-surface-container-lowest);\n  box-shadow: inset 1px -1px 0 0 var(--md-sys-color-surface-container);\n  display: flex;\n  align-items: center;\n  min-height: fit-content;\n\n  &:hover {\n    .resize-handle {\n      opacity: 1;\n    }\n    \n    .actions {\n      display: flex !important;\n    }\n    \n    .actions .header-menu {\n      display: flex !important;\n    }\n  }\n\n  /* Hide action buttons when resizing */\n  &.resizing {\n    .actions {\n      display: none !important;\n    }\n    cursor: col-resize !important;\n\n    * {\n      cursor: col-resize !important;\n    }\n  }\n\n  /* Styling for the last pinned left column */\n  &.last-pinned-left {\n    box-shadow: inset 1px -1px 0 0 var(--md-sys-color-surface-container),\n      inset -2px 0 0 0 var(--md-sys-color-surface-container);\n  }\n\n  /* special styles for the left selection column */\n  &.__row_selection__ {\n    min-width: unset;\n    width: 20px !important;\n\n    .actions {\n      display: none;\n    }\n  }\n`\n\nexport const HeaderButtons = styled.div<{ $isOpen: boolean }>`\n  display: none;\n\n  ${({ $isOpen }) =>\n    $isOpen &&\n    `\n    display: flex !important;\n  `}\n\n  gap: var(--base-gap-small);\n  align-items: center;\n\n  position: absolute;\n  z-index: 10;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  background-color: var(--md-sys-color-surface-container-lowest);\n  padding-left: 4px;\n\n  .resizing & {\n    cursor: col-resize !important;\n  }\n\n  &:has(.sort-button.visible),\n  &:has(.sort-button.selected) {\n    display: flex !important;\n  }\n\n  .sort-button.visible {\n    display: flex !important;\n  }\n  \n  .sort-button.selected {\n    display: flex !important;\n  }\n\n  .header-menu {\n    display: none;\n  }\n  \n  ${({ $isOpen }) =>\n    $isOpen &&\n    `\n    .header-menu {\n      display: flex !important;\n    }\n  `}\n  \n  .header-menu.open,\n  .header-menu.active {\n    display: flex !important;\n  }\n\n   .resizing & {\n    .sort-button,\n    .header-menu {\n      display: none !important;\n    }\n  }\n`\n\ntype TableCellProps = {\n  $isLastPinned?: boolean\n}\n\nexport const TableCell = styled.td<TableCellProps>`\n  position: relative;\n  box-shadow: ${getDefaultShadow(false)};\n  background-color: var(--md-sys-color-surface-container-low);\n\n  &.${DRAG_HANDLE_CLASS} {\n    // Styles for the button inside the drag handle cell\n    button {\n      opacity: 0; // Default: hidden\n      visibility: hidden;\n      transition: opacity 0.2s ease, visibility 0.2s ease;\n      // Base appearance styles (cursor, border, background, etc.)\n      // are primarily handled by inline styles in RowDragHandleCellContent.tsx.\n      // Add any necessary overrides or defaults here if needed.\n      // For example, ensuring the button itself doesn't interfere with cell styling:\n      background: transparent;\n      border: none;\n      padding: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 100%;\n      height: 100%;\n    }\n  }\n\n  --task-background-color: hsl(216 15% 11.5% / 1);\n  &.task {\n    background-color: var(--task-background-color);\n  }\n\n  &.selected-row {\n    background-color: var(--md-sys-color-surface-container-high);\n  }\n\n  /* show hover effect only if direct child div does NOT have .readonly and is not selected */\n  &:not(:has(> div.readonly)) {\n    cursor: pointer;\n    &:hover {\n      background-color: var(--md-sys-color-surface-container);\n    }\n\n    &.selected {\n      background-color: var(--md-sys-color-secondary-container);\n    }\n  }\n\n  &.selected {\n    background-color: var(--md-sys-color-secondary-container);\n    position: relative;\n    z-index: 1;\n  }\n\n  /* remove default focus style */\n  &:focus-visible {\n    outline: none;\n  }\n\n  /* Styling for the last pinned left column */\n  /* extra border on the right */\n  &.last-pinned-left {\n    box-shadow: inset 1px -1px 0 0 var(--md-sys-color-surface-container),\n      inset -2px 0 0 0 var(--md-sys-color-surface-container);\n  }\n\n  /* Shadow combinations - single side */\n  &.shadow-top:not(.shadow-right):not(.shadow-bottom):not(.shadow-left) {\n    box-shadow: ${topShadow}, ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-right:not(.shadow-top):not(.shadow-bottom):not(.shadow-left) {\n    box-shadow: ${rightShadow}, ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-bottom:not(.shadow-top):not(.shadow-right):not(.shadow-left) {\n    box-shadow: ${bottomShadow}, ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-left:not(.shadow-top):not(.shadow-right):not(.shadow-bottom) {\n    box-shadow: ${leftShadow}, ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  /* Two sides */\n  &.shadow-top.shadow-right:not(.shadow-bottom):not(.shadow-left) {\n    box-shadow: ${topShadow}, ${rightShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-top.shadow-bottom:not(.shadow-right):not(.shadow-left) {\n    box-shadow: ${topShadow}, ${bottomShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-top.shadow-left:not(.shadow-right):not(.shadow-bottom) {\n    box-shadow: ${topShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-right.shadow-bottom:not(.shadow-top):not(.shadow-left) {\n    box-shadow: ${rightShadow}, ${bottomShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-right.shadow-left:not(.shadow-top):not(.shadow-bottom) {\n    box-shadow: ${rightShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-bottom.shadow-left:not(.shadow-top):not(.shadow-right) {\n    box-shadow: ${bottomShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  /* Three sides */\n  &.shadow-top.shadow-right.shadow-bottom:not(.shadow-left) {\n    box-shadow: ${topShadow}, ${rightShadow}, ${bottomShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-top.shadow-right.shadow-left:not(.shadow-bottom) {\n    box-shadow: ${topShadow}, ${rightShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-top.shadow-bottom.shadow-left:not(.shadow-right) {\n    box-shadow: ${topShadow}, ${bottomShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-right.shadow-bottom.shadow-left:not(.shadow-top) {\n    box-shadow: ${rightShadow}, ${bottomShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  /* All four sides */\n  &.shadow-top.shadow-right.shadow-bottom.shadow-left {\n    box-shadow: ${topShadow}, ${rightShadow}, ${bottomShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  /* Focus styling */\n  &.focused {\n    position: relative;\n    z-index: 2;\n  }\n\n  /* Use pseudo-element for focused outline to avoid box-shadow conflicts */\n  &.focused::after {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    border: 2px solid var(--md-sys-color-primary);\n    pointer-events: none;\n  }\n\n  /* read only fields are dimmed down for bg and border */\n  &:has(> div.readonly) {\n    &:not(.multiple-selected) {\n      --focused-readonly-color: hsl(212 15% 18% / 1);\n      &.focused {\n        background-color: var(--focused-readonly-color);\n        &::after {\n          border-color: var(--focused-readonly-color);\n        }\n      }\n    }\n\n    /* when focused is readonly and multiple-selected */\n    &.multiple-selected {\n      &.focused::after {\n        display: none;\n      }\n    }\n  }\n\n  /* if there is no cell widget element (no children) then the cell should not be selectable at all */\n  &:not(:has(> div)) {\n    pointer-events: none;\n    cursor: default;\n  }\n\n  &.editing {\n    z-index: 10 !important;\n    /* light border around the outside */\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 2px;\n      border: 2px solid var(--md-sys-color-surface-container-low);\n    }\n  }\n\n  /* special styles for selection bar cells */\n  &.__row_selection__ {\n    width: 20px !important;\n    min-width: unset;\n\n    &.selected {\n      background-color: var(--md-sys-color-primary-container) !important;\n      box-shadow: none !important;\n      /* reveal the check mark */\n      [icon='check'] {\n        display: block;\n      }\n    }\n  }\n`\n\nexport const TableHeader = styled.thead`\n  display: grid !important;\n  position: sticky;\n  top: 0;\n  min-height: 34px;\n  z-index: 10;\n  background-color: var(--md-sys-color-surface-container-lowest);\n\n  .resizing & {\n    cursor: col-resize !important;\n  }\n`\n\nexport const TableWrapper = styled.div`\n  overflow: hidden;\n  position: absolute;\n  inset: 0;\n  border-radius: var(--border-radius-m);\n\n  background-color: var(--md-sys-color-surface-container-low);\n`\n\nexport const TableContainer = styled.div`\n  display: flex;\n\n  height: 100%;\n  width: 100%;\n  overflow: auto;\n  padding: 4px;\n  padding-top: 0;\n\n  &.isLoading {\n    overflow: hidden;\n  }\n\n  /* Hide all header buttons when any column is being resized */\n  &.resizing {\n    .actions {\n      display: none !important;\n    }\n  }\n\n  table {\n    height: fit-content;\n    width: 100%;\n    display: grid;\n  }\n\n  thead {\n    display: none;\n  }\n\n  tbody {\n    position: relative;\n    display: grid;\n  }\n\n  td {\n    height: 34px;\n    padding: 1px 0px;\n    width: 100%;\n  }\n`\n\nexport const LinkColumnHeader = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  .icon {\n    font-size: 18px;\n    color: var(--md-sys-color-outline);\n  }\n`\n"],"names":["topShadow","rightShadow","bottomShadow","leftShadow","getDefaultShadow","isLastPinned","DRAG_HANDLE_CLASS","TR","styled","TableCellContent","ResizedHandler","ColumnHeader","HeaderCell","HeaderButtons","$isOpen","TableCell","$isLastPinned","TableHeader","TableWrapper","TableContainer","LinkColumnHeader"],"mappings":"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"}
+{"version":3,"file":"ProjectTreeTable.styled.cjs.js","sources":["../../../../../src/containers/ProjectTreeTable/ProjectTreeTable.styled.ts"],"sourcesContent":["import styled from 'styled-components'\n\n// Create shadow mixins to make combinations work properly\nconst topShadow = `inset 0 1px 0 0 var(--md-sys-color-primary)`\nconst rightShadow = `inset -1px 0 0 0 var(--md-sys-color-primary)`\nconst bottomShadow = `inset 0 -1px 0 0 var(--md-sys-color-primary)`\nconst leftShadow = `inset 1px 0 0 0 var(--md-sys-color-primary)`\n\nconst getDefaultShadow = (isLastPinned: boolean) => {\n  const defaultShadow = `inset 1px -1px 0 0 var(--md-sys-color-surface-container)`\n  const defaultShadowLastPinned = `inset -2px -1px 0 0 var(--md-sys-color-surface-container), inset 1px 0 0 0 var(--md-sys-color-surface-container)`\n  return isLastPinned ? defaultShadowLastPinned : defaultShadow\n}\n\n// Use the known string literal for DRAG_HANDLE_COLUMN_ID to avoid import complexities here\nconst DRAG_HANDLE_CLASS = 'drag-handle'\n\nexport const TR = styled.tr`\n  display: flex;\n  position: absolute;\n  width: 100%;\n\n  &:hover {\n    // When the row (TR) is hovered...\n\n    // Target the button inside the drag handle cell to make it visible at 50% opacity.\n    // This uses a more specific selector by including 'td' to ensure it correctly targets the cell.\n    td.${DRAG_HANDLE_CLASS} button {\n      opacity: 0.5;\n      visibility: visible;\n    }\n\n    // When the row (TR) is hovered AND the button inside drag handle cell is also hovered...\n    // Make the button 100% opacity. This selector is more specific and will override the above.\n    td.${DRAG_HANDLE_CLASS} button:hover {\n      opacity: 1;\n    }\n\n    /* row selection hover */\n    td:not(.selected) {\n      background-color: var(--color-table-row-hover);\n    }\n  }\n\n  &.group-row {\n    td {\n      /* group headers do not have vertical grid lines */\n      box-shadow: inset 0px -1px 0 0 var(--md-sys-color-surface-container);\n    }\n  }\n`\n\nexport const TableCellContent = styled.div`\n  display: flex;\n  align-items: center;\n  gap: var(--base-gap-small);\n  height: 100%;\n  width: 100%;\n  padding: 0px 8px;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n  user-select: none;\n  padding-right: 0;\n\n  &.bold {\n    font-weight: 600;\n  }\n\n  &.loading {\n    margin: 0px 5px;\n    padding: 0 !important;\n    width: calc(100% - 10px);\n    height: calc(100% - 6px);\n    margin-top: 3px;\n  }\n\n  &:focus-visible {\n    outline: none;\n  }\n\n  .resizing & {\n    cursor: col-resize !important;\n  }\n`\n\nexport const ResizedHandler = styled.div`\n  position: absolute;\n  right: -1px;\n  top: 0;\n  bottom: 0;\n  width: 6px;\n  cursor: col-resize !important;\n  background-color: var(--md-sys-color-surface-container-high);\n\n  opacity: 0;\n\n  &.resizing {\n    background-color: var(--md-sys-color-primary);\n    opacity: 1;\n    cursor: col-resize !important;\n  }\n`\n\nexport const ColumnHeader = styled.tr`\n  background-color: var(--md-sys-color-surface-container-low);\n`\n\nexport const HeaderCell = styled.th`\n  position: relative;\n  background-color: var(--md-sys-color-surface-container-lowest);\n  box-shadow: inset 1px -1px 0 0 var(--md-sys-color-surface-container);\n  display: flex;\n  align-items: center;\n  min-height: fit-content;\n  white-space: nowrap;\n\n  &:hover {\n    .resize-handle {\n      opacity: 1;\n    }\n\n    .actions {\n      display: flex !important;\n    }\n\n    .actions .header-menu {\n      display: flex !important;\n    }\n  }\n\n  /* Hide action buttons when resizing */\n  &.resizing {\n    .actions {\n      display: none !important;\n    }\n    cursor: col-resize !important;\n\n    * {\n      cursor: col-resize !important;\n    }\n  }\n\n  /* Styling for the last pinned left column */\n  &.last-pinned-left {\n    box-shadow: inset 1px -1px 0 0 var(--md-sys-color-surface-container),\n      inset -2px 0 0 0 var(--md-sys-color-surface-container);\n  }\n\n  /* special styles for the left selection column */\n  &.__row_selection__ {\n    min-width: unset;\n    width: 20px !important;\n\n    .actions {\n      display: none;\n    }\n  }\n`\n\nexport const HeaderButtons = styled.div<{ $isOpen: boolean }>`\n  display: none;\n\n  ${({ $isOpen }) =>\n    $isOpen &&\n    `\n    display: flex !important;\n  `}\n\n  gap: var(--base-gap-small);\n  align-items: center;\n\n  position: absolute;\n  z-index: 10;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  background-color: var(--md-sys-color-surface-container-lowest);\n  padding-left: 4px;\n\n  .resizing & {\n    cursor: col-resize !important;\n  }\n\n  &:has(.sort-button.visible),\n  &:has(.sort-button.selected) {\n    display: flex !important;\n  }\n\n  .sort-button.visible {\n    display: flex !important;\n  }\n\n  .sort-button.selected {\n    display: flex !important;\n  }\n\n  .header-menu {\n    display: none;\n  }\n\n  ${({ $isOpen }) =>\n    $isOpen &&\n    `\n    .header-menu {\n      display: flex !important;\n    }\n  `}\n\n  .header-menu.open,\n  .header-menu.active {\n    display: flex !important;\n  }\n\n  .resizing & {\n    .sort-button,\n    .header-menu {\n      display: none !important;\n    }\n  }\n`\n\ntype TableCellProps = {\n  $isLastPinned?: boolean\n}\n\nexport const TableCell = styled.td<TableCellProps>`\n  position: relative;\n  box-shadow: ${getDefaultShadow(false)};\n  background-color: var(--color-table-row);\n\n  &.${DRAG_HANDLE_CLASS} {\n    // Styles for the button inside the drag handle cell\n    button {\n      opacity: 0; // Default: hidden\n      visibility: hidden;\n      transition: opacity 0.2s ease, visibility 0.2s ease;\n      // Base appearance styles (cursor, border, background, etc.)\n      // are primarily handled by inline styles in RowDragHandleCellContent.tsx.\n      // Add any necessary overrides or defaults here if needed.\n      // For example, ensuring the button itself doesn't interfere with cell styling:\n      background: transparent;\n      border: none;\n      padding: 0;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 100%;\n      height: 100%;\n    }\n  }\n\n  /* Lighter background for expandable rows */\n  &.expandable {\n    background-color: var(--color-table-row-high);\n  }\n\n  &.selected-row {\n    background-color: var(--color-table-selected-row);\n  }\n\n  /* show hover effect only if direct child div does NOT have .readonly and is not selected */\n  &:not(:has(> div.readonly)) {\n    cursor: pointer;\n    &:hover {\n      background-color: var(--color-table-hover);\n    }\n\n    &.selected {\n      background-color: var(--color-table-selected);\n    }\n  }\n\n  &.selected {\n    background-color: var(--color-table-selected);\n    position: relative;\n    z-index: 1;\n  }\n\n  /* remove default focus style */\n  &:focus-visible {\n    outline: none;\n  }\n\n  /* Styling for the last pinned left column */\n  /* extra border on the right */\n  &.last-pinned-left {\n    box-shadow: inset 1px -1px 0 0 var(--md-sys-color-surface-container),\n      inset -2px 0 0 0 var(--md-sys-color-surface-container);\n  }\n\n  /* Shadow combinations - single side */\n  &.shadow-top:not(.shadow-right):not(.shadow-bottom):not(.shadow-left) {\n    box-shadow: ${topShadow}, ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-right:not(.shadow-top):not(.shadow-bottom):not(.shadow-left) {\n    box-shadow: ${rightShadow}, ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-bottom:not(.shadow-top):not(.shadow-right):not(.shadow-left) {\n    box-shadow: ${bottomShadow}, ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-left:not(.shadow-top):not(.shadow-right):not(.shadow-bottom) {\n    box-shadow: ${leftShadow}, ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  /* Two sides */\n  &.shadow-top.shadow-right:not(.shadow-bottom):not(.shadow-left) {\n    box-shadow: ${topShadow}, ${rightShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-top.shadow-bottom:not(.shadow-right):not(.shadow-left) {\n    box-shadow: ${topShadow}, ${bottomShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-top.shadow-left:not(.shadow-right):not(.shadow-bottom) {\n    box-shadow: ${topShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-right.shadow-bottom:not(.shadow-top):not(.shadow-left) {\n    box-shadow: ${rightShadow}, ${bottomShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-right.shadow-left:not(.shadow-top):not(.shadow-bottom) {\n    box-shadow: ${rightShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-bottom.shadow-left:not(.shadow-top):not(.shadow-right) {\n    box-shadow: ${bottomShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  /* Three sides */\n  &.shadow-top.shadow-right.shadow-bottom:not(.shadow-left) {\n    box-shadow: ${topShadow}, ${rightShadow}, ${bottomShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-top.shadow-right.shadow-left:not(.shadow-bottom) {\n    box-shadow: ${topShadow}, ${rightShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-top.shadow-bottom.shadow-left:not(.shadow-right) {\n    box-shadow: ${topShadow}, ${bottomShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  &.shadow-right.shadow-bottom.shadow-left:not(.shadow-top) {\n    box-shadow: ${rightShadow}, ${bottomShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  /* All four sides */\n  &.shadow-top.shadow-right.shadow-bottom.shadow-left {\n    box-shadow: ${topShadow}, ${rightShadow}, ${bottomShadow}, ${leftShadow},\n      ${({ $isLastPinned }) => getDefaultShadow($isLastPinned || false)};\n  }\n\n  /* Focus styling */\n  &.focused {\n    position: relative;\n    z-index: 2;\n  }\n\n  /* Use pseudo-element for focused outline to avoid box-shadow conflicts */\n  &.focused::after {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    border: 2px solid var(--md-sys-color-primary);\n    pointer-events: none;\n  }\n\n  /* read only fields are dimmed down for bg and border */\n  &:has(> div.readonly) {\n    &:not(.multiple-selected) {\n      &.focused {\n        background-color: var(--color-table-readonly-focused);\n        &::after {\n          border-color: var(--color-table-readonly-focused);\n        }\n      }\n    }\n\n    /* when focused is readonly and multiple-selected */\n    &.multiple-selected {\n      &.focused::after {\n        display: none;\n      }\n    }\n  }\n\n  /* if there is no cell widget element (no children) then the cell should not be selectable at all */\n  &:not(:has(> div)) {\n    /* pointer-events: none; */\n    cursor: default;\n  }\n\n  &.editing {\n    z-index: 10 !important;\n    /* light border around the outside */\n    &::before {\n      content: '';\n      position: absolute;\n      inset: 2px;\n      border: 2px solid var(--md-sys-color-surface-container-low);\n    }\n  }\n\n  /* special styles for selection bar cells */\n  &.__row_selection__ {\n    width: 20px !important;\n    min-width: unset;\n\n    &.selected {\n      background-color: var(--md-sys-color-primary-container) !important;\n      box-shadow: none !important;\n      /* reveal the check mark */\n      [icon='check'] {\n        display: block;\n      }\n    }\n  }\n`\n\nexport const TableHeader = styled.thead`\n  display: grid !important;\n  position: sticky;\n  top: 0;\n  min-height: 34px;\n  z-index: 10;\n  background-color: var(--md-sys-color-surface-container-lowest);\n\n  .resizing & {\n    cursor: col-resize !important;\n  }\n`\n\nexport const TableWrapper = styled.div`\n  overflow: hidden;\n  position: absolute;\n  inset: 0;\n  border-radius: var(--border-radius-m);\n\n  background-color: var(--md-sys-color-surface-container-low);\n`\n\nexport const TableContainer = styled.div`\n  display: flex;\n\n  height: 100%;\n  width: 100%;\n  overflow: auto;\n  padding: 4px;\n  padding-top: 0;\n\n  &.isLoading {\n    overflow: hidden;\n  }\n\n  /* Hide all header buttons when any column is being resized */\n  &.resizing {\n    .actions {\n      display: none !important;\n    }\n  }\n\n  table {\n    height: fit-content;\n    width: 100%;\n    display: grid;\n  }\n\n  thead {\n    display: none;\n  }\n\n  tbody {\n    position: relative;\n    display: grid;\n  }\n\n  td {\n    height: 34px;\n    padding: 1px 0px;\n    width: 100%;\n  }\n`\n\nexport const LinkColumnHeader = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  .icon {\n    font-size: 18px;\n    color: var(--md-sys-color-outline);\n  }\n`\n\nexport const AnimatedEmptyPlaceholder = styled.div`\n  animation: fadeIn 20ms ease-in forwards;\n  animation-delay: 300ms;\n  opacity: 0;\n\n  @keyframes fadeIn {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n`\n"],"names":["topShadow","rightShadow","bottomShadow","leftShadow","getDefaultShadow","isLastPinned","DRAG_HANDLE_CLASS","TR","styled","TableCellContent","ResizedHandler","ColumnHeader","HeaderCell","HeaderButtons","$isOpen","TableCell","$isLastPinned","TableHeader","TableWrapper","TableContainer","LinkColumnHeader","AnimatedEmptyPlaceholder"],"mappings":"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"}