cnhis-design-vue 3.3.1-beta.9 → 3.3.1-release.5

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useCurrentColumn.js

@@ -1 +1,52 @@
-import{unref as r}from"vue";import{isVerticalTable as e,isVerticalHeader as o,createVerticalStateHandler as n}from"../utils.js";const t=(t,u,l)=>{u.eventHooks.onCellClick.tap("useCurrentColumn",(({row:r},o)=>{const{uuid:t}=o;if(!t||!e(o))return;const u=l(t);if(!u||!r)return;const i=n(u);i.getTableConfig("rowConfig.isCurrent")&&(u.currentRow=!1!==i.getTableConfig("rowConfig.clickToCancel")&&u.currentRow===r?null:r)})),t.cellStyle.tap("useCurrentColumn",((r,{column:e},t)=>{if(o(e.field))return r;const u=n(t);if(!u.getTableConfig("rowConfig.isCurrent"))return r;return u.getOriginDataByColumn(e)!==t.currentRow?r:Object.assign(r,{backgroundColor:"var(--c-primary-color-opacity2)"})})),u.exposeHooks.expose.tap("VerticalTable-useCurrentColumn",((e,o)=>Object.assign(e,{verticalTable:{...e.verticalTable,getCurrentRow:()=>{var e;const n=null==(e=r(o))?void 0:e.uuid;return n?l(n).currentRow:null}}})))};export{t as useCurrentColumn};
+import { unref } from 'vue';
+import { isVerticalTable, isVerticalHeader, createVerticalStateHandler } from '../utils.js';
+
+const useCurrentColumn = (verticalTableHooks, hooks, getVerticalState) => {
+  hooks.eventHooks.onCellClick.tap("useCurrentColumn", ({
+    row
+  }, config) => {
+    const {
+      uuid
+    } = config;
+    if (!uuid || !isVerticalTable(config))
+      return;
+    const verticalState = getVerticalState(uuid);
+    if (!verticalState || !row)
+      return;
+    const verticalHandler = createVerticalStateHandler(verticalState);
+    if (!verticalHandler.getTableConfig("rowConfig.isCurrent"))
+      return;
+    verticalState.currentRow = verticalHandler.getTableConfig("rowConfig.clickToCancel") !== false ? verticalState.currentRow === row ? null : row : row;
+  });
+  verticalTableHooks.cellStyle.tap("useCurrentColumn", (styles, {
+    column
+  }, verticalState) => {
+    if (isVerticalHeader(column.field))
+      return styles;
+    const verticalHandler = createVerticalStateHandler(verticalState);
+    if (!verticalHandler.getTableConfig("rowConfig.isCurrent"))
+      return styles;
+    const originRow = verticalHandler.getOriginDataByColumn(column);
+    if (originRow !== verticalState.currentRow)
+      return styles;
+    return Object.assign(styles, {
+      backgroundColor: "var(--c-primary-color-opacity2)"
+    });
+  });
+  hooks.exposeHooks.expose.tap("VerticalTable-useCurrentColumn", (expose, config) => {
+    return Object.assign(expose, {
+      verticalTable: {
+        ...expose.verticalTable,
+        getCurrentRow: () => {
+          var _a;
+          const uuid = (_a = unref(config)) == null ? void 0 : _a.uuid;
+          if (!uuid)
+            return null;
+          return getVerticalState(uuid).currentRow;
+        }
+      }
+    });
+  });
+};
+
+export { useCurrentColumn };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useData2Column.js

@@ -1 +1,54 @@
-import{getArrDepth as e}from"../../../../../../../shared/utils/index.js";import{isArray as t}from"lodash-es";import{LOWEST_PRIORITY as r}from"../../../../constants/index.js";import{isVerticalTable as i,createVerticalFieldList as l,bindHeaderInfoAndFlatten as a,findFixedLeftFields as n,isVerticalHeader as s}from"../utils.js";const d=(d,o,f)=>{o.fieldHooks.fieldList.tap({name:"Vertical--useColumn2Data",stage:r},((r,d,{globProps:o})=>{const{uuid:u}=d;if(!u||!i(d))return r;const p=f(u);if(!p)return r;if(p.originalFieldList=r,!t(o.tableData))return[];let c=l(o.tableData,p.headerDepth=e(r),p);p.fullVerticalOriginData=a(r,p.headerDepth);const h=n(r);return d.showHeader=!!h.length,h.length&&h.forEach((e=>{let t=[];c=c.reduce(((r,i)=>{if(s(i.field)){if(0===e[i.field.replaceAll("_parent","")+"_colspan"])return t.push(i),r}return r.push({field:i.field+"_parent",fixed:i.fixed,editRender:i.editRender,children:[...t,i]}),t=[],r}),[])})),p.verticalFieldList=c}))};export{d as useData2Column};
+import { getArrDepth } from '../../../../../../../shared/utils/index.js';
+import { isArray } from 'lodash-es';
+import { LOWEST_PRIORITY } from '../../../../constants/index.js';
+import { isVerticalTable, createVerticalFieldList, bindHeaderInfoAndFlatten, findFixedLeftFields, isVerticalHeader } from '../utils.js';
+
+const useData2Column = (_, hooks, getVerticalState) => {
+  hooks.fieldHooks.fieldList.tap({
+    name: "Vertical--useColumn2Data",
+    stage: LOWEST_PRIORITY
+  }, (fieldList, config, {
+    globProps
+  }) => {
+    const {
+      uuid
+    } = config;
+    if (!uuid || !isVerticalTable(config))
+      return fieldList;
+    const verticalState = getVerticalState(uuid);
+    if (!verticalState)
+      return fieldList;
+    verticalState.originalFieldList = fieldList;
+    if (!isArray(globProps.tableData))
+      return [];
+    let verticalFieldList = createVerticalFieldList(globProps.tableData, verticalState.headerDepth = getArrDepth(fieldList), verticalState);
+    verticalState.fullVerticalOriginData = bindHeaderInfoAndFlatten(fieldList, verticalState.headerDepth);
+    const fixedLeftFields = findFixedLeftFields(fieldList);
+    config.showHeader = !!fixedLeftFields.length;
+    if (fixedLeftFields.length) {
+      fixedLeftFields.forEach((fixedLeftField) => {
+        let prevFields = [];
+        verticalFieldList = verticalFieldList.reduce((res, verticalField) => {
+          if (isVerticalHeader(verticalField.field)) {
+            const colspan = fixedLeftField[verticalField.field.replaceAll("_parent", "") + "_colspan"];
+            if (colspan === 0) {
+              prevFields.push(verticalField);
+              return res;
+            }
+          }
+          res.push({
+            field: verticalField.field + "_parent",
+            fixed: verticalField.fixed,
+            editRender: verticalField.editRender,
+            children: [...prevFields, verticalField]
+          });
+          prevFields = [];
+          return res;
+        }, []);
+      });
+    }
+    return verticalState.verticalFieldList = verticalFieldList;
+  });
+};
+
+export { useData2Column };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useEditCell.js

@@ -1 +1,96 @@
-import{findAncestor as e}from"../../../../../../../shared/utils/index.js";import{isFunction as t}from"lodash-es";import{onBeforeUnmount as i,unref as n}from"vue";import{WIDGET_TYPE as o}from"../../../../constants/index.js";import{isVerticalTable as l,createVerticalStateHandler as r,isVerticalHeader as d,basicParamsConvert as u}from"../utils.js";const s=["RADIO","SWITCH"],c=(c,a,f)=>{a.eventHooks.onCellClick.tap("useEditCell",((e,i)=>{var n,o;const{uuid:d}=i;if(!d||!l(i))return;const{row:u,$columnIndex:s,column:c}=e,a=f(d);if(!a||!c.editRender)return;const v=r(a).getTableConfig("editConfig.beforeEditMethod");!t(v)||v(e)?a.editCell=u&&s<=(null!=(o=null==(n=a.fixedLeftVerticalData)?void 0:n.length)?o:0)?{row:u,column:c}:null:a.editCell=null})),c.config.tap("useEditCell",((i,n)=>(i.uuid&&(n.editStateEvent&&window.removeEventListener("click",n.editStateEvent,{capture:!0}),n.editStateEvent=t=>{e(t.target,(e=>e.getAttribute("uuid")===i.uuid||e.classList.contains("vxe-table--ignore-clear")))||(n.editCell=null)},window.addEventListener("click",n.editStateEvent,{capture:!0})),i.editConfig={...i.editConfig,showIcon:!1,beforeEditMethod(e){var i;const{row:l,column:c}=e,{originalField:a={}}=l;if(d(c.field))return!1;const{editRender:{name:f=o.DEFAULT}={}}=a;if(Object.values(o).concat(s).includes(f))return!1;if(null==(i=a.slots)?void 0:i.default)return!!a.slots.edit;const v=r(n).getTableConfig("editConfig.beforeEditMethod");return!t(v)||v(u(e,n))}},i))),a.setupHooks.setup.tap("Vertical-UseEditCell",(e=>{i((()=>{const{uuid:t}=n(e)||{};if(!t)return;const i=f(t);i.editStateEvent&&window.removeEventListener("click",i.editStateEvent,{capture:!0})}))}))};export{c as useEditCell};
+import { findAncestor } from '../../../../../../../shared/utils/index.js';
+import { isFunction } from 'lodash-es';
+import { onBeforeUnmount, unref } from 'vue';
+import { WIDGET_TYPE } from '../../../../constants/index.js';
+import { isVerticalTable, createVerticalStateHandler, isVerticalHeader, basicParamsConvert } from '../utils.js';
+
+const IgnoreEditStateWidgets = ["RADIO", "SWITCH"];
+const useEditCell = (verticalTableHooks, hooks, getVerticalState) => {
+  hooks.eventHooks.onCellClick.tap("useEditCell", (payload, config) => {
+    var _a, _b;
+    const {
+      uuid
+    } = config;
+    if (!uuid || !isVerticalTable(config))
+      return;
+    const {
+      row,
+      $columnIndex,
+      column
+    } = payload;
+    const verticalState = getVerticalState(uuid);
+    if (!verticalState || !column.editRender)
+      return;
+    const beforeEditMethod = createVerticalStateHandler(verticalState).getTableConfig("editConfig.beforeEditMethod");
+    if (isFunction(beforeEditMethod) && !beforeEditMethod(payload)) {
+      verticalState.editCell = null;
+      return;
+    }
+    verticalState.editCell = row && $columnIndex <= ((_b = (_a = verticalState.fixedLeftVerticalData) == null ? void 0 : _a.length) != null ? _b : 0) ? {
+      row,
+      column
+    } : null;
+  });
+  verticalTableHooks.config.tap("useEditCell", (config, verticalState) => {
+    if (config.uuid) {
+      verticalState.editStateEvent && window.removeEventListener("click", verticalState.editStateEvent, {
+        capture: true
+      });
+      verticalState.editStateEvent = (event) => {
+        const inTable = findAncestor(event.target, (ele) => ele.getAttribute("uuid") === config.uuid || ele.classList.contains("vxe-table--ignore-clear"));
+        if (!inTable)
+          verticalState.editCell = null;
+      };
+      window.addEventListener("click", verticalState.editStateEvent, {
+        capture: true
+      });
+    }
+    config.editConfig = {
+      ...config.editConfig,
+      showIcon: false,
+      beforeEditMethod(payload) {
+        var _a;
+        const {
+          row,
+          column
+        } = payload;
+        const {
+          originalField = {}
+        } = row;
+        if (isVerticalHeader(column.field))
+          return false;
+        const {
+          editRender: {
+            name = WIDGET_TYPE.DEFAULT
+          } = {}
+        } = originalField;
+        const notEditableType = Object.values(WIDGET_TYPE).concat(IgnoreEditStateWidgets);
+        if (notEditableType.includes(name))
+          return false;
+        if ((_a = originalField.slots) == null ? void 0 : _a.default)
+          return !!originalField.slots.edit;
+        const beforeEditMethod = createVerticalStateHandler(verticalState).getTableConfig("editConfig.beforeEditMethod");
+        if (isFunction(beforeEditMethod)) {
+          return beforeEditMethod(basicParamsConvert(payload, verticalState));
+        }
+        return true;
+      }
+    };
+    return config;
+  });
+  hooks.setupHooks.setup.tap("Vertical-UseEditCell", (configRef) => {
+    onBeforeUnmount(() => {
+      const {
+        uuid
+      } = unref(configRef) || {};
+      if (!uuid)
+        return;
+      const verticalState = getVerticalState(uuid);
+      verticalState.editStateEvent && window.removeEventListener("click", verticalState.editStateEvent, {
+        capture: true
+      });
+    });
+  });
+};
+
+export { useEditCell };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useEventConvert.js

@@ -1 +1,46 @@
-import{isObject as e}from"lodash-es";import{unref as l}from"vue";import{isVerticalTable as t,basicParamsConvert as r}from"../utils.js";const c=(c,o,i)=>{o.eventHooks.beforeEvent.tap("Vertical--useEventConvert",((c,o,a,n)=>{var d;if(!e(c))return c;const v=null==(d=l(o))?void 0:d.uuid;if(!v||!t(o))return c;const u=c,b=i(v),{$table:k,$event:s,cell:C}=u,m=r(u,b),h=m.type;return u.column&&("headerCellClick"===n&&"body"===h?n="cellClick":"cellClick"===n&&"header"===h&&(n="headerCellClick"),"headerCellDblclick"===n&&"body"===h?n="cellDblclick":"cellDblclick"===n&&"header"===h&&(n="headerCellDblclick")),{_originalPayload:u,$table:k,$event:s,cell:C,...m,eventName:n,verticalState:b}}))};export{c as useEventConvert};
+import { isObject } from 'lodash-es';
+import { unref } from 'vue';
+import { isVerticalTable, basicParamsConvert } from '../utils.js';
+
+const useEventConvert = (_, hooks, getVerticalState) => {
+  hooks.eventHooks.beforeEvent.tap("Vertical--useEventConvert", (payload, config, context, eventName) => {
+    var _a;
+    if (!isObject(payload))
+      return payload;
+    const uuid = (_a = unref(config)) == null ? void 0 : _a.uuid;
+    if (!uuid || !isVerticalTable(config))
+      return payload;
+    const _payload = payload;
+    const verticalState = getVerticalState(uuid);
+    const {
+      $table,
+      $event,
+      cell
+    } = _payload;
+    const convertedPayload = basicParamsConvert(_payload, verticalState);
+    const type = convertedPayload.type;
+    if (_payload.column) {
+      if (eventName === "headerCellClick" && type === "body") {
+        eventName = "cellClick";
+      } else if (eventName === "cellClick" && type === "header") {
+        eventName = "headerCellClick";
+      }
+      if (eventName === "headerCellDblclick" && type === "body") {
+        eventName = "cellDblclick";
+      } else if (eventName === "cellDblclick" && type === "header") {
+        eventName = "headerCellDblclick";
+      }
+    }
+    return {
+      _originalPayload: _payload,
+      $table,
+      $event,
+      cell,
+      ...convertedPayload,
+      eventName,
+      verticalState
+    };
+  });
+};
+
+export { useEventConvert };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useExpose.js

@@ -1 +1,18 @@
-const e=(e,a)=>{a.exposeHooks.expose.tap("Vertical--useExpose",((e,a,t)=>Object.assign(e,{verticalTable:{...e.verticalTable,update(){a.value.uuid&&(t.updateConfigRef(),t.updateFieldListRef(),t.updateTableDataRef())}}})))};export{e as useExpose};
+const useExpose = (_, hooks) => {
+  hooks.exposeHooks.expose.tap("Vertical--useExpose", (expose, config, context) => {
+    return Object.assign(expose, {
+      verticalTable: {
+        ...expose.verticalTable,
+        update() {
+          if (!config.value.uuid)
+            return;
+          context.updateConfigRef();
+          context.updateFieldListRef();
+          context.updateTableDataRef();
+        }
+      }
+    });
+  });
+};
+
+export { useExpose };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useHeaderCSS.js

@@ -1 +1,45 @@
-import{isVerticalHeader as e,getOriginFieldFromRowData as t,getSpanInfo as l}from"../utils.js";const n=n=>{n.cellStyle.tap("useHeaderCSS",((n,{column:c,row:s})=>(e(c.field)||(s&&["checkbox","radio","seq"].includes(t(s).type||"")&&Object.assign(n,{textAlign:"center"}),Object.assign(n,{textShadow:"none"})),s&&l({row:s,column:c}).colspan>1&&Object.assign(n,{textAlign:"center"}),c.colSpan>1&&Object.assign(n,{textAlign:"center"}),n))),n.cellClassName.tap("useHeaderCSS",((t,{column:l})=>{const n=e(l.field);return Object.assign(t,{"vxe-header--column":n,"vxe-table--header":n,[l.field.replaceAll("_parent","")]:!0})}))};export{n as useHeaderCSS};
+import { isVerticalHeader, getOriginFieldFromRowData, getSpanInfo } from '../utils.js';
+
+const useHeaderCSS = (verticalTableHooks) => {
+  verticalTableHooks.cellStyle.tap("useHeaderCSS", (styles, {
+    column,
+    row
+  }) => {
+    if (!isVerticalHeader(column.field)) {
+      if (row && ["checkbox", "radio", "seq"].includes(getOriginFieldFromRowData(row).type || "")) {
+        Object.assign(styles, {
+          textAlign: "center"
+        });
+      }
+      Object.assign(styles, {
+        textShadow: "none"
+      });
+    }
+    if (row && getSpanInfo({
+      row,
+      column
+    }).colspan > 1) {
+      Object.assign(styles, {
+        textAlign: "center"
+      });
+    }
+    if (column.colSpan > 1) {
+      Object.assign(styles, {
+        textAlign: "center"
+      });
+    }
+    return styles;
+  });
+  verticalTableHooks.cellClassName.tap("useHeaderCSS", (classes, {
+    column
+  }) => {
+    const _isVerticalHeader = isVerticalHeader(column.field);
+    return Object.assign(classes, {
+      "vxe-header--column": _isVerticalHeader,
+      "vxe-table--header": _isVerticalHeader,
+      [column.field.replaceAll("_parent", "")]: true
+    });
+  });
+};
+
+export { useHeaderCSS };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useHoverColumn.js

@@ -1 +1,77 @@
-import{useThrottleFn as o}from"@vueuse/core";import{promiseTimeout as e}from"@vueuse/shared";import{unref as r}from"vue";import{createVerticalStateHandler as n,getVerticalInfoFromEvent as l}from"../utils.js";const u=(u,i,t)=>{u.config.tap("useHoverColumn",((r,u)=>{if(!n(u).getTableConfig("rowConfig.isHover"))return r;function i(o){var e,n;if(o){const r=l(o);if(i(),!r||"body"!==r.type)return;u.hoveringRow=null!=(n=null==(e=u.originalData)?void 0:e[r.sequence])?n:null,u.hoveringFieldKey=r.fieldKey,t(r.fieldKey).forEach((o=>{o.style.backgroundColor||(o.style.backgroundColor="var(--c-hover-color)")}))}else i();function i(){u.hoveringRow=null;const o=u.hoveringFieldKey;o&&(t(o).forEach((o=>{"var(--c-hover-color)"===o.style.backgroundColor&&(o.style.backgroundColor="")})),u.hoveringFieldKey=null)}function t(o){const e=r.uuid;if(!e)return[];const n=document.querySelector(`[uuid="${e}"]`);return n?Array.from(n.querySelectorAll(`.${o}`)):[]}}return Object.assign(r,{onMousemove:o(i,100),async onMouseleave(){await e(101),i()},async onScroll(){i()}})})),i.exposeHooks.expose.tap("VerticalTable-useHoverColumn",((o,e)=>Object.assign(o,{verticalTable:{...o.verticalTable,getHoveringRow:()=>{var o;const n=null==(o=r(e))?void 0:o.uuid;return n?t(n).hoveringRow:null}}})))};export{u as useHoverColumn};
+import { useThrottleFn } from '@vueuse/core';
+import { promiseTimeout } from '@vueuse/shared';
+import { unref } from 'vue';
+import { createVerticalStateHandler, getVerticalInfoFromEvent } from '../utils.js';
+
+const useHoverColumn = (verticalTableHooks, hooks, getVerticalState) => {
+  verticalTableHooks.config.tap("useHoverColumn", (config, verticalState) => {
+    const verticalHandler = createVerticalStateHandler(verticalState);
+    if (!verticalHandler.getTableConfig("rowConfig.isHover"))
+      return config;
+    function setHoveringRow(event) {
+      var _a, _b;
+      if (event) {
+        const info = getVerticalInfoFromEvent(event);
+        clear();
+        if (!info || info.type !== "body")
+          return;
+        verticalState.hoveringRow = (_b = (_a = verticalState.originalData) == null ? void 0 : _a[info.sequence]) != null ? _b : null;
+        verticalState.hoveringFieldKey = info.fieldKey;
+        getAllColumnElement(info.fieldKey).forEach((element) => {
+          if (element.style.backgroundColor)
+            return;
+          element.style.backgroundColor = "var(--c-hover-color)";
+        });
+      } else {
+        clear();
+      }
+      function clear() {
+        verticalState.hoveringRow = null;
+        const fieldKey = verticalState.hoveringFieldKey;
+        if (!fieldKey)
+          return;
+        getAllColumnElement(fieldKey).forEach((element) => {
+          if (element.style.backgroundColor !== "var(--c-hover-color)")
+            return;
+          element.style.backgroundColor = "";
+        });
+        verticalState.hoveringFieldKey = null;
+      }
+      function getAllColumnElement(fieldKey) {
+        const uuid = config.uuid;
+        if (!uuid)
+          return [];
+        const table = document.querySelector(`[uuid="${uuid}"]`);
+        if (!table)
+          return [];
+        return Array.from(table.querySelectorAll(`.${fieldKey}`));
+      }
+    }
+    return Object.assign(config, {
+      onMousemove: useThrottleFn(setHoveringRow, 100),
+      async onMouseleave() {
+        await promiseTimeout(101);
+        setHoveringRow();
+      },
+      async onScroll() {
+        setHoveringRow();
+      }
+    });
+  });
+  hooks.exposeHooks.expose.tap("VerticalTable-useHoverColumn", (expose, config) => {
+    return Object.assign(expose, {
+      verticalTable: {
+        ...expose.verticalTable,
+        getHoveringRow: () => {
+          var _a;
+          const uuid = (_a = unref(config)) == null ? void 0 : _a.uuid;
+          if (!uuid)
+            return null;
+          return getVerticalState(uuid).hoveringRow;
+        }
+      }
+    });
+  });
+};
+
+export { useHoverColumn };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useRowClassName.js

@@ -1 +1,65 @@
-import{isFunction as e}from"lodash-es";import{onBeforeUnmount as r}from"vue";import{basicParamsConvert as o,isVerticalHeader as t,getHeaderDepthByField as a}from"../utils.js";import{useUUIDMap as s}from"../../../../utils/index.js";const i=(i,l,n)=>{i.config.tap("vertical-rowClassName",(i=>{const u=n(i.uuid);if(!u)return i;const{originalTableConfig:m}=u;if(!m||!m.rowClassName)return i;const d=s((()=>[]),!1);return l.dataHooks.data.tap("vertical-rowClassName",((e,r,{index:o})=>{r.uuid&&(d.getItemFromUUID(r.uuid)[o]=e)})),l.setupHooks.setup.tap("vertical-rowClassName",(e=>{r((()=>{e.value.uuid&&d.removeItemFromUUID(e.value.uuid)}))})),i.cellClassName=r=>{const t=o(r,u);if("header"===t.type)return;const{rowClassName:a}=m;return e(a)?a(t):a},i.headerCellClassName=r=>{var o;if("header"===(t(r.column.field)?"header":"body"))return;const s={},i=null==(o=u.originalTableConfig)?void 0:o.uuid;if(i){const e=a(r.column.field);s.row=d.getItemFromUUID(i)[e],s.rowIndex=s.$rowIndex=s._rowIndex=e}const{rowClassName:l}=m;return e(l)?l(s):l},i}))};export{i as useRowClassName};
+import { isFunction } from 'lodash-es';
+import { onBeforeUnmount } from 'vue';
+import { basicParamsConvert, isVerticalHeader, getHeaderDepthByField } from '../utils.js';
+import { useUUIDMap } from '../../../../utils/index.js';
+
+const useRowClassName = (verticalTableHooks, hooks, getVerticalState) => {
+  verticalTableHooks.config.tap("vertical-rowClassName", (config) => {
+    const verticalState = getVerticalState(config.uuid);
+    if (!verticalState)
+      return config;
+    const {
+      originalTableConfig
+    } = verticalState;
+    if (!originalTableConfig || !originalTableConfig.rowClassName)
+      return config;
+    const dataMap = useUUIDMap(() => [], false);
+    hooks.dataHooks.data.tap("vertical-rowClassName", (data, config2, {
+      index
+    }) => {
+      if (!config2.uuid)
+        return;
+      dataMap.getItemFromUUID(config2.uuid)[index] = data;
+    });
+    hooks.setupHooks.setup.tap("vertical-rowClassName", (configRef) => {
+      onBeforeUnmount(() => {
+        if (!configRef.value.uuid)
+          return;
+        dataMap.removeItemFromUUID(configRef.value.uuid);
+      });
+    });
+    config.cellClassName = (payload) => {
+      const converted = basicParamsConvert(payload, verticalState);
+      if (converted.type === "header")
+        return;
+      const {
+        rowClassName
+      } = originalTableConfig;
+      if (isFunction(rowClassName))
+        return rowClassName(converted);
+      return rowClassName;
+    };
+    config.headerCellClassName = (payload) => {
+      var _a;
+      const type = isVerticalHeader(payload.column.field) ? "header" : "body";
+      if (type === "header")
+        return;
+      const params = {};
+      const uuid = (_a = verticalState.originalTableConfig) == null ? void 0 : _a.uuid;
+      if (uuid) {
+        const sequence = getHeaderDepthByField(payload.column.field);
+        params.row = dataMap.getItemFromUUID(uuid)[sequence];
+        params.rowIndex = params.$rowIndex = params._rowIndex = sequence;
+      }
+      const {
+        rowClassName
+      } = originalTableConfig;
+      if (isFunction(rowClassName))
+        return rowClassName(params);
+      return rowClassName;
+    };
+    return config;
+  });
+};
+
+export { useRowClassName };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useRowHeight.js

@@ -1 +1,20 @@
-import{getOriginFieldFromRowData as t}from"../utils.js";const e=(e,i,o)=>{e.cellStyle.tap("useRowHeight",((e,{row:i,column:o},r)=>{if(i){const{verticalConfig:o}=t(i)||{};o&&o.rowHeight>0&&(e["--iho-table-vertical-table-min-height"]=`${o.rowHeight}px`)}return e}))};export{e as useRowHeight};
+import { getOriginFieldFromRowData } from '../utils.js';
+
+const useRowHeight = (verticalTableHooks, hooks, getVerticalState) => {
+  verticalTableHooks.cellStyle.tap("useRowHeight", (styles, {
+    row,
+    column
+  }, verticalState) => {
+    if (row) {
+      const {
+        verticalConfig
+      } = getOriginFieldFromRowData(row) || {};
+      if (verticalConfig && verticalConfig.rowHeight > 0) {
+        styles["--iho-table-vertical-table-min-height"] = `${verticalConfig.rowHeight}px`;
+      }
+    }
+    return styles;
+  });
+};
+
+export { useRowHeight };

package/es/components/iho-table/src/plugins/verticalTablePlugin/src/hooks/useTriggerRow.js

@@ -1 +1,35 @@
-import{isVerticalTable as e,createVerticalStateHandler as o}from"../utils.js";const r=(r,i,t)=>{i.eventHooks.onCellClick.tap("useTriggerRow",((r,i,{emits:c})=>{var n,g;const{uuid:l}=i;if(!l||!e(i))return;const{row:f}=r,s=t(l);if(!s||!f)return;const a=o(s);if("row"===a.getTableConfig("checkboxConfig.trigger")){const e=a.getTableConfig("checkboxConfig.checkField")||"checked";f[e]=!f[e],c("checkboxChange",{...r,checked:f[e],records:null!=(g=null==(n=s.originalData)?void 0:n.filter((o=>o[e])))?g:[]})}"row"===a.getTableConfig("radioConfig.trigger")&&(s.currentRow=f)}))};export{r as useTriggerRow};
+import { isVerticalTable, createVerticalStateHandler } from '../utils.js';
+
+const useTriggerRow = (verticalTableHooks, hooks, getVerticalState) => {
+  hooks.eventHooks.onCellClick.tap("useTriggerRow", (payload, config, {
+    emits
+  }) => {
+    var _a, _b;
+    const {
+      uuid
+    } = config;
+    if (!uuid || !isVerticalTable(config))
+      return;
+    const {
+      row
+    } = payload;
+    const verticalState = getVerticalState(uuid);
+    if (!verticalState || !row)
+      return;
+    const VerticalHandler = createVerticalStateHandler(verticalState);
+    if (VerticalHandler.getTableConfig("checkboxConfig.trigger") === "row") {
+      const checkField = VerticalHandler.getTableConfig("checkboxConfig.checkField") || "checked";
+      row[checkField] = !row[checkField];
+      emits("checkboxChange", {
+        ...payload,
+        checked: row[checkField],
+        records: (_b = (_a = verticalState.originalData) == null ? void 0 : _a.filter((item) => item[checkField])) != null ? _b : []
+      });
+    }
+    if (VerticalHandler.getTableConfig("radioConfig.trigger") === "row") {
+      verticalState.currentRow = row;
+    }
+  });
+};
+
+export { useTriggerRow };