@yh-ui/components 0.1.10 → 0.1.12

package/dist/ai-agent-card/src/ai-agent-card.vue.d.ts

@@ -0,0 +1,62 @@
+declare var __VLS_17: {}, __VLS_43: {
+    data: any;
+    use: any;
+}, __VLS_49: {
+    data: any;
+};
+type __VLS_Slots = {} & {
+    avatar?: (props: typeof __VLS_17) => any;
+} & {
+    actions?: (props: typeof __VLS_43) => any;
+} & {
+    default?: (props: typeof __VLS_49) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    readonly data: {
+        readonly type: import("vue").PropType<import("./ai-agent-card").AgentData>;
+        readonly required: true;
+    };
+    readonly layout: {
+        readonly type: import("vue").PropType<"vertical" | "horizontal" | "compact">;
+        readonly default: "vertical";
+    };
+    readonly showActions: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly showStats: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly favoritable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly selected: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly loading: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly themeOverrides: {
+        readonly type: import("vue").PropType<import("@yh-ui/theme").ComponentThemeVars>;
+        readonly default: undefined;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {
+    readonly themeOverrides: import("@yh-ui/theme").ComponentThemeVars;
+    readonly layout: "compact" | "horizontal" | "vertical";
+    readonly loading: boolean;
+    readonly showActions: boolean;
+    readonly showStats: boolean;
+    readonly favoritable: boolean;
+    readonly selected: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/ai-artifacts/__tests__/ai-artifacts.ssr.test.cjs

@@ -0,0 +1,73 @@
+"use strict";
+
+var _vitest = require("vitest");
+var _serverRenderer = require("@vue/server-renderer");
+var _vue = require("vue");
+var _aiArtifacts = _interopRequireDefault(require("../src/ai-artifacts.vue"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+_vitest.vi.mock("highlight.js", () => ({
+  default: {
+    getLanguage: () => true,
+    highlight: () => ({
+      value: "<code></code>"
+    }),
+    highlightAuto: () => ({
+      value: "<code></code>"
+    })
+  }
+}));
+_vitest.vi.mock("highlight.js/styles/atom-one-dark.css", () => ({}));
+const mockData = {
+  id: "a1",
+  title: "SSR Artifact",
+  type: "html",
+  currentVersion: 1,
+  versions: [{
+    version: 1,
+    content: "<h1>SSR Ver 1</h1>"
+  }]
+};
+(0, _vitest.describe)("YhAiArtifacts SSR", () => {
+  (0, _vitest.it)("should render to string on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiArtifacts.default, {
+      visible: true,
+      data: mockData
+    }));
+    (0, _vitest.expect)(html).toContain("yh-ai-artifacts");
+    (0, _vitest.expect)(html).toContain("SSR Artifact");
+  });
+  (0, _vitest.it)("should render correct mode on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiArtifacts.default, {
+      visible: true,
+      data: mockData,
+      mode: "code"
+    }));
+    (0, _vitest.expect)(html).toContain("yh-ai-artifacts__code-viewer");
+  });
+  (0, _vitest.it)("should render version bar when multiple versions exist", async () => {
+    const multiVersionData = {
+      ...mockData,
+      versions: [{
+        version: 1,
+        content: "v1"
+      }, {
+        version: 2,
+        content: "v2"
+      }]
+    };
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiArtifacts.default, {
+      visible: true,
+      data: multiVersionData
+    }));
+    (0, _vitest.expect)(html).toContain("yh-ai-artifacts__version-bar");
+    (0, _vitest.expect)(html).toContain("v1");
+    (0, _vitest.expect)(html).toContain("v2");
+  });
+  (0, _vitest.it)("should not render when visible is false on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiArtifacts.default, {
+      visible: false,
+      data: mockData
+    }));
+    (0, _vitest.expect)(html).not.toContain("yh-ai-artifacts");
+  });
+});

package/dist/ai-artifacts/__tests__/ai-artifacts.ssr.test.d.ts

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

package/dist/ai-artifacts/__tests__/ai-artifacts.ssr.test.mjs

@@ -0,0 +1,68 @@
+import { describe, it, expect, vi } from "vitest";
+import { renderToString } from "@vue/server-renderer";
+import { h } from "vue";
+vi.mock("highlight.js", () => ({
+  default: {
+    getLanguage: () => true,
+    highlight: () => ({ value: "<code></code>" }),
+    highlightAuto: () => ({ value: "<code></code>" })
+  }
+}));
+vi.mock("highlight.js/styles/atom-one-dark.css", () => ({}));
+import AiArtifacts from "../src/ai-artifacts.vue";
+const mockData = {
+  id: "a1",
+  title: "SSR Artifact",
+  type: "html",
+  currentVersion: 1,
+  versions: [{ version: 1, content: "<h1>SSR Ver 1</h1>" }]
+};
+describe("YhAiArtifacts SSR", () => {
+  it("should render to string on server", async () => {
+    const html = await renderToString(
+      h(AiArtifacts, {
+        visible: true,
+        data: mockData
+      })
+    );
+    expect(html).toContain("yh-ai-artifacts");
+    expect(html).toContain("SSR Artifact");
+  });
+  it("should render correct mode on server", async () => {
+    const html = await renderToString(
+      h(AiArtifacts, {
+        visible: true,
+        data: mockData,
+        mode: "code"
+      })
+    );
+    expect(html).toContain("yh-ai-artifacts__code-viewer");
+  });
+  it("should render version bar when multiple versions exist", async () => {
+    const multiVersionData = {
+      ...mockData,
+      versions: [
+        { version: 1, content: "v1" },
+        { version: 2, content: "v2" }
+      ]
+    };
+    const html = await renderToString(
+      h(AiArtifacts, {
+        visible: true,
+        data: multiVersionData
+      })
+    );
+    expect(html).toContain("yh-ai-artifacts__version-bar");
+    expect(html).toContain("v1");
+    expect(html).toContain("v2");
+  });
+  it("should not render when visible is false on server", async () => {
+    const html = await renderToString(
+      h(AiArtifacts, {
+        visible: false,
+        data: mockData
+      })
+    );
+    expect(html).not.toContain("yh-ai-artifacts");
+  });
+});

package/dist/ai-artifacts/__tests__/ai-artifacts.test.cjs

@@ -0,0 +1,128 @@
+"use strict";
+
+var _vitest = require("vitest");
+var _testUtils = require("@vue/test-utils");
+var _aiArtifacts = _interopRequireDefault(require("../src/ai-artifacts.vue"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+_vitest.vi.mock("highlight.js", () => ({
+  default: {
+    getLanguage: lang => lang === "xml" || lang === "typescript",
+    highlight: code => ({
+      value: `<span>${code}</span>`
+    }),
+    highlightAuto: code => ({
+      value: `<span>${code}</span>`
+    })
+  }
+}));
+_vitest.vi.mock("highlight.js/styles/atom-one-dark.css", () => ({}));
+if (typeof window !== "undefined") {
+  global.URL.createObjectURL = _vitest.vi.fn(() => "blob:test-url");
+}
+const mockData = {
+  id: "a1",
+  title: "Test Artifact",
+  type: "html",
+  currentVersion: 1,
+  versions: [{
+    version: 1,
+    content: "<h1>Ver 1</h1>",
+    description: "Initial"
+  }, {
+    version: 2,
+    content: "<h1>Ver 2</h1>",
+    description: "Updated"
+  }]
+};
+(0, _vitest.describe)("YhAiArtifacts", () => {
+  (0, _vitest.beforeEach)(() => {
+    _vitest.vi.clearAllMocks();
+  });
+  (0, _vitest.it)("should render when visible is true", () => {
+    const wrapper = (0, _testUtils.mount)(_aiArtifacts.default, {
+      props: {
+        visible: true,
+        data: mockData
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".yh-ai-artifacts").exists()).toBe(true);
+    (0, _vitest.expect)(wrapper.find(".yh-ai-artifacts__title").text()).toBe("Test Artifact");
+  });
+  (0, _vitest.it)("should not render when visible is false", () => {
+    const wrapper = (0, _testUtils.mount)(_aiArtifacts.default, {
+      props: {
+        visible: false,
+        data: mockData
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".yh-ai-artifacts").exists()).toBe(false);
+  });
+  (0, _vitest.it)("should apply custom width", () => {
+    const wrapper = (0, _testUtils.mount)(_aiArtifacts.default, {
+      props: {
+        visible: true,
+        data: mockData,
+        width: 800
+      }
+    });
+    const root = wrapper.find(".yh-ai-artifacts");
+    (0, _vitest.expect)(root.element.style.width).toBe("800px");
+  });
+  (0, _vitest.it)("should toggle between preview and code mode", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiArtifacts.default, {
+      props: {
+        visible: true,
+        data: mockData,
+        mode: "preview"
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".yh-ai-artifacts__sandbox").exists()).toBe(true);
+    const tabs = wrapper.findAll(".yh-ai-artifacts__tab");
+    await tabs[2].trigger("click");
+    (0, _vitest.expect)(wrapper.emitted("update:mode")?.[0]).toEqual(["code"]);
+    await wrapper.setProps({
+      mode: "code"
+    });
+    (0, _vitest.expect)(wrapper.find(".yh-ai-artifacts__sandbox").exists()).toBe(false);
+    (0, _vitest.expect)(wrapper.find(".yh-ai-artifacts__code-viewer").exists()).toBe(true);
+  });
+  (0, _vitest.it)("should handle version selection", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiArtifacts.default, {
+      props: {
+        visible: true,
+        data: mockData
+      }
+    });
+    const versionItems = wrapper.findAll(".yh-ai-artifacts__version-item");
+    (0, _vitest.expect)(versionItems).toHaveLength(2);
+    await versionItems[1].trigger("click");
+    (0, _vitest.expect)(wrapper.emitted("version-change")?.[0]).toEqual([mockData.versions[1]]);
+  });
+  (0, _vitest.it)("should emit close events", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiArtifacts.default, {
+      props: {
+        visible: true,
+        data: mockData
+      }
+    });
+    const closeBtn = wrapper.find(".yh-button");
+    await closeBtn.trigger("click");
+    (0, _vitest.expect)(wrapper.emitted("update:visible")?.[0]).toEqual([false]);
+    (0, _vitest.expect)(wrapper.emitted("close")).toBeTruthy();
+  });
+  (0, _vitest.it)("should render icon based on type", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiArtifacts.default, {
+      props: {
+        visible: true,
+        data: {
+          ...mockData,
+          type: "code"
+        }
+      }
+    });
+    const icon = wrapper.findComponent({
+      name: "YhIcon"
+    });
+    (0, _vitest.expect)(icon.props("name")).toBe("code");
+  });
+});

package/dist/ai-artifacts/__tests__/ai-artifacts.test.d.ts

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

package/dist/ai-artifacts/__tests__/ai-artifacts.test.mjs

@@ -0,0 +1,109 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import { mount } from "@vue/test-utils";
+vi.mock("highlight.js", () => ({
+  default: {
+    getLanguage: (lang) => lang === "xml" || lang === "typescript",
+    highlight: (code) => ({ value: `<span>${code}</span>` }),
+    highlightAuto: (code) => ({ value: `<span>${code}</span>` })
+  }
+}));
+vi.mock("highlight.js/styles/atom-one-dark.css", () => ({}));
+if (typeof window !== "undefined") {
+  global.URL.createObjectURL = vi.fn(() => "blob:test-url");
+}
+import AiArtifacts from "../src/ai-artifacts.vue";
+const mockData = {
+  id: "a1",
+  title: "Test Artifact",
+  type: "html",
+  currentVersion: 1,
+  versions: [
+    { version: 1, content: "<h1>Ver 1</h1>", description: "Initial" },
+    { version: 2, content: "<h1>Ver 2</h1>", description: "Updated" }
+  ]
+};
+describe("YhAiArtifacts", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+  it("should render when visible is true", () => {
+    const wrapper = mount(AiArtifacts, {
+      props: {
+        visible: true,
+        data: mockData
+      }
+    });
+    expect(wrapper.find(".yh-ai-artifacts").exists()).toBe(true);
+    expect(wrapper.find(".yh-ai-artifacts__title").text()).toBe("Test Artifact");
+  });
+  it("should not render when visible is false", () => {
+    const wrapper = mount(AiArtifacts, {
+      props: {
+        visible: false,
+        data: mockData
+      }
+    });
+    expect(wrapper.find(".yh-ai-artifacts").exists()).toBe(false);
+  });
+  it("should apply custom width", () => {
+    const wrapper = mount(AiArtifacts, {
+      props: {
+        visible: true,
+        data: mockData,
+        width: 800
+      }
+    });
+    const root = wrapper.find(".yh-ai-artifacts");
+    expect(root.element.style.width).toBe("800px");
+  });
+  it("should toggle between preview and code mode", async () => {
+    const wrapper = mount(AiArtifacts, {
+      props: {
+        visible: true,
+        data: mockData,
+        mode: "preview"
+      }
+    });
+    expect(wrapper.find(".yh-ai-artifacts__sandbox").exists()).toBe(true);
+    const tabs = wrapper.findAll(".yh-ai-artifacts__tab");
+    await tabs[2].trigger("click");
+    expect(wrapper.emitted("update:mode")?.[0]).toEqual(["code"]);
+    await wrapper.setProps({ mode: "code" });
+    expect(wrapper.find(".yh-ai-artifacts__sandbox").exists()).toBe(false);
+    expect(wrapper.find(".yh-ai-artifacts__code-viewer").exists()).toBe(true);
+  });
+  it("should handle version selection", async () => {
+    const wrapper = mount(AiArtifacts, {
+      props: {
+        visible: true,
+        data: mockData
+      }
+    });
+    const versionItems = wrapper.findAll(".yh-ai-artifacts__version-item");
+    expect(versionItems).toHaveLength(2);
+    await versionItems[1].trigger("click");
+    expect(wrapper.emitted("version-change")?.[0]).toEqual([mockData.versions[1]]);
+  });
+  it("should emit close events", async () => {
+    const wrapper = mount(AiArtifacts, {
+      props: {
+        visible: true,
+        data: mockData
+      }
+    });
+    const closeBtn = wrapper.find(".yh-button");
+    await closeBtn.trigger("click");
+    expect(wrapper.emitted("update:visible")?.[0]).toEqual([false]);
+    expect(wrapper.emitted("close")).toBeTruthy();
+  });
+  it("should render icon based on type", async () => {
+    const wrapper = mount(AiArtifacts, {
+      props: {
+        visible: true,
+        data: { ...mockData, type: "code" }
+      }
+    });
+    const icon = wrapper.findComponent({ name: "YhIcon" });
+    expect(icon.props("name")).toBe("code");
+  });
+});

package/dist/ai-artifacts/index.cjs

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  YhAiArtifacts: true
+};
+module.exports = exports.YhAiArtifacts = void 0;
+var _utils = require("@yh-ui/utils");
+var _aiArtifacts = _interopRequireDefault(require("./src/ai-artifacts.vue"));
+var _aiArtifacts2 = require("./src/ai-artifacts.cjs");
+Object.keys(_aiArtifacts2).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _aiArtifacts2[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _aiArtifacts2[key];
+    }
+  });
+});
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const YhAiArtifacts = exports.YhAiArtifacts = (0, _utils.withInstall)(_aiArtifacts.default);
+module.exports = YhAiArtifacts;

package/dist/ai-artifacts/index.d.ts

@@ -0,0 +1,3 @@
+export declare const YhAiArtifacts: any;
+export default YhAiArtifacts;
+export * from './src/ai-artifacts';

package/dist/ai-artifacts/index.mjs

@@ -0,0 +1,5 @@
+import { withInstall } from "@yh-ui/utils";
+import AiArtifacts from "./src/ai-artifacts.vue";
+export const YhAiArtifacts = withInstall(AiArtifacts);
+export default YhAiArtifacts;
+export * from "./src/ai-artifacts.mjs";

package/dist/ai-artifacts/src/ai-artifacts.cjs

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.aiArtifactsProps = exports.aiArtifactsEmits = void 0;
+const aiArtifactsProps = exports.aiArtifactsProps = {
+  /**
+   * 是否显示侧边栏
+   */
+  visible: {
+    type: Boolean,
+    default: false
+  },
+  /**
+   * 正在展示的 Artifact 数据
+   */
+  data: {
+    type: Object
+  },
+  /**
+   * 侧边栏宽度
+   */
+  width: {
+    type: [String, Number],
+    default: "50%"
+  },
+  /**
+   * 是否全屏展示
+   */
+  fullscreen: {
+    type: Boolean,
+    default: false
+  },
+  /**
+   * 渲染模式：preview (预览) | code (源码) | inline (行内/嵌入)
+   */
+  mode: {
+    type: String,
+    default: "preview"
+  },
+  /**
+   * 主题覆盖变量
+   */
+  themeOverrides: {
+    type: Object,
+    default: void 0
+  }
+};
+const aiArtifactsEmits = exports.aiArtifactsEmits = {
+  "update:visible": _val => true,
+  "update:mode": _val => true,
+  "version-change": _version => true,
+  close: () => true
+};