@yh-ui/components 0.1.21 → 0.1.23

package/dist/cascader/__tests__/cascader.test.mjs

@@ -1,316 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { mount } from "@vue/test-utils";
-import { nextTick } from "vue";
-import Cascader from "../src/cascader.vue";
-describe("YhCascader", () => {
-  const options = [
-    {
-      value: "guide",
-      label: "\u6307\u5357",
-      children: [
-        {
-          value: "design",
-          label: "\u8BBE\u8BA1\u539F\u5219",
-          children: [
-            { value: "consistency", label: "\u4E00\u81F4" },
-            { value: "feedback", label: "\u53CD\u9988" }
-          ]
-        },
-        {
-          value: "navigation",
-          label: "\u5BFC\u822A",
-          children: [
-            { value: "side-nav", label: "\u4FA7\u5411\u5BFC\u822A" },
-            { value: "top-nav", label: "\u9876\u90E8\u5BFC\u822A" }
-          ]
-        }
-      ]
-    },
-    {
-      value: "component",
-      label: "\u7EC4\u4EF6",
-      children: [
-        {
-          value: "basic",
-          label: "\u57FA\u7840\u7EC4\u4EF6",
-          children: [
-            { value: "button", label: "Button \u6309\u94AE" },
-            { value: "icon", label: "Icon \u56FE\u6807" }
-          ]
-        }
-      ]
-    },
-    {
-      value: "resource",
-      label: "\u8D44\u6E90",
-      disabled: true,
-      children: [{ value: "axure", label: "Axure Components" }]
-    }
-  ];
-  it("should render correctly", () => {
-    const wrapper = mount(Cascader, {
-      props: { options }
-    });
-    expect(wrapper.classes()).toContain("yh-cascader");
-    expect(wrapper.find("input").exists()).toBe(true);
-  });
-  it("should work with v-model", async () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        modelValue: ["guide", "design", "consistency"],
-        "onUpdate:modelValue": (val) => wrapper.setProps({ modelValue: val })
-      }
-    });
-    expect(wrapper.find(".yh-cascader__selected-value").text()).toContain("\u6307\u5357");
-  });
-  it("should display placeholder when no value", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        placeholder: "\u8BF7\u9009\u62E9"
-      }
-    });
-    expect(wrapper.find("input").attributes("placeholder")).toBe("\u8BF7\u9009\u62E9");
-  });
-  it("should be disabled when disabled prop is true", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        disabled: true
-      }
-    });
-    expect(wrapper.classes()).toContain("is-disabled");
-    expect(wrapper.find("input").attributes("disabled")).toBeDefined();
-  });
-  it("should apply size class", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        size: "large"
-      }
-    });
-    expect(wrapper.classes()).toContain("yh-cascader--large");
-  });
-  it("should apply small size class", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        size: "small"
-      }
-    });
-    expect(wrapper.classes()).toContain("yh-cascader--small");
-  });
-  it("should show clear button when clearable and has value", async () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        modelValue: ["guide", "design", "consistency"],
-        clearable: true
-      }
-    });
-    await wrapper.trigger("mouseenter");
-    await wrapper.find("input").trigger("focus");
-    await nextTick();
-    expect(wrapper.find(".yh-cascader__clear").exists()).toBe(true);
-  });
-  it("should clear value when clear button is clicked", async () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        modelValue: ["guide", "design", "consistency"],
-        clearable: true,
-        "onUpdate:modelValue": (val) => wrapper.setProps({ modelValue: val })
-      }
-    });
-    await wrapper.trigger("mouseenter");
-    await wrapper.find("input").trigger("focus");
-    await nextTick();
-    await wrapper.find(".yh-cascader__clear").trigger("click");
-    expect(wrapper.emitted("clear")).toBeTruthy();
-    expect(wrapper.props("modelValue")).toEqual([]);
-  });
-  it("should toggle dropdown on click", async () => {
-    const wrapper = mount(Cascader, {
-      props: { options }
-    });
-    await wrapper.trigger("click");
-    expect(wrapper.emitted("visible-change")).toBeTruthy();
-    expect(wrapper.emitted("visible-change")[0]).toEqual([true]);
-  });
-  it("should show only last level when showAllLevels is false", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        modelValue: ["guide", "design", "consistency"],
-        showAllLevels: false
-      }
-    });
-    expect(wrapper.find(".yh-cascader__selected-value").text()).toBe("\u4E00\u81F4");
-  });
-  it("should show full path when showAllLevels is true", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        modelValue: ["guide", "design", "consistency"],
-        showAllLevels: true,
-        separator: " / "
-      }
-    });
-    expect(wrapper.find(".yh-cascader__selected-value").text()).toContain("/");
-  });
-  it("should work in multiple mode", async () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        props: { multiple: true },
-        modelValue: [
-          ["guide", "design", "consistency"],
-          ["guide", "design", "feedback"]
-        ],
-        "onUpdate:modelValue": (val) => wrapper.setProps({ modelValue: val })
-      }
-    });
-    const tags = wrapper.findAll(".yh-cascader__tag");
-    expect(tags.length).toBe(2);
-  });
-  it("should collapse tags when collapseTags is true", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        props: { multiple: true },
-        modelValue: [
-          ["guide", "design", "consistency"],
-          ["guide", "design", "feedback"],
-          ["component", "basic", "button"]
-        ],
-        collapseTags: true,
-        maxCollapseTags: 1
-      }
-    });
-    const tags = wrapper.findAll(".yh-cascader__tag");
-    expect(tags.length).toBe(2);
-    expect(tags[1].text()).toContain("+2");
-  });
-  it("should remove tag in multiple mode", async () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        props: { multiple: true },
-        modelValue: [
-          ["guide", "design", "consistency"],
-          ["guide", "design", "feedback"]
-        ],
-        "onUpdate:modelValue": (val) => wrapper.setProps({ modelValue: val })
-      }
-    });
-    const closeBtn = wrapper.find(".yh-cascader__tag-close");
-    if (closeBtn.exists()) {
-      await closeBtn.trigger("click");
-      expect(wrapper.emitted("change")).toBeTruthy();
-    }
-  });
-  it("should filter options when filterable", async () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        filterable: true
-      }
-    });
-    await wrapper.trigger("click");
-    await wrapper.find("input").setValue("\u6309\u94AE");
-    await nextTick();
-    expect(wrapper.emitted()).toBeTruthy();
-  });
-  it("should use custom separator", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        modelValue: ["guide", "design", "consistency"],
-        separator: " > "
-      }
-    });
-    expect(wrapper.find(".yh-cascader__selected-value").text()).toContain(">");
-  });
-  it("should emit focus and blur events", async () => {
-    const wrapper = mount(Cascader, {
-      props: { options }
-    });
-    await wrapper.find("input").trigger("focus");
-    expect(wrapper.emitted("focus")).toBeTruthy();
-    await wrapper.find("input").trigger("blur");
-    await new Promise((resolve) => setTimeout(resolve, 200));
-    expect(wrapper.emitted("blur")).toBeTruthy();
-  });
-  it("should have correct ARIA attributes", () => {
-    const wrapper = mount(Cascader, {
-      props: { options }
-    });
-    const input = wrapper.find("input");
-    expect(input.attributes("role")).toBe("combobox");
-    expect(input.attributes("aria-expanded")).toBeDefined();
-  });
-  it("should expose focus, blur and getCheckedNodes methods", () => {
-    const wrapper = mount(Cascader, {
-      props: { options }
-    });
-    const vm = wrapper.vm;
-    expect(typeof vm.focus).toBe("function");
-    expect(typeof vm.blur).toBe("function");
-    expect(typeof vm.getCheckedNodes).toBe("function");
-  });
-  it("should return checked nodes", () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        modelValue: ["guide", "design", "consistency"]
-      }
-    });
-    const vm = wrapper.vm;
-    const nodes = vm.getCheckedNodes();
-    expect(nodes.length).toBe(1);
-    expect(nodes[0].value).toBe("consistency");
-  });
-  it("should not select disabled option", async () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        "onUpdate:modelValue": (val) => wrapper.setProps({ modelValue: val })
-      }
-    });
-    await wrapper.trigger("click");
-    await nextTick();
-    const disabledOption = wrapper.find(".yh-cascader__node.is-disabled");
-    if (disabledOption.exists()) {
-      await disabledOption.trigger("click");
-      expect(wrapper.props("modelValue")).toBeUndefined();
-    }
-  });
-  it("should emit expand-change when expanding", async () => {
-    const wrapper = mount(Cascader, {
-      props: { options }
-    });
-    await wrapper.trigger("click");
-    await nextTick();
-    const firstOption = wrapper.find(".yh-cascader__node");
-    if (firstOption.exists()) {
-      await firstOption.trigger("click");
-      expect(wrapper.emitted("expand-change")).toBeTruthy();
-    }
-  });
-  it("should expand on hover when expandTrigger is hover", async () => {
-    const wrapper = mount(Cascader, {
-      props: {
-        options,
-        props: { expandTrigger: "hover" }
-      }
-    });
-    await wrapper.trigger("click");
-    await nextTick();
-    const firstOption = wrapper.find(".yh-cascader__node");
-    if (firstOption.exists()) {
-      await firstOption.trigger("mouseenter");
-      expect(wrapper.emitted("expand-change")).toBeTruthy();
-    }
-  });
-});

package/dist/category-nav/__tests__/category-nav.ssr.test.cjs

@@ -1,35 +0,0 @@
-"use strict";
-
-var _serverRenderer = require("@vue/server-renderer");
-var _vitest = require("vitest");
-var _vue = require("vue");
-var _categoryNav = _interopRequireDefault(require("../src/category-nav.vue"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-(0, _vitest.describe)("CategoryNav SSR", () => {
-  const props = {
-    modelValue: "1",
-    categories: [{
-      id: "1",
-      name: "\u7535\u5B50\u4EA7\u54C1",
-      children: [{
-        id: "1-1",
-        name: "\u624B\u673A"
-      }]
-    }, {
-      id: "2",
-      name: "\u670D\u9970",
-      children: [{
-        id: "2-1",
-        name: "\u5973\u88C5"
-      }]
-    }]
-  };
-  (0, _vitest.it)("renders correctly on server", async () => {
-    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_categoryNav.default, props));
-    (0, _vitest.expect)(html).toContain("yh-category-nav");
-    (0, _vitest.expect)(html).toContain("\u7535\u5B50\u4EA7\u54C1");
-    (0, _vitest.expect)(html).toContain("\u624B\u673A");
-    (0, _vitest.expect)(html).toContain("\u670D\u9970");
-    (0, _vitest.expect)(html).toContain("\u5973\u88C5");
-  });
-});

package/dist/category-nav/__tests__/category-nav.ssr.test.mjs

@@ -1,21 +0,0 @@
-import { renderToString } from "@vue/server-renderer";
-import { describe, it, expect } from "vitest";
-import { h } from "vue";
-import CategoryNav from "../src/category-nav.vue";
-describe("CategoryNav SSR", () => {
-  const props = {
-    modelValue: "1",
-    categories: [
-      { id: "1", name: "\u7535\u5B50\u4EA7\u54C1", children: [{ id: "1-1", name: "\u624B\u673A" }] },
-      { id: "2", name: "\u670D\u9970", children: [{ id: "2-1", name: "\u5973\u88C5" }] }
-    ]
-  };
-  it("renders correctly on server", async () => {
-    const html = await renderToString(h(CategoryNav, props));
-    expect(html).toContain("yh-category-nav");
-    expect(html).toContain("\u7535\u5B50\u4EA7\u54C1");
-    expect(html).toContain("\u624B\u673A");
-    expect(html).toContain("\u670D\u9970");
-    expect(html).toContain("\u5973\u88C5");
-  });
-});

package/dist/category-nav/__tests__/category-nav.test.cjs

@@ -1,53 +0,0 @@
-"use strict";
-
-var _vitest = require("vitest");
-var _testUtils = require("@vue/test-utils");
-var _categoryNav = _interopRequireDefault(require("../src/category-nav.vue"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-(0, _vitest.describe)("CategoryNav", () => {
-  const props = {
-    modelValue: "1",
-    categories: [{
-      id: "1",
-      name: "\u7535\u5B50\u4EA7\u54C1",
-      children: [{
-        id: "1-1",
-        name: "\u624B\u673A"
-      }]
-    }, {
-      id: "2",
-      name: "\u670D\u9970",
-      children: [{
-        id: "2-1",
-        name: "\u5973\u88C5"
-      }]
-    }]
-  };
-  (0, _vitest.it)("renders correctly", () => {
-    const wrapper = (0, _testUtils.mount)(_categoryNav.default, {
-      props
-    });
-    (0, _vitest.expect)(wrapper.text()).toContain("\u7535\u5B50\u4EA7\u54C1");
-    (0, _vitest.expect)(wrapper.text()).toContain("\u670D\u9970");
-    (0, _vitest.expect)(wrapper.text()).toContain("\u624B\u673A");
-    (0, _vitest.expect)(wrapper.text()).toContain("\u5973\u88C5");
-  });
-  (0, _vitest.it)("triggers category click", async () => {
-    const wrapper = (0, _testUtils.mount)(_categoryNav.default, {
-      props
-    });
-    const items = wrapper.findAll(".yh-category-nav__side-item");
-    await items[2].trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("update:modelValue")[0]).toEqual(["2"]);
-    (0, _vitest.expect)(wrapper.emitted("categoryClick")[0][0].id).toBe("2");
-  });
-  (0, _vitest.it)("triggers sub category click", async () => {
-    const wrapper = (0, _testUtils.mount)(_categoryNav.default, {
-      props
-    });
-    const subItems = wrapper.findAll(".yh-category-nav__sub-item");
-    await subItems[0].trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("update:subValue")[0]).toEqual(["1-1"]);
-    (0, _vitest.expect)(wrapper.emitted("subCategoryClick")[0][0].id).toBe("1-1");
-  });
-});

package/dist/category-nav/__tests__/category-nav.test.mjs

@@ -1,33 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { mount } from "@vue/test-utils";
-import CategoryNav from "../src/category-nav.vue";
-describe("CategoryNav", () => {
-  const props = {
-    modelValue: "1",
-    categories: [
-      { id: "1", name: "\u7535\u5B50\u4EA7\u54C1", children: [{ id: "1-1", name: "\u624B\u673A" }] },
-      { id: "2", name: "\u670D\u9970", children: [{ id: "2-1", name: "\u5973\u88C5" }] }
-    ]
-  };
-  it("renders correctly", () => {
-    const wrapper = mount(CategoryNav, { props });
-    expect(wrapper.text()).toContain("\u7535\u5B50\u4EA7\u54C1");
-    expect(wrapper.text()).toContain("\u670D\u9970");
-    expect(wrapper.text()).toContain("\u624B\u673A");
-    expect(wrapper.text()).toContain("\u5973\u88C5");
-  });
-  it("triggers category click", async () => {
-    const wrapper = mount(CategoryNav, { props });
-    const items = wrapper.findAll(".yh-category-nav__side-item");
-    await items[2].trigger("click");
-    expect(wrapper.emitted("update:modelValue")[0]).toEqual(["2"]);
-    expect(wrapper.emitted("categoryClick")[0][0].id).toBe("2");
-  });
-  it("triggers sub category click", async () => {
-    const wrapper = mount(CategoryNav, { props });
-    const subItems = wrapper.findAll(".yh-category-nav__sub-item");
-    await subItems[0].trigger("click");
-    expect(wrapper.emitted("update:subValue")[0]).toEqual(["1-1"]);
-    expect(wrapper.emitted("subCategoryClick")[0][0].id).toBe("1-1");
-  });
-});

package/dist/checkbox/__tests__/checkbox.ssr.test.cjs

@@ -1,52 +0,0 @@
-"use strict";
-
-var _vitest = require("vitest");
-var _checkbox = _interopRequireDefault(require("../src/checkbox.vue"));
-var _checkboxGroup = _interopRequireDefault(require("../src/checkbox-group.vue"));
-var _ssr = require("../../__tests__/utils/ssr.cjs");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-(0, _vitest.describe)("YhCheckbox SSR", () => {
-  (0, _vitest.it)("should render correctly in SSR", async () => {
-    const html = await (0, _ssr.renderSSR)(_checkbox.default, {
-      modelValue: true
-    }, {
-      default: () => "Checkbox Label"
-    });
-    (0, _ssr.expectSSRHasClass)(html, "yh-checkbox");
-    (0, _vitest.expect)(html).toContain("Checkbox Label");
-  });
-  (0, _vitest.it)("should render checked state in SSR", async () => {
-    const html = await (0, _ssr.renderSSR)(_checkbox.default, {
-      modelValue: true
-    });
-    (0, _ssr.expectSSRHasClass)(html, "is-checked");
-  });
-  (0, _vitest.it)("should render disabled state in SSR", async () => {
-    const html = await (0, _ssr.renderSSR)(_checkbox.default, {
-      disabled: true
-    });
-    (0, _ssr.expectSSRHasClass)(html, "is-disabled");
-  });
-  (0, _vitest.it)("should hydrate without mismatch", async () => {
-    const result = await (0, _ssr.testHydration)(_checkbox.default, {
-      modelValue: true
-    }, {
-      default: () => "Hydration Test"
-    });
-    (0, _vitest.expect)(result.isMatch).toBe(true);
-  });
-});
-(0, _vitest.describe)("YhCheckboxGroup SSR", () => {
-  (0, _vitest.it)("should render group correctly in SSR", async () => {
-    const html = await (0, _ssr.renderSSR)(_checkboxGroup.default, {
-      modelValue: ["opt1"]
-    });
-    (0, _ssr.expectSSRHasClass)(html, "yh-checkbox-group");
-  });
-  (0, _vitest.it)("should hydrate group without mismatch", async () => {
-    const result = await (0, _ssr.testHydration)(_checkboxGroup.default, {
-      modelValue: ["opt1"]
-    });
-    (0, _vitest.expect)(result.isMatch).toBe(true);
-  });
-});

package/dist/checkbox/__tests__/checkbox.ssr.test.mjs

@@ -1,57 +0,0 @@
-import { describe, it, expect } from "vitest";
-import Checkbox from "../src/checkbox.vue";
-import CheckboxGroup from "../src/checkbox-group.vue";
-import { renderSSR, expectSSRHasClass, testHydration } from "../../__tests__/utils/ssr.mjs";
-describe("YhCheckbox SSR", () => {
-  it("should render correctly in SSR", async () => {
-    const html = await renderSSR(
-      Checkbox,
-      {
-        modelValue: true
-      },
-      {
-        default: () => "Checkbox Label"
-      }
-    );
-    expectSSRHasClass(html, "yh-checkbox");
-    expect(html).toContain("Checkbox Label");
-  });
-  it("should render checked state in SSR", async () => {
-    const html = await renderSSR(Checkbox, {
-      modelValue: true
-    });
-    expectSSRHasClass(html, "is-checked");
-  });
-  it("should render disabled state in SSR", async () => {
-    const html = await renderSSR(Checkbox, {
-      disabled: true
-    });
-    expectSSRHasClass(html, "is-disabled");
-  });
-  it("should hydrate without mismatch", async () => {
-    const result = await testHydration(
-      Checkbox,
-      {
-        modelValue: true
-      },
-      {
-        default: () => "Hydration Test"
-      }
-    );
-    expect(result.isMatch).toBe(true);
-  });
-});
-describe("YhCheckboxGroup SSR", () => {
-  it("should render group correctly in SSR", async () => {
-    const html = await renderSSR(CheckboxGroup, {
-      modelValue: ["opt1"]
-    });
-    expectSSRHasClass(html, "yh-checkbox-group");
-  });
-  it("should hydrate group without mismatch", async () => {
-    const result = await testHydration(CheckboxGroup, {
-      modelValue: ["opt1"]
-    });
-    expect(result.isMatch).toBe(true);
-  });
-});