@yh-ui/components 0.1.7 → 0.1.12

package/dist/ai-conversations/src/ai-conversations.vue.d.ts

@@ -0,0 +1,52 @@
+import type { AiConversation } from '@yh-ui/hooks';
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {
+    label: any;
+}, __VLS_11: {}, __VLS_13: {}, __VLS_15: {};
+type __VLS_Slots = {} & {
+    'add-icon'?: (props: typeof __VLS_1) => any;
+} & {
+    'add-text'?: (props: typeof __VLS_3) => any;
+} & {
+    'group-label'?: (props: typeof __VLS_5) => any;
+} & {
+    'edit-icon'?: (props: typeof __VLS_11) => any;
+} & {
+    'delete-icon'?: (props: typeof __VLS_13) => any;
+} & {
+    empty?: (props: typeof __VLS_15) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    data: {
+        type: import("vue").PropType<AiConversation[]>;
+        default: () => never[];
+    };
+    activeId: {
+        type: StringConstructor;
+        default: string;
+    };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    themeOverrides: {
+        type: import("vue").PropType<import("@yh-ui/theme").AiConversationsThemeVars>;
+        default: undefined;
+    };
+    grouped: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {
+    themeOverrides: import("@yh-ui/theme").AiConversationsThemeVars;
+    data: AiConversation[];
+    loading: boolean;
+    activeId: string;
+    grouped: 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-editor-sender/__tests__/ai-editor-sender.ssr.test.cjs

@@ -0,0 +1,62 @@
+"use strict";
+
+var _vitest = require("vitest");
+var _serverRenderer = require("@vue/server-renderer");
+var _vue = require("vue");
+var _aiEditorSender = _interopRequireDefault(require("../src/ai-editor-sender.vue"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+(0, _vitest.describe)("YhAiEditorSender SSR", () => {
+  (0, _vitest.it)("should render to string on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default));
+    (0, _vitest.expect)(html).toContain("yh-ai-editor-sender");
+  });
+  (0, _vitest.it)("should render textarea on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default));
+    (0, _vitest.expect)(html).toContain("textarea");
+  });
+  (0, _vitest.it)("should render placeholder on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default, {
+      placeholder: "Type here..."
+    }));
+    (0, _vitest.expect)(html).toContain("Type here...");
+  });
+  (0, _vitest.it)("should render disabled state on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default, {
+      disabled: true
+    }));
+    (0, _vitest.expect)(html).toContain("is-disabled");
+  });
+  (0, _vitest.it)("should render loading state on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default, {
+      loading: true
+    }));
+    (0, _vitest.expect)(html).toContain("is-loading");
+  });
+  (0, _vitest.it)("should render word limit section on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default, {
+      modelValue: "hello",
+      showWordLimit: true,
+      maxLength: 200
+    }));
+    (0, _vitest.expect)(html).toContain("yh-ai-editor-sender__word-limit");
+    (0, _vitest.expect)(html).toContain("200");
+  });
+  (0, _vitest.it)("should render attachment on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default, {
+      attachments: [{
+        name: "report.pdf",
+        type: "document"
+      }]
+    }));
+    (0, _vitest.expect)(html).toContain("yh-ai-editor-sender__header");
+    (0, _vitest.expect)(html).toContain("report.pdf");
+  });
+  (0, _vitest.it)("should render send button on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default));
+    (0, _vitest.expect)(html).toContain("yh-ai-editor-sender__send-btn");
+  });
+  (0, _vitest.it)("should render footer section on server", async () => {
+    const html = await (0, _serverRenderer.renderToString)((0, _vue.h)(_aiEditorSender.default));
+    (0, _vitest.expect)(html).toContain("yh-ai-editor-sender__footer");
+  });
+});

package/dist/ai-editor-sender/__tests__/ai-editor-sender.ssr.test.d.ts

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

package/dist/ai-editor-sender/__tests__/ai-editor-sender.ssr.test.mjs

@@ -0,0 +1,50 @@
+import { describe, it, expect } from "vitest";
+import { renderToString } from "@vue/server-renderer";
+import { h } from "vue";
+import AiEditorSender from "../src/ai-editor-sender.vue";
+describe("YhAiEditorSender SSR", () => {
+  it("should render to string on server", async () => {
+    const html = await renderToString(h(AiEditorSender));
+    expect(html).toContain("yh-ai-editor-sender");
+  });
+  it("should render textarea on server", async () => {
+    const html = await renderToString(h(AiEditorSender));
+    expect(html).toContain("textarea");
+  });
+  it("should render placeholder on server", async () => {
+    const html = await renderToString(h(AiEditorSender, { placeholder: "Type here..." }));
+    expect(html).toContain("Type here...");
+  });
+  it("should render disabled state on server", async () => {
+    const html = await renderToString(h(AiEditorSender, { disabled: true }));
+    expect(html).toContain("is-disabled");
+  });
+  it("should render loading state on server", async () => {
+    const html = await renderToString(h(AiEditorSender, { loading: true }));
+    expect(html).toContain("is-loading");
+  });
+  it("should render word limit section on server", async () => {
+    const html = await renderToString(
+      h(AiEditorSender, { modelValue: "hello", showWordLimit: true, maxLength: 200 })
+    );
+    expect(html).toContain("yh-ai-editor-sender__word-limit");
+    expect(html).toContain("200");
+  });
+  it("should render attachment on server", async () => {
+    const html = await renderToString(
+      h(AiEditorSender, {
+        attachments: [{ name: "report.pdf", type: "document" }]
+      })
+    );
+    expect(html).toContain("yh-ai-editor-sender__header");
+    expect(html).toContain("report.pdf");
+  });
+  it("should render send button on server", async () => {
+    const html = await renderToString(h(AiEditorSender));
+    expect(html).toContain("yh-ai-editor-sender__send-btn");
+  });
+  it("should render footer section on server", async () => {
+    const html = await renderToString(h(AiEditorSender));
+    expect(html).toContain("yh-ai-editor-sender__footer");
+  });
+});

package/dist/ai-editor-sender/__tests__/ai-editor-sender.test.cjs

@@ -0,0 +1,315 @@
+"use strict";
+
+var _vitest = require("vitest");
+var _testUtils = require("@vue/test-utils");
+var _vue = require("vue");
+var _aiEditorSender = _interopRequireDefault(require("../src/ai-editor-sender.vue"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+(0, _vitest.describe)("YhAiEditorSender", () => {
+  (0, _vitest.it)("should render with base class", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default);
+    (0, _vitest.expect)(wrapper.find(".yh-ai-editor-sender").exists()).toBe(true);
+  });
+  (0, _vitest.it)("should render textarea", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default);
+    (0, _vitest.expect)(wrapper.find("textarea").exists()).toBe(true);
+  });
+  (0, _vitest.it)("should render with placeholder", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        placeholder: "Type here..."
+      }
+    });
+    (0, _vitest.expect)(wrapper.find("textarea").attributes("placeholder")).toBe("Type here...");
+  });
+  (0, _vitest.it)("should render modelValue in textarea", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "initial text"
+      }
+    });
+    (0, _vitest.expect)(wrapper.find("textarea").element.value).toBe("initial text");
+  });
+  (0, _vitest.it)("should emit update:modelValue on input", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: ""
+      }
+    });
+    const textarea = wrapper.find("textarea");
+    await textarea.setValue("hello");
+    const emitted = wrapper.emitted("update:modelValue");
+    (0, _vitest.expect)(emitted).toBeTruthy();
+    (0, _vitest.expect)(emitted[emitted.length - 1][0]).toBe("hello");
+  });
+  (0, _vitest.it)("should emit change on input", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: ""
+      }
+    });
+    await wrapper.find("textarea").setValue("changed");
+    (0, _vitest.expect)(wrapper.emitted("change")).toBeTruthy();
+  });
+  (0, _vitest.it)("should apply is-disabled class when disabled=true", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        disabled: true
+      }
+    });
+    (0, _vitest.expect)(wrapper.classes()).toContain("is-disabled");
+  });
+  (0, _vitest.it)("should disable textarea when disabled=true", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        disabled: true
+      }
+    });
+    (0, _vitest.expect)(wrapper.find("textarea").element.disabled).toBe(true);
+  });
+  (0, _vitest.it)("should apply is-loading class when loading=true", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        loading: true
+      }
+    });
+    (0, _vitest.expect)(wrapper.classes()).toContain("is-loading");
+  });
+  (0, _vitest.it)("should disable textarea when loading=true", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        loading: true
+      }
+    });
+    (0, _vitest.expect)(wrapper.find("textarea").element.disabled).toBe(true);
+  });
+  (0, _vitest.it)("should emit send event when send button clicked with text", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "Hello"
+      }
+    });
+    const sendBtn = wrapper.find(".yh-ai-editor-sender__send-btn");
+    await sendBtn.trigger("click");
+    (0, _vitest.expect)(wrapper.emitted("send")).toBeTruthy();
+    const emitted = wrapper.emitted("send");
+    (0, _vitest.expect)(emitted[0][0]).toBe("Hello");
+  });
+  (0, _vitest.it)("should NOT emit send if textarea is empty", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: ""
+      }
+    });
+    const sendBtn = wrapper.find(".yh-ai-editor-sender__send-btn");
+    await sendBtn.trigger("click");
+    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
+  });
+  (0, _vitest.it)("should NOT emit send if disabled", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "some text",
+        disabled: true
+      }
+    });
+    const sendBtn = wrapper.find(".yh-ai-editor-sender__send-btn");
+    await sendBtn.trigger("click");
+    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
+  });
+  (0, _vitest.it)("should NOT emit send if loading", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "some text",
+        loading: true
+      }
+    });
+    const sendBtn = wrapper.find(".yh-ai-editor-sender__send-btn");
+    await sendBtn.trigger("click");
+    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
+  });
+  (0, _vitest.it)("should emit send on Enter key (without Shift)", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "Hello"
+      }
+    });
+    await wrapper.find("textarea").trigger("keydown", {
+      key: "Enter",
+      shiftKey: false
+    });
+    (0, _vitest.expect)(wrapper.emitted("send")).toBeTruthy();
+  });
+  (0, _vitest.it)("should NOT emit send on Shift+Enter", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "Hello"
+      }
+    });
+    await wrapper.find("textarea").trigger("keydown", {
+      key: "Enter",
+      shiftKey: true
+    });
+    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
+  });
+  (0, _vitest.it)("should NOT emit send on Enter key when empty (prevents default)", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "   "
+      }
+    });
+    await wrapper.find("textarea").trigger("keydown", {
+      key: "Enter",
+      shiftKey: false
+    });
+    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
+  });
+  (0, _vitest.it)("should clear value after send", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "Hello"
+      }
+    });
+    const sendBtn = wrapper.find(".yh-ai-editor-sender__send-btn");
+    await sendBtn.trigger("click");
+    await (0, _vue.nextTick)();
+    const emitted = wrapper.emitted("update:modelValue");
+    const lastEmit = emitted[emitted.length - 1][0];
+    (0, _vitest.expect)(lastEmit).toBe("");
+  });
+  (0, _vitest.it)("should render attachments header when attachments provided", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        attachments: [{
+          name: "file.ts",
+          type: "document"
+        }]
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".yh-ai-editor-sender__header").exists()).toBe(true);
+    (0, _vitest.expect)(wrapper.find(".yh-ai-editor-sender__attachment").exists()).toBe(true);
+  });
+  (0, _vitest.it)("should not render attachments header when empty", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        attachments: []
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".yh-ai-editor-sender__header").exists()).toBe(false);
+  });
+  (0, _vitest.it)("should emit remove-attachment when remove icon clicked", async () => {
+    const attachments = [{
+      name: "file.ts",
+      type: "document"
+    }];
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        attachments
+      }
+    });
+    const removeBtn = wrapper.find(".yh-ai-editor-sender__attachment-remove");
+    await removeBtn.trigger("click");
+    (0, _vitest.expect)(wrapper.emitted("remove-attachment")).toBeTruthy();
+    const emitted = wrapper.emitted("remove-attachment");
+    (0, _vitest.expect)(emitted[0][0]).toBe(0);
+  });
+  (0, _vitest.it)("should render word limit when showWordLimit=true and maxLength provided", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "hi",
+        showWordLimit: true,
+        maxLength: 100
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".yh-ai-editor-sender__word-limit").exists()).toBe(true);
+    (0, _vitest.expect)(wrapper.find(".yh-ai-editor-sender__word-limit").text()).toContain("100");
+  });
+  (0, _vitest.it)("should not render word limit without maxLength", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        showWordLimit: true
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".yh-ai-editor-sender__word-limit").exists()).toBe(false);
+  });
+  (0, _vitest.it)("should apply is-focused class on textarea focus", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default);
+    await wrapper.find("textarea").trigger("focus");
+    (0, _vitest.expect)(wrapper.classes()).toContain("is-focused");
+  });
+  (0, _vitest.it)("should remove is-focused class on textarea blur", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default);
+    await wrapper.find("textarea").trigger("focus");
+    await wrapper.find("textarea").trigger("blur");
+    (0, _vitest.expect)(wrapper.classes()).not.toContain("is-focused");
+  });
+  (0, _vitest.it)("should render toolbar slot", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      slots: {
+        toolbar: '<button class="toolbar-btn">Tool</button>'
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".toolbar-btn").exists()).toBe(true);
+  });
+  (0, _vitest.it)("should render actions slot", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      slots: {
+        actions: '<span class="custom-action">Model</span>'
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".custom-action").exists()).toBe(true);
+  });
+  (0, _vitest.it)("should render header slot as attachment override", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        attachments: [{
+          name: "f.ts",
+          type: "document"
+        }]
+      },
+      slots: {
+        header: '<div class="custom-header">Header</div>'
+      }
+    });
+    (0, _vitest.expect)(wrapper.find(".custom-header").exists()).toBe(true);
+  });
+  (0, _vitest.it)("should set rows attribute on textarea", () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        rows: 5
+      }
+    });
+    (0, _vitest.expect)(wrapper.find("textarea").attributes("rows")).toBe("5");
+  });
+  (0, _vitest.it)("should update textarea when modelValue prop changes", async () => {
+    const wrapper = (0, _testUtils.mount)(_aiEditorSender.default, {
+      props: {
+        modelValue: "old text"
+      }
+    });
+    await wrapper.setProps({
+      modelValue: "new text"
+    });
+    await (0, _vue.nextTick)();
+    (0, _vitest.expect)(wrapper.find("textarea").element.value).toBe("new text");
+  });
+  (0, _vitest.describe)("aiEditorSenderEmits", () => {
+    (0, _vitest.it)("should validate send event", async () => {
+      const {
+        aiEditorSenderEmits
+      } = await Promise.resolve().then(() => require("../src/ai-editor-sender.cjs"));
+      (0, _vitest.expect)(aiEditorSenderEmits.send("hello")).toBe(true);
+      (0, _vitest.expect)(aiEditorSenderEmits.send("")).toBe(false);
+    });
+    (0, _vitest.it)("should pass-through other event validators", async () => {
+      const {
+        aiEditorSenderEmits
+      } = await Promise.resolve().then(() => require("../src/ai-editor-sender.cjs"));
+      (0, _vitest.expect)(aiEditorSenderEmits["update:modelValue"]("text")).toBe(true);
+      (0, _vitest.expect)(aiEditorSenderEmits.change("text")).toBe(true);
+      (0, _vitest.expect)(aiEditorSenderEmits["remove-attachment"](0, {
+        name: "f"
+      })).toBe(true);
+      (0, _vitest.expect)(aiEditorSenderEmits.clear()).toBe(true);
+    });
+  });
+});

package/dist/ai-editor-sender/__tests__/ai-editor-sender.test.d.ts

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