huibo-ui 0.3.0

package/dist/collection/components/Table/Table.js

@@ -0,0 +1,860 @@
+import { h } from "@stencil/core";
+/**
+ * Table 表格组件
+ * 用于展示多条结构类似的数据，可对数据进行排序、筛选、选择等操作
+ */
+export class Table {
+    /** 数据源 */
+    data = [];
+    /** 列配置 */
+    columns = [];
+    /** 是否带斑马纹 */
+    stripe = false;
+    /** 是否带边框 */
+    border = false;
+    /** 表格尺寸 */
+    size = 'default';
+    /** 是否显示加载状态 */
+    loading = false;
+    /** 行数据的 Key */
+    rowKey = '';
+    /** 空数据文案 */
+    emptyText = '暂无数据';
+    /** 最大高度（超出固定表头） */
+    maxHeight;
+    /** 是否高亮当前行 */
+    highlightCurrentRow = false;
+    /** 是否开启行选择（显示 checkbox 列） */
+    selectable = false;
+    /** 行操作配置；非空时自动在末尾渲染「操作」列 */
+    actions = [];
+    /** 是否开启虚拟滚动（大数据量场景，默认关闭，向后兼容） */
+    virtualScroll = false;
+    /** 虚拟滚动每行预估高度(px)，用于计算撑高容器与可见窗口 */
+    itemHeight = 48;
+    /** 虚拟滚动视口高度(px)，超过此高度出现滚动条 */
+    virtualScrollHeight = 400;
+    /**
+     * 树形数据配置：传入后启用「可展开行」模式。
+     * data 行含 `children` 字段（字段名可经此配置覆盖）时渲染展开箭头。
+     * 默认 undefined —— 不启用树形。
+     */
+    treeProps;
+    /** 是否开启行内编辑模式（默认关闭）。需列配置 column.editable=true 才对该列生效 */
+    editable = false;
+    sortProp = '';
+    sortDirection = null;
+    currentRow = -1;
+    selectedRows = new Set();
+    /** 虚拟滚动：当前滚动位置(px)，驱动可见窗口计算 */
+    scrollTop = 0;
+    /** 树形模式：已展开行的 key 列表 */
+    expandedRowKeys = [];
+    /** 行内编辑：当前正在编辑的单元格 { key, prop }，null 表示无 */
+    editingCell = null;
+    /** 排序变化事件 */
+    hbSortChange;
+    /** 行点击事件 */
+    hbRowClick;
+    /** 选择变化事件 */
+    hbSelectionChange;
+    /** 行操作点击事件 */
+    hbAction;
+    /** 树形行展开/收起事件 */
+    hbExpandChange;
+    /** 行内编辑提交事件 */
+    hbCellChange;
+    handleDataChange() {
+        this.selectedRows = new Set();
+        this.emitSelection();
+    }
+    /** 树形模式是否启用（显式传入 treeProps 即启用） */
+    get isTreeMode() {
+        return !!this.treeProps;
+    }
+    /** 子节点字段名（treeProps.children 缺省回退 'children'） */
+    get childrenField() {
+        return (this.treeProps && this.treeProps.children) || 'children';
+    }
+    /**
+     * 把树拍平成可见行列表：仅保留「祖先链路全部已展开」的后代。
+     * @param list  当前层级的数组
+     * @param level 当前层级（根 = 0）
+     * @param parentKeyPath 父级 key 路径，用于构造深层稳定 key（避免不同分支同 index 撞 key）
+     */
+    flattenTree(list, level = 0, parentKeyPath = '') {
+        const field = this.childrenField;
+        const result = [];
+        list.forEach((row, i) => {
+            const keyPath = parentKeyPath ? `${parentKeyPath}.${i}` : `${i}`;
+            const key = this.rowKey ? row[this.rowKey] : keyPath;
+            const kids = row[field];
+            const hasKids = Array.isArray(kids) && kids.length > 0;
+            result.push({ row, level, key, hasChildren: hasKids, index: i });
+            // 仅当该行已展开时，递归拍入其 children
+            if (hasKids && this.expandedRowKeys.indexOf(key) !== -1) {
+                result.push(...this.flattenTree(kids, level + 1, keyPath));
+            }
+        });
+        return result;
+    }
+    /** 树形展开/收起切换 */
+    toggleExpand = (row, key) => {
+        const idx = this.expandedRowKeys.indexOf(key);
+        const expanded = idx === -1;
+        this.expandedRowKeys = expanded ? [...this.expandedRowKeys, key] : this.expandedRowKeys.filter((k) => k !== key);
+        this.hbExpandChange.emit({ expanded, row });
+    };
+    /** 行内编辑：进入编辑态 */
+    startEdit = (e, key, prop) => {
+        e.stopPropagation();
+        if (!this.editable)
+            return;
+        this.editingCell = { rowKey: key, prop };
+    };
+    /** 行内编辑：提交（回车 / 失焦 / Change） */
+    commitEdit = (e, row, prop) => {
+        const input = e.target;
+        const value = input.value;
+        // 就地更新（简单可用版）：修改 row[prop] 后强制重渲染
+        row[prop] = value;
+        this.editingCell = null;
+        this.hbCellChange.emit({ row, prop, value });
+    };
+    /** 行内编辑：回车提交 / Esc 取消 */
+    onEditKeydown = (e, row, prop) => {
+        if (e.key === 'Enter') {
+            e.preventDefault();
+            this.commitEdit(e, row, prop);
+        }
+        else if (e.key === 'Escape') {
+            e.preventDefault();
+            this.editingCell = null;
+        }
+    };
+    allCheckboxRef;
+    componentDidRender() {
+        // indeterminate 不是可反射的 HTML 属性，必须通过 DOM 属性设置
+        if (this.allCheckboxRef) {
+            this.allCheckboxRef.indeterminate = this.isIndeterminate;
+        }
+    }
+    /** 虚拟滚动上下缓冲行数 */
+    virtualBuffer = 5;
+    /** 虚拟滚动：滚动事件回调，更新 scrollTop 触发可见窗口重算 */
+    handleVirtualScroll = (e) => {
+        const target = e.target;
+        this.scrollTop = target.scrollTop;
+    };
+    /** 虚拟滚动：计算可见窗口 [startIndex, endIndex) */
+    get visibleRange() {
+        const total = this.data.length;
+        if (total === 0)
+            return { startIndex: 0, endIndex: 0 };
+        const itemHeight = this.itemHeight > 0 ? this.itemHeight : 1;
+        const viewport = this.virtualScrollHeight;
+        let startIndex = Math.floor(this.scrollTop / itemHeight) - this.virtualBuffer;
+        if (startIndex < 0)
+            startIndex = 0;
+        let endIndex = Math.ceil((this.scrollTop + viewport) / itemHeight) + this.virtualBuffer;
+        if (endIndex > total)
+            endIndex = total;
+        return { startIndex, endIndex };
+    }
+    /** 虚拟滚动：撑高容器总高度 */
+    get virtualTotalHeight() {
+        return this.data.length * (this.itemHeight > 0 ? this.itemHeight : 1);
+    }
+    handleSort = (prop) => {
+        if (this.sortProp === prop) {
+            this.sortDirection =
+                this.sortDirection === 'ascending' ? 'descending' : this.sortDirection === 'descending' ? null : 'ascending';
+        }
+        else {
+            this.sortProp = prop;
+            this.sortDirection = 'ascending';
+        }
+        this.hbSortChange.emit({ prop, order: this.sortDirection });
+    };
+    get sortedData() {
+        if (!this.sortProp || !this.sortDirection)
+            return this.data;
+        const direction = this.sortDirection === 'ascending' ? 1 : -1;
+        return [...this.data].sort((a, b) => {
+            const va = a[this.sortProp];
+            const vb = b[this.sortProp];
+            if (va < vb)
+                return -1 * direction;
+            if (va > vb)
+                return 1 * direction;
+            return 0;
+        });
+    }
+    ;
+    get isAllSelected() {
+        return this.data.length > 0 && this.selectedRows.size === this.data.length;
+    }
+    get isIndeterminate() {
+        return this.selectedRows.size > 0 && this.selectedRows.size < this.data.length;
+    }
+    toggleRow = (index, e) => {
+        e.stopPropagation();
+        const next = new Set(this.selectedRows);
+        if (next.has(index)) {
+            next.delete(index);
+        }
+        else {
+            next.add(index);
+        }
+        this.selectedRows = next;
+        this.emitSelection();
+    };
+    toggleAll = () => {
+        if (this.isAllSelected) {
+            this.selectedRows = new Set();
+        }
+        else {
+            this.selectedRows = new Set(this.data.map((_, i) => i));
+        }
+        this.emitSelection();
+    };
+    emitSelection() {
+        const selected = Array.from(this.selectedRows)
+            .sort((a, b) => a - b)
+            .map((i) => this.data[i])
+            .filter(Boolean);
+        this.hbSelectionChange.emit(selected);
+    }
+    handleRowClick = (row, index) => {
+        this.currentRow = index;
+        this.hbRowClick.emit({ row, index });
+    };
+    handleAction = (row, index, action) => {
+        this.hbAction.emit({ row, index, action });
+    };
+    get hasActions() {
+        return !!this.actions && this.actions.length > 0;
+    }
+    /** 计算固定列的 sticky 偏移（左侧/右侧累计宽度） */
+    get fixedOffsets() {
+        const result = {};
+        let leftAcc = '0px';
+        for (const c of this.columns) {
+            const side = c.fixed === true ? 'left' : c.fixed;
+            if (side === 'left') {
+                result[c.prop] = { side: 'left', left: leftAcc };
+                leftAcc = `calc(${leftAcc} + ${c.width || '0px'})`;
+            }
+        }
+        let rightAcc = '0px';
+        for (let i = this.columns.length - 1; i >= 0; i--) {
+            const c = this.columns[i];
+            if (c.fixed === 'right') {
+                result[c.prop] = { side: 'right', right: rightAcc };
+                rightAcc = `calc(${rightAcc} + ${c.width || '0px'})`;
+            }
+        }
+        return result;
+    }
+    cellStyle(prop, base) {
+        const off = this.fixedOffsets[prop];
+        const style = { ...(base || {}) };
+        if (off?.side === 'left') {
+            style.position = 'sticky';
+            style.left = off.left;
+            style.zIndex = '2';
+        }
+        else if (off?.side === 'right') {
+            style.position = 'sticky';
+            style.right = off.right;
+            style.zIndex = '2';
+        }
+        return style;
+    }
+    /**
+     * 渲染单行（普通 + 虚拟滚动 + 树形 共用）。
+     * - 普通模式：rowIndex 为在 sortedData 中的全局索引。
+     * - 树形模式：fr.level 决定缩进，第一列渲染展开箭头，key 取 fr.key。
+     * fr 为可选；未传时按普通模式渲染。
+     */
+    renderRow(row, rowIndex, fr) {
+        const tree = !!fr;
+        const level = fr ? fr.level : 0;
+        const rowKeyVal = fr ? fr.key : this.rowKey ? row[this.rowKey] : rowIndex;
+        const indent = level * 16;
+        const isEditing = (prop) => !!this.editingCell && this.editingCell.rowKey === rowKeyVal && this.editingCell.prop === prop;
+        return (h("tr", { key: rowKeyVal, class: {
+                'hb-table__row': true,
+                'hb-table__row--striped': this.stripe && rowIndex % 2 === 1,
+                'hb-table__row--current': this.highlightCurrentRow && rowIndex === this.currentRow,
+                'hb-table__row--selected': this.selectedRows.has(rowIndex),
+                'hb-table__row--tree': tree,
+            }, onClick: () => this.handleRowClick(row, rowIndex) }, this.selectable && (h("td", { class: "hb-table__selection", onClick: (e) => e.stopPropagation() }, h("input", { type: "checkbox", class: "hb-table__checkbox", checked: this.selectedRows.has(rowIndex), onChange: (e) => this.toggleRow(rowIndex, e) }))), this.columns.map((col, colIdx) => {
+            const off = this.fixedOffsets[col.prop];
+            // 树形模式：第一列加缩进 + 展开箭头
+            const isFirstCol = colIdx === 0;
+            const showExpand = tree && isFirstCol && fr.hasChildren;
+            const expanded = showExpand && this.expandedRowKeys.indexOf(rowKeyVal) !== -1;
+            const editing = this.editable && !!col.editable && isEditing(col.prop);
+            const editableActive = this.editable && !!col.editable;
+            return (h("td", { key: col.prop, style: this.cellStyle(col.prop, { textAlign: col.align || 'left' }), class: {
+                    'hb-table__td': true,
+                    'hb-table__cell--fixed-left': off?.side === 'left',
+                    'hb-table__cell--fixed-right': off?.side === 'right',
+                    'hb-table__cell--editable': editableActive,
+                }, onClick: editableActive ? (e) => this.startEdit(e, rowKeyVal, col.prop) : undefined }, tree && isFirstCol && (h("span", { class: "hb-table__indent", style: { display: 'inline-block', width: `${indent}px` }, "aria-hidden": "true" })), showExpand && (h("button", { type: "button", class: { 'hb-table__expand': true, 'hb-table__expand--expanded': expanded }, "aria-label": expanded ? '收起' : '展开', onClick: (e) => {
+                    e.stopPropagation();
+                    this.toggleExpand(row, rowKeyVal);
+                } }, expanded ? '▼' : '▶')), showExpand === false && tree && isFirstCol && (h("span", { class: "hb-table__expand-placeholder", style: { display: 'inline-block', width: '16px' }, "aria-hidden": "true" })), editing ? (h("input", { class: "hb-table__edit-input", type: "text", value: row[col.prop] ?? '', onBlur: (e) => this.commitEdit(e, row, col.prop), onKeyDown: (e) => this.onEditKeydown(e, row, col.prop) })) : (h("slot", { name: `cell-${col.prop}` }, col.formatter ? col.formatter(row, rowIndex) : row[col.prop] ?? ''))));
+        }), this.hasActions && (h("td", { class: "hb-table__td--actions", style: { textAlign: 'right', whiteSpace: 'nowrap' }, onClick: (e) => e.stopPropagation() }, this.actions.map((act) => (h("button", { type: "button", class: {
+                'hb-table__action': true,
+                'hb-table__action--primary': act.type === 'primary',
+                'hb-table__action--danger': act.type === 'danger',
+            }, disabled: act.disabled ? act.disabled(row, rowIndex) : false, onClick: () => this.handleAction(row, rowIndex, act.key) }, act.label)))))));
+    }
+    /** 渲染表头（普通 + 虚拟滚动共用，表头始终固定不随滚） */
+    renderHeader() {
+        return (h("thead", null, h("tr", null, this.selectable && (h("th", { class: "hb-table__selection" }, h("input", { type: "checkbox", class: "hb-table__checkbox", checked: this.isAllSelected, ref: (el) => {
+                this.allCheckboxRef = el;
+            }, onChange: this.toggleAll }))), this.columns.map((col) => {
+            const off = this.fixedOffsets[col.prop];
+            return (h("th", { key: col.prop, style: this.cellStyle(col.prop, {
+                    width: col.width,
+                    minWidth: col.minWidth,
+                    textAlign: col.align || 'left',
+                }), class: {
+                    'hb-table__th--sortable': col.sortable,
+                    'hb-table__cell--fixed-left': off?.side === 'left',
+                    'hb-table__cell--fixed-right': off?.side === 'right',
+                }, onClick: col.sortable ? () => this.handleSort(col.prop) : undefined }, h("div", { class: "hb-table__th-content" }, h("span", null, col.label), col.sortable && (h("span", { class: "hb-table__sort" }, h("span", { class: { 'hb-table__sort-icon': true, 'hb-table__sort-icon--active': this.sortProp === col.prop && this.sortDirection === 'ascending' } }, "\u25B2"), h("span", { class: { 'hb-table__sort-icon': true, 'hb-table__sort-icon--active': this.sortProp === col.prop && this.sortDirection === 'descending' } }, "\u25BC"))))));
+        }), this.hasActions && (h("th", { class: "hb-table__th--actions", style: { textAlign: 'right', whiteSpace: 'nowrap' } }, "\u64CD\u4F5C")))));
+    }
+    render() {
+        const displayData = this.sortedData;
+        const isEmpty = displayData.length === 0;
+        // 树形模式：把可见树拍平成带 level 的行列表（仅含已展开链路上的后代）
+        const flatRows = this.isTreeMode ? this.flattenTree(displayData) : [];
+        // 虚拟滚动：固定高度滚动视口 + 撑高容器 + 仅渲染可见窗口行（绝对定位 offset）
+        // 注意：树形 + 虚拟滚动组合较复杂，此处虚拟滚动沿用普通行渲染（不展开树），
+        // 保留树形仅在普通模式下生效以降低风险。
+        const renderVirtualBody = () => {
+            const { startIndex, endIndex } = this.visibleRange;
+            const offsetTop = startIndex * (this.itemHeight > 0 ? this.itemHeight : 1);
+            return (h("div", { class: "hb-table__virtual-viewport", style: { height: `${this.virtualScrollHeight}px`, overflowY: 'auto' }, onScroll: this.handleVirtualScroll }, h("div", { class: "hb-table__virtual-spacer", style: { height: `${this.virtualTotalHeight}px`, position: 'relative' } }, h("table", { class: "hb-table__table hb-table__table--virtual" }, h("tbody", null, isEmpty ? (h("tr", null, h("td", { colSpan: this.columns.length + (this.selectable ? 1 : 0) + (this.hasActions ? 1 : 0), class: "hb-table__empty" }, this.emptyText))) : (h("tr", { style: { height: `${offsetTop}px` }, "aria-hidden": "true" })), displayData.slice(startIndex, endIndex).map((row, i) => this.renderRow(row, startIndex + i)))))));
+        };
+        // 普通模式：树形启用时按拍平列表渲染（带 level 缩进 + 展开箭头），否则原样按行渲染
+        const renderNormalBody = () => (h("tbody", null, isEmpty ? (h("tr", null, h("td", { colSpan: this.columns.length + (this.selectable ? 1 : 0) + (this.hasActions ? 1 : 0), class: "hb-table__empty" }, this.emptyText))) : this.isTreeMode ? (flatRows.map((fr, i) => this.renderRow(fr.row, i, fr))) : (displayData.map((row, rowIndex) => this.renderRow(row, rowIndex)))));
+        return (h("div", { class: { 'hb-table': true, [`hb-table--${this.size}`]: true, 'hb-table--border': this.border, 'hb-table--virtual': this.virtualScroll } }, this.loading && (h("div", { class: "hb-table__loading" }, h("div", { class: "hb-table__loading-spinner" }))), this.virtualScroll ? (h("div", { class: "hb-table__virtual-wrapper" }, h("table", { class: "hb-table__table" }, this.renderHeader()), renderVirtualBody())) : (h("div", { class: "hb-table__wrapper", style: this.maxHeight ? { maxHeight: this.maxHeight, overflow: 'auto' } : undefined }, h("table", { class: "hb-table__table" }, this.renderHeader(), renderNormalBody())))));
+    }
+    static get is() { return "hb-table"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["table.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["table.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "data": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Record<string, any>[]",
+                    "resolved": "Record<string, any>[]",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u6570\u636E\u6E90"
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "columns": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "TableColumn[]",
+                    "resolved": "TableColumn[]",
+                    "references": {
+                        "TableColumn": {
+                            "location": "local",
+                            "path": "/Users/vscoderwhy/Desktop/product/web-common/huibo-ui/src/components/Table/Table.tsx",
+                            "id": "src/components/Table/Table.tsx::TableColumn"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u5217\u914D\u7F6E"
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "stripe": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u5E26\u6591\u9A6C\u7EB9"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "stripe",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "border": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u5E26\u8FB9\u6846"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "border",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'large' | 'default' | 'small'",
+                    "resolved": "\"default\" | \"large\" | \"small\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u8868\u683C\u5C3A\u5BF8"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "size",
+                "reflect": false,
+                "defaultValue": "'default'"
+            },
+            "loading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u663E\u793A\u52A0\u8F7D\u72B6\u6001"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "loading",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "rowKey": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u884C\u6570\u636E\u7684 Key"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "row-key",
+                "reflect": false,
+                "defaultValue": "''"
+            },
+            "emptyText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u7A7A\u6570\u636E\u6587\u6848"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "empty-text",
+                "reflect": false,
+                "defaultValue": "'\u6682\u65E0\u6570\u636E'"
+            },
+            "maxHeight": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u6700\u5927\u9AD8\u5EA6\uFF08\u8D85\u51FA\u56FA\u5B9A\u8868\u5934\uFF09"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "max-height",
+                "reflect": false
+            },
+            "highlightCurrentRow": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u9AD8\u4EAE\u5F53\u524D\u884C"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "highlight-current-row",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "selectable": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u5F00\u542F\u884C\u9009\u62E9\uFF08\u663E\u793A checkbox \u5217\uFF09"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "selectable",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "actions": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "TableAction[]",
+                    "resolved": "TableAction[]",
+                    "references": {
+                        "TableAction": {
+                            "location": "local",
+                            "path": "/Users/vscoderwhy/Desktop/product/web-common/huibo-ui/src/components/Table/Table.tsx",
+                            "id": "src/components/Table/Table.tsx::TableAction"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u884C\u64CD\u4F5C\u914D\u7F6E\uFF1B\u975E\u7A7A\u65F6\u81EA\u52A8\u5728\u672B\u5C3E\u6E32\u67D3\u300C\u64CD\u4F5C\u300D\u5217"
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "virtualScroll": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u5F00\u542F\u865A\u62DF\u6EDA\u52A8\uFF08\u5927\u6570\u636E\u91CF\u573A\u666F\uFF0C\u9ED8\u8BA4\u5173\u95ED\uFF0C\u5411\u540E\u517C\u5BB9\uFF09"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "virtual-scroll",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "itemHeight": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u865A\u62DF\u6EDA\u52A8\u6BCF\u884C\u9884\u4F30\u9AD8\u5EA6(px)\uFF0C\u7528\u4E8E\u8BA1\u7B97\u6491\u9AD8\u5BB9\u5668\u4E0E\u53EF\u89C1\u7A97\u53E3"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "item-height",
+                "reflect": false,
+                "defaultValue": "48"
+            },
+            "virtualScrollHeight": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u865A\u62DF\u6EDA\u52A8\u89C6\u53E3\u9AD8\u5EA6(px)\uFF0C\u8D85\u8FC7\u6B64\u9AD8\u5EA6\u51FA\u73B0\u6EDA\u52A8\u6761"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "virtual-scroll-height",
+                "reflect": false,
+                "defaultValue": "400"
+            },
+            "treeProps": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "TableTreeProps",
+                    "resolved": "TableTreeProps",
+                    "references": {
+                        "TableTreeProps": {
+                            "location": "local",
+                            "path": "/Users/vscoderwhy/Desktop/product/web-common/huibo-ui/src/components/Table/Table.tsx",
+                            "id": "src/components/Table/Table.tsx::TableTreeProps"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u6811\u5F62\u6570\u636E\u914D\u7F6E\uFF1A\u4F20\u5165\u540E\u542F\u7528\u300C\u53EF\u5C55\u5F00\u884C\u300D\u6A21\u5F0F\u3002\ndata \u884C\u542B `children` \u5B57\u6BB5\uFF08\u5B57\u6BB5\u540D\u53EF\u7ECF\u6B64\u914D\u7F6E\u8986\u76D6\uFF09\u65F6\u6E32\u67D3\u5C55\u5F00\u7BAD\u5934\u3002\n\u9ED8\u8BA4 undefined \u2014\u2014 \u4E0D\u542F\u7528\u6811\u5F62\u3002"
+                },
+                "getter": false,
+                "setter": false
+            },
+            "editable": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "\u662F\u5426\u5F00\u542F\u884C\u5185\u7F16\u8F91\u6A21\u5F0F\uFF08\u9ED8\u8BA4\u5173\u95ED\uFF09\u3002\u9700\u5217\u914D\u7F6E column.editable=true \u624D\u5BF9\u8BE5\u5217\u751F\u6548"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "editable",
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "sortProp": {},
+            "sortDirection": {},
+            "currentRow": {},
+            "selectedRows": {},
+            "scrollTop": {},
+            "expandedRowKeys": {},
+            "editingCell": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "hbSortChange",
+                "name": "hbSortChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u6392\u5E8F\u53D8\u5316\u4E8B\u4EF6"
+                },
+                "complexType": {
+                    "original": "{ prop: string; order: SortDirection }",
+                    "resolved": "{ prop: string; order: SortDirection; }",
+                    "references": {
+                        "SortDirection": {
+                            "location": "local",
+                            "path": "/Users/vscoderwhy/Desktop/product/web-common/huibo-ui/src/components/Table/Table.tsx",
+                            "id": "src/components/Table/Table.tsx::SortDirection"
+                        }
+                    }
+                }
+            }, {
+                "method": "hbRowClick",
+                "name": "hbRowClick",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u884C\u70B9\u51FB\u4E8B\u4EF6"
+                },
+                "complexType": {
+                    "original": "{ row: Record<string, any>; index: number }",
+                    "resolved": "{ row: Record<string, any>; index: number; }",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                }
+            }, {
+                "method": "hbSelectionChange",
+                "name": "hbSelectionChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u9009\u62E9\u53D8\u5316\u4E8B\u4EF6"
+                },
+                "complexType": {
+                    "original": "Record<string, any>[]",
+                    "resolved": "Record<string, any>[]",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                }
+            }, {
+                "method": "hbAction",
+                "name": "hbAction",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u884C\u64CD\u4F5C\u70B9\u51FB\u4E8B\u4EF6"
+                },
+                "complexType": {
+                    "original": "{ row: Record<string, any>; index: number; action: string }",
+                    "resolved": "{ row: Record<string, any>; index: number; action: string; }",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                }
+            }, {
+                "method": "hbExpandChange",
+                "name": "hbExpandChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u6811\u5F62\u884C\u5C55\u5F00/\u6536\u8D77\u4E8B\u4EF6"
+                },
+                "complexType": {
+                    "original": "{ expanded: boolean; row: Record<string, any> }",
+                    "resolved": "{ expanded: boolean; row: Record<string, any>; }",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                }
+            }, {
+                "method": "hbCellChange",
+                "name": "hbCellChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u884C\u5185\u7F16\u8F91\u63D0\u4EA4\u4E8B\u4EF6"
+                },
+                "complexType": {
+                    "original": "{ row: Record<string, any>; prop: string; value: any }",
+                    "resolved": "{ row: Record<string, any>; prop: string; value: any; }",
+                    "references": {
+                        "Record": {
+                            "location": "global",
+                            "id": "global::Record"
+                        }
+                    }
+                }
+            }];
+    }
+    static get watchers() {
+        return [{
+                "propName": "data",
+                "methodName": "handleDataChange"
+            }];
+    }
+}
+//# sourceMappingURL=Table.js.map