@yh-ui/components 0.1.21 → 0.1.23

package/dist/table/__tests__/table-advance.test.mjs

@@ -1,118 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-import { mount } from "@vue/test-utils";
-import { nextTick, h } from "vue";
-import { YhTable, YhTableColumn } from "../index.mjs";
-if (typeof URL.createObjectURL === "undefined") {
-  Object.defineProperty(URL, "createObjectURL", { value: vi.fn(() => "blob:mock-url") });
-  Object.defineProperty(URL, "revokeObjectURL", { value: vi.fn() });
-}
-const mockWindowOpen = vi.fn().mockReturnValue({
-  document: {
-    write: vi.fn(),
-    close: vi.fn()
-  },
-  print: vi.fn(),
-  close: vi.fn(),
-  onload: null
-});
-vi.stubGlobal("open", mockWindowOpen);
-class MockResizeObserver {
-  observe = vi.fn();
-  unobserve = vi.fn();
-  disconnect = vi.fn();
-}
-global.ResizeObserver = MockResizeObserver;
-describe("Table Advanced Features", () => {
-  const mockData = Array.from({ length: 200 }).map((_, i) => ({
-    id: i + 1,
-    name: `User ${i + 1}`,
-    age: 20 + i % 30,
-    email: `user${i + 1}@example.com`,
-    active: i % 2 === 0
-  }));
-  const mockColumns = [
-    { prop: "id", label: "ID", width: 60 },
-    { prop: "name", label: "Name", width: 120 },
-    { prop: "age", label: "Age", width: 80 },
-    { prop: "email", label: "Email" },
-    { prop: "active", label: "Active" }
-  ];
-  describe("Virtual Scroll", () => {
-    it("should enable virtual scroll when data length > 100 and enabled", async () => {
-      const wrapper = mount(YhTable, {
-        props: {
-          data: mockData,
-          columns: mockColumns,
-          virtualConfig: { enabled: true },
-          height: 400
-        },
-        global: {
-          stubs: {
-            YhPagination: true,
-            YhTooltip: true
-          }
-        }
-      });
-      const vm = wrapper.vm;
-      expect(vm.isVirtual).toBe(true);
-      const rows = wrapper.findAll(".yh-table__row");
-      expect(rows.length).toBeLessThan(mockData.length);
-    });
-  });
-  describe("Data Export & Import", () => {
-    it("should export data as CSV, JSON, HTML", async () => {
-      const wrapper = mount(YhTable, {
-        props: { data: mockData.slice(0, 5), columns: mockColumns }
-      });
-      const vm = wrapper.vm;
-      const csv = await vm.exportData({ type: "csv", mode: "string" });
-      expect(csv).toContain("ID,Name,Age,Email,Active");
-      expect(csv).toContain("\u662F");
-      const json = await vm.exportData({ type: "json", mode: "string" });
-      expect(JSON.parse(json)[0]["Name"]).toBe("User 1");
-      const html = await vm.exportData({ type: "html", mode: "string" });
-      expect(html).toContain("<table");
-    });
-    it("should import data from JSON and CSV", async () => {
-      const wrapper = mount(YhTable, {
-        props: { data: [], columns: mockColumns }
-      });
-      const vm = wrapper.vm;
-      const jsonData = JSON.stringify([{ id: 999, name: "Imported JSON" }]);
-      await vm.importData(jsonData, { type: "json" });
-      expect(wrapper.emitted("update:data")).toBeTruthy();
-      const csvData = "ID,Name\n1000,Imported CSV";
-      await vm.importData(csvData, { type: "csv" });
-      expect(wrapper.emitted("update:data").length).toBeGreaterThan(1);
-    });
-  });
-  describe("Print", () => {
-    it("should support print and printMultiple", async () => {
-      const wrapper = mount(YhTable, {
-        props: { data: mockData.slice(0, 1), columns: mockColumns }
-      });
-      const vm = wrapper.vm;
-      await vm.print({ title: "Print Test" });
-      expect(mockWindowOpen).toHaveBeenCalled();
-      await vm.printMultiple([{ title: "Multiple", data: [{ id: 1 }], columns: [{ prop: "id" }] }]);
-      expect(mockWindowOpen).toHaveBeenCalledTimes(2);
-    });
-  });
-  describe("TableColumn component", () => {
-    it("should collect columns from slots", async () => {
-      const wrapper = mount(YhTable, {
-        props: { data: mockData.slice(0, 5) },
-        slots: {
-          default: () => [
-            h(YhTableColumn, { prop: "id", label: "ID" }),
-            h(YhTableColumn, { prop: "name", label: "Name" })
-          ]
-        }
-      });
-      await nextTick();
-      await nextTick();
-      expect(wrapper.findAll(".yh-table__header-cell").length).toBe(2);
-      expect(wrapper.find(".yh-table__header-cell").text()).toBe("ID");
-    });
-  });
-});

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

@@ -1,236 +0,0 @@
-"use strict";
-
-var _vitest = require("vitest");
-var _testUtils = require("@vue/test-utils");
-var _vue = require("vue");
-var _index = require("../index.cjs");
-if (typeof DataTransfer === "undefined") {
-  ;
-  global.DataTransfer = class {
-    data = {};
-    effectAllowed = "none";
-    dropEffect = "none";
-    setData(type, val) {
-      this.data[type] = val;
-    }
-    getData(type) {
-      return this.data[type];
-    }
-    setDragImage() {}
-  };
-}
-(0, _vitest.describe)("Table Interactions", () => {
-  const mockData = [{
-    id: 1,
-    name: "User 1",
-    age: 25,
-    longText: "This is a very long text that should trigger overflow tooltip"
-  }, {
-    id: 2,
-    name: "User 2",
-    age: 30,
-    longText: "Short"
-  }];
-  const mockColumns = [{
-    prop: "id",
-    label: "ID",
-    width: 50
-  }, {
-    prop: "name",
-    label: "Name",
-    width: 100
-  }, {
-    prop: "age",
-    label: "Age",
-    width: 100
-  }, {
-    prop: "longText",
-    label: "Long Text",
-    width: 80,
-    showOverflowTooltip: true
-  }];
-  (0, _vitest.it)("should handle cell and row clicks", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns
-      }
-    });
-    const cell = wrapper.find(".yh-table__row td:nth-child(2)");
-    await cell.trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("cell-click")).toBeTruthy();
-    (0, _vitest.expect)(wrapper.emitted("row-click")).toBeTruthy();
-    await cell.trigger("dblclick");
-    (0, _vitest.expect)(wrapper.emitted("cell-dblclick")).toBeTruthy();
-  });
-  (0, _vitest.it)("should handle row dragging", async () => {
-    const onDragEnd = _vitest.vi.fn();
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: [...mockData],
-        columns: mockColumns,
-        dragConfig: {
-          row: true,
-          onDragEnd
-        }
-      }
-    });
-    const rows = wrapper.findAll(".yh-table__row");
-    const dt = new DataTransfer();
-    const dragStartEvent = new DragEvent("dragstart", {
-      dataTransfer: dt
-    });
-    await rows[0].trigger("dragstart", dragStartEvent);
-    const dragOverEvent = new DragEvent("dragover", {
-      dataTransfer: dt
-    });
-    await rows[1].trigger("dragover", dragOverEvent);
-    const dropEvent = new DragEvent("drop", {
-      dataTransfer: dt
-    });
-    await rows[1].trigger("drop", dropEvent);
-    (0, _vitest.expect)(onDragEnd).toHaveBeenCalled();
-    (0, _vitest.expect)(wrapper.emitted("drag-end")).toBeTruthy();
-  });
-  (0, _vitest.it)("should handle tree row dragging", async () => {
-    const treeData = [{
-      id: 1,
-      name: "Root 1",
-      children: [{
-        id: 11,
-        name: "Child 1.1"
-      }]
-    }, {
-      id: 2,
-      name: "Root 2"
-    }];
-    const onDragEnd = _vitest.vi.fn();
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: treeData,
-        columns: [{
-          prop: "name",
-          label: "Name",
-          treeNode: true
-        }],
-        dragConfig: {
-          row: true,
-          onDragEnd
-        },
-        treeConfig: {
-          childrenKey: "children"
-        }
-      }
-    });
-    await (0, _vue.nextTick)();
-    const rows = wrapper.findAll(".yh-table__row");
-    const dt = new DataTransfer();
-    const dragStartEvent = new DragEvent("dragstart", {
-      dataTransfer: dt
-    });
-    await rows[0].trigger("dragstart", dragStartEvent);
-    const dropEvent = new DragEvent("drop", {
-      dataTransfer: dt
-    });
-    await rows[1].trigger("drop", dropEvent);
-    (0, _vitest.expect)(onDragEnd).toHaveBeenCalled();
-  });
-  (0, _vitest.it)("should handle row selection config", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "checkbox",
-          checkable: row => row.id !== 1
-        }
-      }
-    });
-    await (0, _vue.nextTick)();
-    const rowCheckboxes = wrapper.findAll(".yh-table__row .yh-table__selection-cell input");
-    (0, _vitest.expect)(rowCheckboxes[0].element.disabled).toBe(true);
-    (0, _vitest.expect)(rowCheckboxes[1].element.disabled).toBe(false);
-  });
-  (0, _vitest.it)("should handle pagination page-size change", async () => {
-    const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        pagination: {
-          currentPage: 1,
-          pageSize: 10,
-          total: 100
-        }
-      },
-      global: {
-        stubs: {
-          YhPagination: {
-            template: `<div class="stub-pagination"><button id="size-btn" @click="$emit('update:page-size', 20)">Change Size</button></div>`,
-            emits: ["update:page-size"]
-          }
-        }
-      }
-    });
-    await wrapper.find("#size-btn").trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("page-change")).toBeTruthy();
-  });
-  (0, _vitest.describe)("Resize and Drag Utilities", () => {
-    (0, _vitest.it)("should handle column resize events", async () => {
-      const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-        props: {
-          data: mockData,
-          columns: mockColumns,
-          resizable: true
-        }
-      });
-      const vm = wrapper.vm;
-      await (0, _vue.nextTick)();
-      const handle = wrapper.find(".yh-table__resize-handle");
-      handle.element.setPointerCapture = _vitest.vi.fn();
-      const startEvent = new CustomEvent("pointerdown", {
-        bubbles: true
-      });
-      startEvent.clientX = 100;
-      startEvent.pointerId = 1;
-      handle.element.dispatchEvent(startEvent);
-      const moveEvent = new CustomEvent("pointermove", {
-        bubbles: true
-      });
-      moveEvent.clientX = 150;
-      document.dispatchEvent(moveEvent);
-      const upEvent = new CustomEvent("pointerup", {
-        bubbles: true
-      });
-      document.dispatchEvent(upEvent);
-      (0, _vitest.expect)(wrapper.emitted("column-resize")).toBeTruthy();
-    });
-    (0, _vitest.it)("should handle tree expansion", async () => {
-      const treeData = [{
-        id: 1,
-        name: "Root",
-        children: [{
-          id: 2,
-          name: "Child"
-        }]
-      }];
-      const wrapper = (0, _testUtils.mount)(_index.YhTable, {
-        props: {
-          data: treeData,
-          columns: [{
-            prop: "name",
-            label: "Name",
-            treeNode: true
-          }],
-          treeConfig: {
-            childrenKey: "children"
-          }
-        }
-      });
-      await (0, _vue.nextTick)();
-      const treeIcon = wrapper.find(".yh-table__tree-icon");
-      await treeIcon.trigger("click");
-      await (0, _vue.nextTick)();
-      (0, _vitest.expect)(wrapper.findAll(".yh-table__row").length).toBe(2);
-    });
-  });
-});

package/dist/table/__tests__/table-interaction.test.mjs

@@ -1,162 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-import { mount } from "@vue/test-utils";
-import { nextTick } from "vue";
-import { YhTable } from "../index.mjs";
-if (typeof DataTransfer === "undefined") {
-  ;
-  global.DataTransfer = class {
-    data = {};
-    effectAllowed = "none";
-    dropEffect = "none";
-    setData(type, val) {
-      this.data[type] = val;
-    }
-    getData(type) {
-      return this.data[type];
-    }
-    setDragImage() {
-    }
-  };
-}
-describe("Table Interactions", () => {
-  const mockData = [
-    {
-      id: 1,
-      name: "User 1",
-      age: 25,
-      longText: "This is a very long text that should trigger overflow tooltip"
-    },
-    { id: 2, name: "User 2", age: 30, longText: "Short" }
-  ];
-  const mockColumns = [
-    { prop: "id", label: "ID", width: 50 },
-    { prop: "name", label: "Name", width: 100 },
-    { prop: "age", label: "Age", width: 100 },
-    { prop: "longText", label: "Long Text", width: 80, showOverflowTooltip: true }
-  ];
-  it("should handle cell and row clicks", async () => {
-    const wrapper = mount(YhTable, {
-      props: { data: mockData, columns: mockColumns }
-    });
-    const cell = wrapper.find(".yh-table__row td:nth-child(2)");
-    await cell.trigger("click");
-    expect(wrapper.emitted("cell-click")).toBeTruthy();
-    expect(wrapper.emitted("row-click")).toBeTruthy();
-    await cell.trigger("dblclick");
-    expect(wrapper.emitted("cell-dblclick")).toBeTruthy();
-  });
-  it("should handle row dragging", async () => {
-    const onDragEnd = vi.fn();
-    const wrapper = mount(YhTable, {
-      props: {
-        data: [...mockData],
-        columns: mockColumns,
-        dragConfig: { row: true, onDragEnd }
-      }
-    });
-    const rows = wrapper.findAll(".yh-table__row");
-    const dt = new DataTransfer();
-    const dragStartEvent = new DragEvent("dragstart", { dataTransfer: dt });
-    await rows[0].trigger("dragstart", dragStartEvent);
-    const dragOverEvent = new DragEvent("dragover", { dataTransfer: dt });
-    await rows[1].trigger("dragover", dragOverEvent);
-    const dropEvent = new DragEvent("drop", { dataTransfer: dt });
-    await rows[1].trigger("drop", dropEvent);
-    expect(onDragEnd).toHaveBeenCalled();
-    expect(wrapper.emitted("drag-end")).toBeTruthy();
-  });
-  it("should handle tree row dragging", async () => {
-    const treeData = [
-      { id: 1, name: "Root 1", children: [{ id: 11, name: "Child 1.1" }] },
-      { id: 2, name: "Root 2" }
-    ];
-    const onDragEnd = vi.fn();
-    const wrapper = mount(YhTable, {
-      props: {
-        data: treeData,
-        columns: [{ prop: "name", label: "Name", treeNode: true }],
-        dragConfig: { row: true, onDragEnd },
-        treeConfig: { childrenKey: "children" }
-      }
-    });
-    await nextTick();
-    const rows = wrapper.findAll(".yh-table__row");
-    const dt = new DataTransfer();
-    const dragStartEvent = new DragEvent("dragstart", { dataTransfer: dt });
-    await rows[0].trigger("dragstart", dragStartEvent);
-    const dropEvent = new DragEvent("drop", { dataTransfer: dt });
-    await rows[1].trigger("drop", dropEvent);
-    expect(onDragEnd).toHaveBeenCalled();
-  });
-  it("should handle row selection config", async () => {
-    const wrapper = mount(YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        selectionConfig: {
-          type: "checkbox",
-          checkable: (row) => row.id !== 1
-        }
-      }
-    });
-    await nextTick();
-    const rowCheckboxes = wrapper.findAll(".yh-table__row .yh-table__selection-cell input");
-    expect(rowCheckboxes[0].element.disabled).toBe(true);
-    expect(rowCheckboxes[1].element.disabled).toBe(false);
-  });
-  it("should handle pagination page-size change", async () => {
-    const wrapper = mount(YhTable, {
-      props: {
-        data: mockData,
-        columns: mockColumns,
-        pagination: { currentPage: 1, pageSize: 10, total: 100 }
-      },
-      global: {
-        stubs: {
-          YhPagination: {
-            template: `<div class="stub-pagination"><button id="size-btn" @click="$emit('update:page-size', 20)">Change Size</button></div>`,
-            emits: ["update:page-size"]
-          }
-        }
-      }
-    });
-    await wrapper.find("#size-btn").trigger("click");
-    expect(wrapper.emitted("page-change")).toBeTruthy();
-  });
-  describe("Resize and Drag Utilities", () => {
-    it("should handle column resize events", async () => {
-      const wrapper = mount(YhTable, {
-        props: { data: mockData, columns: mockColumns, resizable: true }
-      });
-      const vm = wrapper.vm;
-      await nextTick();
-      const handle = wrapper.find(".yh-table__resize-handle");
-      handle.element.setPointerCapture = vi.fn();
-      const startEvent = new CustomEvent("pointerdown", { bubbles: true });
-      startEvent.clientX = 100;
-      startEvent.pointerId = 1;
-      handle.element.dispatchEvent(startEvent);
-      const moveEvent = new CustomEvent("pointermove", { bubbles: true });
-      moveEvent.clientX = 150;
-      document.dispatchEvent(moveEvent);
-      const upEvent = new CustomEvent("pointerup", { bubbles: true });
-      document.dispatchEvent(upEvent);
-      expect(wrapper.emitted("column-resize")).toBeTruthy();
-    });
-    it("should handle tree expansion", async () => {
-      const treeData = [{ id: 1, name: "Root", children: [{ id: 2, name: "Child" }] }];
-      const wrapper = mount(YhTable, {
-        props: {
-          data: treeData,
-          columns: [{ prop: "name", label: "Name", treeNode: true }],
-          treeConfig: { childrenKey: "children" }
-        }
-      });
-      await nextTick();
-      const treeIcon = wrapper.find(".yh-table__tree-icon");
-      await treeIcon.trigger("click");
-      await nextTick();
-      expect(wrapper.findAll(".yh-table__row").length).toBe(2);
-    });
-  });
-});