quasar-ui-sellmate-ui-kit 3.14.42 → 3.14.48

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "quasar-ui-sellmate-ui-kit",
-  "version": "3.14.42",
+  "version": "3.14.48",
   "author": "Sellmate Dev Team <dev@sellmate.co.kr>",
   "description": "Sellmate UI Kit",
   "license": "MIT",

package/src/components/SSelectSearch.vue

@@ -321,37 +321,33 @@
 
     .q-item--active.q-manual-focusable--focused {
       color: $brilliantblue_75 !important;
+      font-weight: 700 !important;
     }
 
     .q-virtual-scroll__content .custom-select-options {
+      min-height: $default-height;
+      height: auto !important;
       &.custom-select-options--selected,
       &:hover {
         background-color: $brilliantblue_75 !important;
         color: white !important;
       }
+      .q-item__section {
+        display: block;
+        white-space: normal;
+        overflow: visible;
+        text-overflow: unset;
+        word-break: break-all;
+      }
+    }
+    .disabled.s-select-option {
+      border: none;
+      background: none !important;
+      color: $grey_65 !important;
+    }
+    &.menu-fixed {
+      max-width: var(--dynamic-width) !important;
+      width: var(--dynamic-width) !important;
     }
-  }
-  .custom-select-options {
-    min-height: $default-height;
-    height: auto !important;
-  }
-
-  .disabled.s-select-option {
-    border: none;
-    background: none !important;
-    color: $grey_65 !important;
-  }
-
-  .q-item__section {
-    display: block;
-    white-space: normal;
-    overflow: visible;
-    text-overflow: unset;
-    word-break: break-all;
-  }
-
-  .menu-fixed {
-    max-width: var(--dynamic-width) !important;
-    width: var(--dynamic-width) !important;
   }
 </style>

package/src/components/STable.vue

@@ -13,7 +13,10 @@
     :class="{
       's-select-table': $attrs.selection && $attrs.selection !== 'none',
       'resizable-table': resizable,
-      'sticky-column-table': stickyColumn.leftStickyCount > 0 || stickyColumn.rightStickyCount > 0,
+      'sticky-column-table':
+        ($attrs.selection && $attrs.selection !== 'none') ||
+        stickyColumn.leftStickyCount > 0 ||
+        stickyColumn.rightStickyCount > 0,
       'sticky-resizable-table': stickyResizable,
       'sticky-header': stickyHeader,
       'before-search': !rows.length,
@@ -301,18 +304,22 @@
       }
 
       function handleColumns() {
-        const { addResizable, addStickyColumn, addSticky } = useResizable();
-        const tableElement = () => sTableRef.value.$el;
+        const { addResizable, addStickyColumn } = useResizable();
 
         if (props.resizable) {
           addResizable(sTableRef, props.stickyColumn, props.useLastCellResizable);
         }
 
-        const { count, direction: stickyDirection } = props.stickyColumn;
-        const { leftStickyCount, rightStickyCount } = props.stickyColumn;
-        if (leftStickyCount > 0 || rightStickyCount > 0) {
+        const hasSelection = attrs.selection && attrs.selection !== 'none';
+
+        const hasSticky =
+          hasSelection ||
+          props.stickyColumn.leftStickyCount > 0 ||
+          props.stickyColumn.rightStickyCount > 0;
+
+        if (hasSticky) {
           addStickyColumn(sTableRef, props.stickyColumn);
-          observeScrollForStickyShadow(tableElement());
+          observeScrollForStickyShadow(sTableRef.value.$el);
         }
       }
 

package/src/composables/table/use-resizable.js

@@ -172,34 +172,36 @@ export function useResizable() {
   function addStickyColumn(tableRef, stickyColumnsConfig) {
     const { leftStickyCount, rightStickyCount } = stickyColumnsConfig;
 
-    const cols = getTableCols(tableRef.value.$el);
-    const isSelectTable = tableRef.value.$el.classList.contains('s-select-table');
+    const tableEl = tableRef.value.$el;
+    const cols = getTableCols(tableEl);
+    const isSelectTable = tableEl.classList.contains('s-select-table');
+
+    let startLeftIndex = 0;
 
     // Left Sticky Columns
-    if (leftStickyCount > 0) {
-      // let i = isSelectTable ? 1 : 0; // Select Table일 경우 첫번째 컬럼은 스티키가 아님
-      const count = isSelectTable ? leftStickyCount + 1 : leftStickyCount; // Select Table일 경우 +1
-
-      for (let i = 0; i < count; i++) {
-        applyStickyToColumn(tableRef.value.$el, i, true, '0px');
-        if (isSelectTable && i > 0) {
-          appendResizableDiv(cols[i], 'right', true); // 오른쪽에 리사이즈 핸들 추가
-        } else {
-          appendResizableDiv(cols[i], 'right', true); // 오른쪽에 리사이즈 핸들 추가
-        }
-      }
+    if (isSelectTable && cols[0]) {
+      applyStickyToColumn(tableEl, 0, true, '0px'); // 체크박스 컬럼 고정
+      appendResizableDiv(cols[0], 'right', true); // 오른쪽에 리사이즈 핸들 추가
+      startLeftIndex = 1; // 이후 데이터 컬럼은 1번부터 시작
+    }
 
-      detectStickyWidth(tableRef.value.$el, true); // 좌측 스티키 너비 재계산
+    for (let i = 0; i < leftStickyCount; i++) {
+      const colIdx = startLeftIndex + i;
+      if (!cols[colIdx]) break;
+      applyStickyToColumn(tableEl, colIdx, true, '0px'); // 컬럼 고정
+      appendResizableDiv(cols[colIdx], 'right', true); // 오른쪽에 리사이즈 핸들 추가
     }
 
+    detectStickyWidth(tableEl, true); // 좌측 스티키 너비 재계산
+
     // Right Sticky Columns
     if (rightStickyCount > 0) {
       for (let i = cols.length - rightStickyCount; i < cols.length; i++) {
-        applyStickyToColumn(tableRef.value.$el, i, false, '0px');
+        applyStickyToColumn(tableEl, i, false, '0px');
         appendResizableDiv(cols[i], 'left', true); // 왼쪽에 리사이즈 핸들 추가 (우측 스티키)
       }
 
-      detectStickyWidth(tableRef.value.$el, false); // 우측 스티키 너비 재계산
+      detectStickyWidth(tableEl, false); // 우측 스티키 너비 재계산
     }
   }
   return {