vueless 0.0.434 → 0.0.436

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.434",
+  "version": "0.0.436",
   "license": "MIT",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "keywords": [

package/ui.data-table/UTable.vue

@@ -184,6 +184,7 @@
               v-bind="getRowAttrs(row.id)"
               :class="cx([getRowAttrs(row.id).class, getRowClasses(row)])"
               @click="onClickRow"
+              @click-cell="onClickCell"
               @toggle-row-visibility="onToggleRowVisibility"
             >
               <template
@@ -396,6 +397,12 @@ const emit = defineEmits([
    */
   "clickRow",
 
+  /**
+   * Triggers when the cell is clicked.
+   * @property {object} cell
+   */
+  "clickCell",
+
   /**
    * Triggers when table rows are selected (updated).
    * @property {array} tableRows
@@ -687,6 +694,10 @@ function onClickRow(row) {
   emit("clickRow", row);
 }
 
+function onClickCell(cell, row) {
+  emit("clickCell", cell, row);
+}
+
 function onChangeSelectAll(selectAll) {
   if (selectAll && canSelectAll.value) {
     selectedRows.value = getFlatRows(tableRows.value).map((row) => row.id);

package/ui.data-table/UTableRow.vue

@@ -20,6 +20,7 @@
       :key="index"
       v-bind="bodyCellBaseAttrs"
       :class="cx([columns[index].tdClass, getCellClasses(row, key)])"
+      @click="onClickCell(value, row)"
     >
       <div
         v-if="(row.row || nestedLevel || row.nestedData) && index === 0"
@@ -114,6 +115,7 @@
         :selectable="selectable"
         @toggle-row-visibility="onClickToggleRowChild"
         @click="onClick"
+        @click-cell="onClickCell"
       >
         <template
           v-for="(value, key, index) in getFilteredRow(nestedRow, columns)"
@@ -189,7 +191,7 @@ const props = defineProps({
   },
 });
 
-const emit = defineEmits(["toggleRowVisibility", "click"]);
+const emit = defineEmits(["toggleRowVisibility", "click", "click-cell"]);
 
 const selectedRows = defineModel("selectedRows", { type: Array, default: () => [] });
 
@@ -216,7 +218,11 @@ const shift = computed(() => (props.row.row ? 1.5 : 2));
 const isSingleNestedRow = computed(() => !Array.isArray(props.row.row));
 
 const getToggleIconName = computed(() => (row) => {
-  const isHidden = row.row?.isHidden || row.nestedData?.isHidden;
+  const isHiddenNestedRow = Array.isArray(row.row)
+    ? row.row.some((nestedRow) => nestedRow.isHidden)
+    : row.row?.isHidden;
+
+  const isHidden = isHiddenNestedRow || row.nestedData?.isHidden;
 
   return isHidden ? props.config.defaults.expandIcon : props.config.defaults.collapseIcon;
 });
@@ -294,4 +300,8 @@ function onClickToggleIcon() {
 
   props.row.row.forEach(({ id }) => onClickToggleRowChild(id));
 }
+
+function onClickCell(cell, row) {
+  emit("click-cell", cell, row);
+}
 </script>

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "vueless",
-  "version": "0.0.434",
+  "version": "0.0.436",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -8401,6 +8401,18 @@
                 }
               ]
             },
+            {
+              "name": "clickCell",
+              "description": "Triggers when the cell is clicked.",
+              "properties": [
+                {
+                  "type": [
+                    "object"
+                  ],
+                  "name": "cell"
+                }
+              ]
+            },
             {
               "name": "update:rows",
               "description": "Triggers when table rows are selected (updated).",
@@ -8615,6 +8627,9 @@
             },
             {
               "name": "click"
+            },
+            {
+              "name": "click-cell"
             }
           ],
           "slots": [