@yh-ui/components 0.1.17 → 0.1.22

package/dist/table/__tests__/table.test.cjs

@@ -1,682 +0,0 @@
-"use strict";
-
-var _vitest = require("vitest");
-var _testUtils = require("@vue/test-utils");
-var _vue = require("vue");
-var _index = require("../index.cjs");
-const mockData = [{
-  id: 1,
-  name: "\u5F20\u4E09",
-  age: 28,
-  address: "\u5317\u4EAC\u5E02\u671D\u9633\u533A"
-}, {
-  id: 2,
-  name: "\u674E\u56DB",
-  age: 32,
-  address: "\u4E0A\u6D77\u5E02\u6D66\u4E1C\u65B0\u533A"
-}, {
-  id: 3,
-  name: "\u738B\u4E94",
-  age: 25,
-  address: "\u5E7F\u5DDE\u5E02\u5929\u6CB3\u533A"
-}, {
-  id: 4,
-  name: "\u8D75\u516D",
-  age: 30,
-  address: "\u6DF1\u5733\u5E02\u5357\u5C71\u533A"
-}];
-const mockColumns = [{
-  prop: "name",
-  label: "\u59D3\u540D",
-  width: 100
-}, {
-  prop: "age",
-  label: "\u5E74\u9F84",
-  width: 80,
-  sortable: true
-}, {
-  prop: "address",
-  label: "\u5730\u5740"
-}];
-(0, _vitest.describe)("Table", () => {
-  (0, _vitest.it)("should render basic table", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      },
-      global: {
-        stubs: {
-          YhPagination: true,
-          YhSelect: true,
-          YhOption: true,
-          YhInput: true,
-          YhTooltip: true
-        }
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table").exists()).toBe(true);
-    (0, _vitest.expect)(wrapper.findAll(".yh-table__header-cell").length).toBe(3);
-    (0, _vitest.expect)(wrapper.findAll(".yh-table__row").length).toBe(4);
-  });
-  (0, _vitest.it)("should render with border", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        border: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.classes()).toContain("is-border");
-  });
-  (0, _vitest.it)("should render with stripe", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        stripe: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.classes()).toContain("is-stripe");
-  });
-  (0, _vitest.it)("should support different sizes", () => {
-    const sizes = ["large", "default", "small"];
-    sizes.forEach(size => {
-      const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-        props: {
-          data: mockData,
-          columns: mockColumns,
-          size
-        }
-      });
-      (0, _vitest.expect)(wrapper.classes()).toContain(`yh-table--${size}`);
-    });
-  });
-  (0, _vitest.it)("should show empty text when no data", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: [],
-        columns: mockColumns,
-        emptyText: "\u6682\u65E0\u6570\u636E"
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table__empty").exists()).toBe(true);
-    (0, _vitest.expect)(wrapper.find(".yh-table__empty-text").text()).toBe("\u6682\u65E0\u6570\u636E");
-  });
-  (0, _vitest.it)("should hide header when showHeader is false", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        showHeader: false
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table__header-wrapper").exists()).toBe(false);
-  });
-  (0, _vitest.it)("should emit row-click event", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      }
-    });
-    const row = wrapper.find(".yh-table__row");
-    await row.trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("row-click")).toBeTruthy();
-    (0, _vitest.expect)(wrapper.emitted("row-click")[0][0]).toEqual(mockData[0]);
-  });
-  (0, _vitest.it)("should emit row-dblclick event", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      }
-    });
-    const row = wrapper.find(".yh-table__row");
-    await row.trigger("dblclick");
-    (0, _vitest.expect)(wrapper.emitted("row-dblclick")).toBeTruthy();
-  });
-  (0, _vitest.it)("should highlight current row", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        highlightCurrentRow: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.classes()).toContain("is-highlight-current-row");
-    const row = wrapper.find(".yh-table__row");
-    await row.trigger("click");
-    (0, _vitest.expect)(row.classes()).toContain("is-current");
-  });
-  (0, _vitest.it)("should render selection column", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "checkbox"
-        }
-      }
-    });
-    (0, _vitest.expect)(wrapper.findAll(".yh-table__selection-cell").length).toBeGreaterThan(0);
-  });
-  (0, _vitest.it)("should render index column", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        showIndex: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.findAll(".yh-table__index-cell").length).toBeGreaterThan(0);
-  });
-  (0, _vitest.it)("should render sortable column", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      }
-    });
-    const sortableHeader = wrapper.find(".yh-table__header-cell.is-sortable");
-    (0, _vitest.expect)(sortableHeader.exists()).toBe(true);
-  });
-  (0, _vitest.it)("should emit sort-change event", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      }
-    });
-    const sortableHeader = wrapper.find(".yh-table__header-cell.is-sortable");
-    await sortableHeader.trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("sort-change")).toBeTruthy();
-  });
-  (0, _vitest.it)("should render with fixed height", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        height: 300
-      }
-    });
-    (0, _vitest.expect)(wrapper.attributes("style")).toContain("height: 300px");
-  });
-  (0, _vitest.it)("should render with max height", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        maxHeight: 400
-      }
-    });
-    (0, _vitest.expect)(wrapper.attributes("style")).toContain("max-height: 400px");
-  });
-  (0, _vitest.it)("should expose getSelectionRows method", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "checkbox"
-        }
-      }
-    });
-    const tableInstance = wrapper.vm;
-    (0, _vitest.expect)(typeof tableInstance.getSelectionRows).toBe("function");
-    (0, _vitest.expect)(tableInstance.getSelectionRows()).toEqual([]);
-  });
-  (0, _vitest.it)("should expose toggleRowSelection method", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "checkbox"
-        }
-      }
-    });
-    const tableInstance = wrapper.vm;
-    tableInstance.toggleRowSelection(mockData[0], true);
-    await (0, _vue.nextTick)();
-    (0, _vitest.expect)(tableInstance.getSelectionRows()).toContainEqual(mockData[0]);
-  });
-  (0, _vitest.it)("should expose clearSelection method", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "checkbox"
-        }
-      }
-    });
-    const tableInstance = wrapper.vm;
-    tableInstance.toggleRowSelection(mockData[0], true);
-    await (0, _vue.nextTick)();
-    tableInstance.clearSelection();
-    await (0, _vue.nextTick)();
-    (0, _vitest.expect)(tableInstance.getSelectionRows()).toEqual([]);
-  });
-  (0, _vitest.it)("should expose sort method", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      }
-    });
-    const tableInstance = wrapper.vm;
-    tableInstance.sort("age", "asc");
-    await (0, _vue.nextTick)();
-    (0, _vitest.expect)(wrapper.emitted("sort-change")).toBeFalsy();
-  });
-  (0, _vitest.it)("should expose clearSort method", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      }
-    });
-    const tableInstance = wrapper.vm;
-    tableInstance.sort("age", "asc");
-    await (0, _vue.nextTick)();
-    tableInstance.clearSort();
-    await (0, _vue.nextTick)();
-  });
-  (0, _vitest.it)("should render loading state", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        loading: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table__loading").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should render loading with text", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        loading: {
-          visible: true,
-          text: "\u52A0\u8F7D\u4E2D..."
-        }
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table__loading").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should format cell content with formatter", () => {
-    const columns = [{
-      prop: "age",
-      label: "\u5E74\u9F84",
-      formatter: row => `${row.age}\u5C81`
-    }];
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns
-      }
-    });
-    const cells = wrapper.findAll(".yh-table__cell");
-    (0, _vitest.expect)(cells[0].text()).toBe("28\u5C81");
-  });
-  (0, _vitest.it)("should render with custom row class", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        rowClassName: "custom-row-class"
-      }
-    });
-    const rows = wrapper.findAll(".yh-table__row");
-    (0, _vitest.expect)(rows[0].classes()).toContain("custom-row-class");
-  });
-  (0, _vitest.it)("should render with row class function", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        rowClassName: ({
-          rowIndex
-        }) => rowIndex === 0 ? "first-row" : ""
-      }
-    });
-    const rows = wrapper.findAll(".yh-table__row");
-    (0, _vitest.expect)(rows[0].classes()).toContain("first-row");
-    (0, _vitest.expect)(rows[1].classes()).not.toContain("first-row");
-  });
-  (0, _vitest.it)("should support column align", () => {
-    const columns = [{
-      prop: "name",
-      label: "\u59D3\u540D",
-      align: "center"
-    }];
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns
-      }
-    });
-    const cell = wrapper.find(".yh-table__cell");
-    (0, _vitest.expect)(cell.classes()).toContain("is-center");
-  });
-  (0, _vitest.it)("should expose getTableData method", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      }
-    });
-    const tableInstance = wrapper.vm;
-    const result = tableInstance.getTableData();
-    (0, _vitest.expect)(result.fullData).toEqual(mockData);
-    (0, _vitest.expect)(result.tableData).toEqual(mockData);
-  });
-});
-(0, _vitest.describe)("Table with Selection", () => {
-  (0, _vitest.it)("should toggle row selection", async () => {
-    const onChange = _vitest.vi.fn();
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "checkbox",
-          onChange
-        }
-      }
-    });
-    const checkbox = wrapper.find('.yh-table__selection-cell input[type="checkbox"]');
-    await checkbox.trigger("change");
-    (0, _vitest.expect)(wrapper.emitted("selection-change")).toBeTruthy();
-  });
-  (0, _vitest.it)("should toggle all selection", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "checkbox"
-        }
-      }
-    });
-    const headerCheckbox = wrapper.find(".yh-table__header-cell .yh-table__selection-cell input");
-    await headerCheckbox.trigger("change");
-    const tableInstance = wrapper.vm;
-    (0, _vitest.expect)(tableInstance.getSelectionRows().length).toBe(4);
-  });
-  (0, _vitest.it)("should support radio selection", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "radio"
-        }
-      }
-    });
-    const radios = wrapper.findAll('.yh-table__selection-cell input[type="radio"]');
-    (0, _vitest.expect)(radios.length).toBe(4);
-  });
-});
-(0, _vitest.describe)("Table with Tree", () => {
-  const treeData = [{
-    id: 1,
-    name: "\u4E00\u7EA7 1",
-    children: [{
-      id: 11,
-      name: "\u4E8C\u7EA7 1-1"
-    }, {
-      id: 12,
-      name: "\u4E8C\u7EA7 1-2"
-    }]
-  }, {
-    id: 2,
-    name: "\u4E00\u7EA7 2",
-    children: [{
-      id: 21,
-      name: "\u4E8C\u7EA7 2-1"
-    }]
-  }];
-  (0, _vitest.it)("should render tree data", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: treeData,
-        columns: [{
-          prop: "name",
-          label: "\u540D\u79F0",
-          treeNode: true
-        }],
-        treeConfig: {
-          childrenKey: "children"
-        }
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table__tree-icon").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should expand tree node", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: treeData,
-        columns: [{
-          prop: "name",
-          label: "\u540D\u79F0",
-          treeNode: true
-        }],
-        treeConfig: {
-          childrenKey: "children"
-        }
-      }
-    });
-    const treeIcon = wrapper.find(".yh-table__tree-icon");
-    await treeIcon.trigger("click");
-    await (0, _vue.nextTick)();
-    const rows = wrapper.findAll(".yh-table__row");
-    (0, _vitest.expect)(rows.length).toBeGreaterThan(2);
-  });
-});
-(0, _vitest.describe)("Table with Expand", () => {
-  (0, _vitest.it)("should render expand column", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        expandConfig: {}
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table__expand-cell").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should toggle expand row", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        expandConfig: {}
-      }
-    });
-    const expandIcon = wrapper.find(".yh-table__expand-icon");
-    await expandIcon.trigger("click");
-    (0, _vitest.expect)(wrapper.find(".yh-table__expanded-row").exists()).toBe(true);
-    (0, _vitest.expect)(wrapper.emitted("expand-change")).toBeTruthy();
-  });
-});
-(0, _vitest.describe)("TableColumn", () => {
-  (0, _vitest.it)("should render slot content", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      },
-      slots: {
-        name: ({
-          row
-        }) => (0, _vue.h)("span", {
-          class: "custom-name"
-        }, String(row.name))
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".custom-name").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should render header slot", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      },
-      slots: {
-        "header-name": () => (0, _vue.h)("span", {
-          class: "custom-header"
-        }, "\u81EA\u5B9A\u4E49\u8868\u5934")
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".custom-header").exists()).toBe(true);
-    (0, _vitest.expect)(wrapper.find(".custom-header").text()).toBe("\u81EA\u5B9A\u4E49\u8868\u5934");
-  });
-});
-(0, _vitest.describe)("Table Complex Scenarios", () => {
-  (0, _vitest.it)("should render summary row", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        summaryConfig: {
-          text: "\u603B\u8BA1",
-          method: ({
-            columns,
-            data
-          }) => {
-            const sums = [];
-            columns.forEach((column, index) => {
-              if (index === 0) {
-                sums[index] = "\u603B\u8BA1";
-                return;
-              }
-              if (column.prop === "age") {
-                const values = data.map(item => Number(item[column.prop]));
-                sums[index] = values.reduce((prev, curr) => prev + curr, 0);
-              } else {
-                sums[index] = "-";
-              }
-            });
-            return sums;
-          }
-        }
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table__footer-wrapper").exists()).toBe(true);
-    const summaryCells = wrapper.findAll(".yh-table__footer .yh-table__cell");
-    (0, _vitest.expect)(summaryCells[0].text()).toBe("\u603B\u8BA1");
-    (0, _vitest.expect)(summaryCells[1].text()).toBe("115");
-  });
-  (0, _vitest.it)("should support span-method (cell merging)", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        spanMethod: ({
-          rowIndex,
-          columnIndex
-        }) => {
-          if (rowIndex === 0 && columnIndex === 0) {
-            return {
-              rowspan: 2,
-              colspan: 1
-            };
-          }
-          if (rowIndex === 1 && columnIndex === 0) {
-            return {
-              rowspan: 0,
-              colspan: 0
-            };
-          }
-        }
-      }
-    });
-    const rows = wrapper.findAll(".yh-table__row");
-    const firstCell = rows[0].find(".yh-table__cell");
-    (0, _vitest.expect)(firstCell.attributes("rowspan")).toBe("2");
-    const secondRowFirstCell = rows[1].find(".yh-table__cell");
-    (0, _vitest.expect)(rows[1].findAll(".yh-table__cell").length).toBe(2);
-  });
-  (0, _vitest.it)("should render grouped header (multi-level)", () => {
-    const groupedColumns = [{
-      label: "\u5206\u7EC4 1",
-      children: [{
-        prop: "name",
-        label: "\u59D3\u540D",
-        width: 100
-      }, {
-        prop: "age",
-        label: "\u5E74\u9F84",
-        width: 80
-      }]
-    }, {
-      prop: "address",
-      label: "\u5730\u5740"
-    }];
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: groupedColumns
-      }
-    });
-    (0, _vitest.expect)(wrapper.findAll(".yh-table__header-row").length).toBe(2);
-    const firstHeaderRow = wrapper.findAll(".yh-table__header-row")[0];
-    (0, _vitest.expect)(firstHeaderRow.text()).toContain("\u5206\u7EC4 1");
-    (0, _vitest.expect)(firstHeaderRow.text()).toContain("\u5730\u5740");
-  });
-  (0, _vitest.it)("should support pagination config", () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        pagination: {
-          currentPage: 1,
-          pageSize: 2,
-          total: mockData.length
-        }
-      },
-      global: {
-        stubs: {
-          YhPagination: true,
-          YhSelect: true,
-          YhOption: true,
-          YhInput: true,
-          YhTooltip: true
-        }
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-table__pagination-wrapper").exists()).toBe(true);
-    (0, _vitest.expect)(wrapper.findAll(".yh-table__row").length).toBe(2);
-  });
-  (0, _vitest.it)("should emit page-change event", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        pagination: {
-          currentPage: 1,
-          pageSize: 2,
-          total: mockData.length
-        }
-      },
-      global: {
-        stubs: {
-          YhPagination: true,
-          YhSelect: true,
-          YhOption: true,
-          YhInput: true,
-          YhTooltip: true
-        }
-      }
-    });
-    const pagination = wrapper.findComponent({
-      name: "YhPagination"
-    });
-    if (pagination.exists()) {
-      await pagination.vm.$emit("update:currentPage", 2);
-      (0, _vitest.expect)(wrapper.emitted("page-change")).toBeTruthy();
-    }
-  });
-});

package/dist/table/__tests__/table.test.d.ts

@@ -1 +0,0 @@
-export {};