webcake-ui-kit 1.2.1 → 1.2.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webcake-ui-kit",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "UI Kit for Vue 2 && 3 - Pure Options API",
   "main": "src/index.js",
   "module": "src/index.js",

package/src/components/select/Select.vue

@@ -97,7 +97,15 @@
         />
       </slot>
       <slot v-if="showEmpty" name="empty">
-        <Empty description="No data" />
+        <Empty description="No data">
+          <template #media>
+            <div class="select-empty">
+              <img
+                src="https://content.pancake.vn/web-media-262/2e/2a/0c/96/c2b58ae9f06c4dc2a3b83016e56d5b4132ff40637862ba23435e43a0-w:224-h:224-l:3927-t:image/png.png"
+              />
+            </div>
+          </template>
+        </Empty>
       </slot>
     </div>
   </Menu>
@@ -138,7 +146,7 @@ export default {
     optionSize: {
       type: String,
       default: 'md',
-      validator: v => ['xs', 'md', 'lg'].indexOf(v) !== -1
+      validator: v => ['sm', 'md', 'lg'].indexOf(v) !== -1
     },
     value: {
       type: [String, Array],

package/src/components/select/select.css

@@ -213,8 +213,9 @@
   font-size: 14px;
 }
 
-.ui-select--multiple.ui-select--xs .ui-select__search::placeholder {
-  font-size: 12px;
+.ui-select--xs .ui-select__search::placeholder {
+  font-size: var(--paragraph-mini-font-size);
+  line-height: var(--paragraph-mini-line-height);
 }
 
 .ui-select__search--single {
@@ -247,6 +248,13 @@
   border-radius: 3px;
 }
 
-.ui-select__empty {
-  padding: var(--spacing-sm) var(--spacing-xs);
+.ui-select__list ::v-deep .select-empty {
+  height: 100px;
+  width: 100px;
+}
+
+.ui-select__list ::v-deep .select-empty img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
 }

package/src/components/select-option/SelectOption.vue

@@ -15,13 +15,13 @@
     :aria-disabled="isDisabled ? 'true' : null"
     @click="handleClick"
   >
-    <span v-if="$slots.prefix" class="ui-select-option__prefix">
+    <span v-if="hasPrefix" class="ui-select-option__prefix">
       <slot name="prefix" />
     </span>
     <span class="ui-select-option--label">
       <slot>{{ label || value }}</slot>
     </span>
-    <span v-if="$slots.suffix" class="ui-select-option__suffix">
+    <span v-if="hasSuffix" class="ui-select-option__suffix">
       <slot name="suffix" />
     </span>
     <WkiCheck v-if="isSelected && isMultiMode" :size="16" color="var(--muted-fg)" />
@@ -100,6 +100,12 @@ export default {
       // explicit prop wins; otherwise inherit from parent Select; else regular
       return this.size || (this.select && (this.select.optionSize || this.select.size)) || 'md'
     },
+    hasPrefix() {
+      return !!((this.$scopedSlots && this.$scopedSlots.prefix) || this.$slots.prefix)
+    },
+    hasSuffix() {
+      return !!((this.$scopedSlots && this.$scopedSlots.suffix) || this.$slots.suffix)
+    },
     isHidden() {
       if (!this.select || !this.select.filterText) return false
       var q = this.select.filterText.toLowerCase()

package/src/components/table-v2/Table.vue

@@ -6,6 +6,9 @@
           <template #bodyCell="slotData">
             <slot name="bodyCell" v-bind="slotData"></slot>
           </template>
+          <template #empty>
+            <slot name="empty"></slot>
+          </template>
         </TableWrapper>
       </TableResizeObserver>
     </TableLoading>
@@ -19,7 +22,6 @@ import { sortData } from './composables/useSorter.js'
 import { computeOffsets } from './composables/useSticky.js'
 import { SELECTION_COLUMN, DRAGGABLE_COLUMN } from './constants.js'
 import TableWrapper from './TableWrapper.vue'
-import TableEmpty from './TableEmpty.vue'
 import TableLoading from './TableLoading.vue'
 import TableResizeObserver from './TableResizeObserver.vue'
 
@@ -57,7 +59,8 @@ export default {
     enableFixedLeft: { type: Boolean, default: false },
     rowHeight: { type: Number, default: 36 },
     headerHeight: { type: Number, default: 50 },
-    emptyText: { type: String, default: '' }
+    emptyText: { type: String, default: '' },
+    height: { type: [Number, String], default: 0 }
   },
 
   emits: ['change', 'sort-change', 'select-change'],
@@ -90,7 +93,8 @@ export default {
         size: this.size,
         scroll: this.scroll,
         rowHeight: this.rowHeight,
-        headerHeight: this.headerHeight
+        headerHeight: this.headerHeight,
+        height: this.height
       }
     },
 
@@ -171,6 +175,7 @@ export default {
         this.tableCtx.layout.size = v.size
         this.tableCtx.layout.scroll = v.scroll
         this.tableCtx.layout.tableLayout = v.scroll && v.scroll.y ? 'fixed' : 'auto'
+        this.tableCtx.layout.height = v.height
       }
     },
 

package/src/components/table-v2/TableResizeObserver.vue

@@ -1,5 +1,4 @@
 <script>
-import { getCurrentInstance } from 'vue'
 import { findDOMNode } from '../../utils/common'
 
 export default {
@@ -14,7 +13,6 @@ export default {
         offsetHeight: 0,
         offsetWidth: 0
       },
-      instance: getCurrentInstance(),
       currentElement: null,
       resizeObserver: null
     }

package/src/components/table-v2/TableWrapper.vue

@@ -27,6 +27,9 @@
             <template #bodyCell="slotData">
               <slot name="bodyCell" v-bind="slotData"></slot>
             </template>
+            <template #empty>
+              <slot name="empty"></slot>
+            </template>
           </TableBody>
         </table>
       </div>
@@ -41,6 +44,9 @@
           <template #bodyCell="slotData">
             <slot name="bodyCell" v-bind="slotData"></slot>
           </template>
+          <template #empty>
+            <slot name="empty"></slot>
+          </template>
         </TableBody>
       </table>
     </div>
@@ -75,6 +81,10 @@ export default {
       return this.tableContext.layout.scroll
     },
 
+    minHeight: function () {
+      return this.tableContext.layout.height
+    },
+
     isEmpty() {
       return this.tableContext.data.display.length === 0
     },
@@ -135,9 +145,13 @@ export default {
 
     // Case 3 — body scroll container
     bodyHoldStyle: function () {
+      const rowHeight = this.tableContext.layout.headerHeight
+      const deduct = `${this.toCssSize(rowHeight)}`
+
       var style = {
         overflowY: 'auto',
-        maxHeight: this.toCssSize(this.scroll.y)
+        maxHeight: `calc(${this.toCssSize(this.scroll.y)} - ${deduct})`,
+        minHeight: this.minHeight > 0 ? `calc(${this.toCssSize(this.minHeight)} - ${deduct})` : undefined
       }
       if (this.hasScrollX) {
         style.overflowX = 'auto'

package/src/components/table-v2/body/DragPreview.vue

@@ -2,10 +2,10 @@
   <table
     class="ui-table-v2__drag-preview"
     aria-hidden="true"
-    :style="{ width: containerWidth ? containerWidth + 'px' : '100%' }"
+    :style="{ width: containerWidth ? containerWidth + 'px' : '100%', tableLayout: 'fixed' }"
   >
     <tbody class="ui-table-v2__body">
-      <tr class="ui-table-v2__row">
+      <tr class="ui-table-v2__row" v-if="record">
         <td v-for="col in columns" :key="col.key">
           <div v-if="col.type === DRAGGABLE_COLUMN" class="wrapper-option">
             <span class="drag-handle">

package/src/components/table-v2/body/TableBody.vue

@@ -9,13 +9,15 @@
     <template v-if="isEmpty">
       <tr class="ui-table-v2__row">
         <td colspan="100">
-          <div class="ui-table-v2__row-empty ui-table-v2__empty">
-            <div class="wrapper-img">
-              <img
-                src="https://content.pancake.vn/web-media-262/2e/2a/0c/96/c2b58ae9f06c4dc2a3b83016e56d5b4132ff40637862ba23435e43a0-w:224-h:224-l:3927-t:image/png.png"
-              />
-            </div>
-            <span class="wk-paragraph-small">{{ emptyText }}</span>
+          <div class="ui-table-v2__row-empty ui-table-v2__empty" :style="emptyStyle">
+            <slot name="empty">
+              <div class="wrapper-img">
+                <img
+                  src="https://content.pancake.vn/web-media-262/2e/2a/0c/96/c2b58ae9f06c4dc2a3b83016e56d5b4132ff40637862ba23435e43a0-w:224-h:224-l:3927-t:image/png.png"
+                />
+              </div>
+              <span class="wk-paragraph-small">{{ emptyText }}</span>
+            </slot>
           </div>
         </td>
       </tr>
@@ -70,6 +72,11 @@ export default {
   computed: {
     emptyText() {
       return this.tableContext.data.emptyText || 'Không có dữ liệu'
+    },
+    emptyStyle() {
+      const { height, rowHeight } = this.tableContext.layout
+      if (!height) return {}
+      return { minHeight: `calc(${height}px - ${rowHeight}px)` }
     }
   },
   beforeUnmount: function () {

package/src/components/table-v2/body/TableCell.vue

@@ -20,7 +20,13 @@
       </span>
     </div>
 
-    <slot name="bodyCell" :column="column" :text="record[column.dataIndex]" :record="record">
+    <slot
+      v-if="!isSelectionCol && !isDraggableCol"
+      name="bodyCell"
+      :column="column"
+      :text="record[column.dataIndex]"
+      :record="record"
+    >
       <span :class="[column.ellipsis && 'ui-table-v2__cell--ellipsis']">
         {{ record[column.dataIndex] }}
       </span>

package/src/components/table-v2/context/createTableContext.js

@@ -27,7 +27,8 @@ export function createTableContext() {
       containerWidth: 0,
       columnWidths: new Map(),
       rowHeight: 50,
-      headerHeight: 36
+      headerHeight: 36,
+      height: 0
     },
 
     sort: {

package/src/styles/.omc/state/agent-replay-645326b7-372b-463d-ab45-0adaafe31a51.jsonl

@@ -1,2 +0,0 @@
-{"t":0,"agent":"ae435b9","agent_type":"unknown","event":"agent_stop","success":true}
-{"t":0,"agent":"ae345ba","agent_type":"unknown","event":"agent_stop","success":true}

package/src/styles/.omc/state/subagent-tracking.json

@@ -1,7 +0,0 @@
-{
-  "agents": [],
-  "total_spawned": 0,
-  "total_completed": 0,
-  "total_failed": 0,
-  "last_updated": "2026-05-12T04:07:51.819Z"
-}