@shwfed/config 2.11.5 → 2.12.0

package/dist/runtime/components/table/utils/shared.js

@@ -26,36 +26,35 @@ export function columnFields(configure) {
     // → still validated as a CEL expression (empty string stays invalid).
     accessor: Schema.optional(CelRowAccess(configure).annotations({
       title: "\u8DEF\u5F84",
-      description: "\u884C\u6570\u636E\u8BBF\u95EE CEL \u8868\u8FBE\u5F0F\uFF0C\u4F8B\u5982 `row.user.name`\uFF1B\u53EF\u7559\u7A7A\uFF0C\u7559\u7A7A\u65F6\u8BE5\u5217\u4E0D\u8BFB\u53D6\u6570\u636E\uFF08\u7528\u4E8E\u7EAF\u89C6\u89C9\u5217\uFF09"
+      description: md`
+        使用 CEL 获取该列的值，建议使用 optional 语法。如
+
+        - \`row.?foo\`
+        - \`row.?foo.?bar\`
+      `
     })),
     enableSorting: Schema.optional(Schema.Boolean.annotations({
-      title: "\u5141\u8BB8\u6392\u5E8F",
+      title: "\u6392\u5E8F",
       description: md`
-        显示排序按钮：
-
-        排序分为两类：**服务端排序** 和 **客户端排序**。
-
-        | | 服务端排序 | 客户端排序 |
-        | --- | --- | --- |
-        | 数据量 | **全量**，能够跨越多页 | 当前页 |
-        | 开发量 | 需要后端支持，可能影响性能 | **配置即启用，无需后端支持** |
+        在该列向用户展示排序按钮。如果需要通过后端对全库排序，务必同时配置
 
-        注意：对于服务端排序，除了在这里打开排序开关，你还需要在「通用配置 → 数据源 → 请求」处，通过 \`sorts\` 变量**将各列「排序字段」(sortKey)、排序方向传给后端**。
+        - **排序字段** 用来指定传给后端的字段名
+        - 在表格数据源中，使用 \`sorts\` 变量构造符合需求的请求
       `
     })),
     sortKey: Schema.optional(Schema.String.pipe(Schema.minLength(1)).annotations({
       title: "\u6392\u5E8F\u5B57\u6BB5",
-      description: "\u670D\u52A1\u7AEF\u6392\u5E8F\u65F6\u901A\u8FC7\u6570\u636E\u6E90\u8BF7\u6C42\u7684 `sorts` \u53D8\u91CF\u4F20\u7ED9\u540E\u7AEF\u7684\u5B57\u6BB5\u6807\u8BC6\uFF1B\u542F\u7528\u6392\u5E8F\u65F6\u5FC5\u586B"
+      description: "\u540E\u7AEF\u9700\u8981\u7684\u6392\u5E8F\u5B57\u6BB5\u540D"
     })),
     size: Schema.optional(Schema.Number.pipe(Schema.finite(), Schema.positive()).annotations({
       title: "\u5217\u5BBD",
-      description: "\u6307\u5B9A\u4E00\u4E2A\u5408\u9002\u7684\u8868\u683C\u5217\u5BBD\u5EA6\uFF0C\u5F53\u5217\u5185\u5BB9\u957F\u5EA6\u5927\u4E8E\u8FD9\u91CC\u6307\u5B9A\u7684\u5BBD\u5EA6\u540E\uFF0C\u4F1A\u5BFC\u81F4\u8D85\u51FA\u7684\u90E8\u5206\u88AB\u622A\u65AD\u3002"
+      description: "\u5BF9\u4E8E\u6CA1\u6709\u6307\u5B9A\u5217\u5BBD\u7684\u5217\uFF0C\u5C06\u9ED8\u8BA4\u4E3A 150px"
     })),
-    grow: Schema.optional(Schema.Boolean.annotations({ title: "\u5360\u636E\u5269\u4F59\u5BBD\u5EA6", description: "\u5217\u662F\u5426\u5360\u636E\u5269\u4F59\u7A7A\u4F59\u5BBD\u5EA6" })),
-    tooltip: Schema.optional(Locale.annotations({ title: "\u63D0\u793A", description: "\u5217\u6807\u9898\u60AC\u6D6E\u63D0\u793A\uFF0C\u652F\u6301 Markdown" })),
+    grow: Schema.optional(Schema.Boolean.annotations({ title: "\u6491\u5F00", description: "\u5BF9\u4E8E\u4E00\u4E9B\u5173\u952E\u5B57\u6BB5\uFF0C\u53EF\u4EE5\u5F00\u542F\u8FD9\u4E2A\u9009\u9879\u4F7F\u5176\u5C3D\u53EF\u80FD\u5360\u636E\u66F4\u591A\u7684\u7A7A\u95F4" })),
+    tooltip: Schema.optional(Locale.annotations({ title: "\u63D0\u793A", description: "\u5F53\u7528\u6237\u9F20\u6807\u79FB\u52A8\u81F3\u5217\u6807\u9898\u4E0A\u65F6\uFF0C\u5C06\u5411\u7528\u6237\u5C55\u793A\u6B64\u5904\u914D\u7F6E\u7684\u5185\u5BB9" })),
     hidden: Schema.optional(Schema.Boolean.annotations({
-      title: "\u9ED8\u8BA4\u9690\u85CF",
-      description: "\u5F00\u542F\u540E\u8BE5\u5217\u9ED8\u8BA4\u9690\u85CF\uFF1B\u4F7F\u7528\u8005\u53EF\u5728\u8868\u683C\u7684\u5217\u8BBE\u7F6E\u4E2D\u91CD\u65B0\u663E\u793A\u3002\u4EC5\u4F5C\u4E3A\u521D\u59CB\u72B6\u6001\uFF0C\u4E0D\u968F\u6570\u636E\u53D8\u5316"
+      title: "\u9690\u85CF",
+      description: "\u9ED8\u8BA4\u9690\u85CF\u8BE5\u5217\u3002\u7528\u6237\u53EF\u4EE5\u5728\u5176\u81EA\u5B9A\u4E49\u8868\u683C\u7684\u914D\u7F6E\u4E2D\u663E\u793A\u8BE5\u5217\uFF0C\u6B64\u65F6\u7528\u6237\u914D\u7F6E\u4F18\u5148\u7EA7\u9AD8\u4E8E\u6B64\u5904\u7684\u914D\u7F6E"
     }))
   };
 }

package/dist/runtime/components/ui/alert-dialog/AlertDialogFooter.vue

@@ -8,7 +8,7 @@ const props = defineProps({
 <template>
   <div
     data-slot="alert-dialog-footer"
-    :class="cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end sm:mx-auto', props.class)"
+    :class="cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-center sm:mx-auto', props.class)"
   >
     <slot />
   </div>

package/dist/runtime/components/ui/chat/ChatMessage.d.vue.ts

@@ -0,0 +1,7 @@
+import type { UIMessage } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    message: UIMessage;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatMessage.vue

@@ -0,0 +1,35 @@
+<script setup>
+import { computed } from "vue";
+import ChatMessagePart from "./ChatMessagePart.vue";
+defineOptions({ name: "UiChatMessage" });
+const props = defineProps({
+  message: { type: Object, required: true }
+});
+const isUser = computed(() => props.message.role === "user");
+const userText = computed(
+  () => props.message.parts.filter((p) => p.type === "text").map((p) => p.text).join("")
+);
+</script>
+
+<template>
+  <div
+    v-if="isUser"
+    :data-role="message.role"
+    data-slot="user-message"
+    class="max-w-[85%] self-end whitespace-pre-wrap break-words rounded-lg bg-[color-mix(in_srgb,var(--primary)_10%,white)] px-3 py-2 text-sm text-zinc-700"
+  >
+    {{ userText }}
+  </div>
+  <div
+    v-else
+    :data-role="message.role"
+    data-slot="assistant-message"
+    class="flex w-full flex-col items-stretch gap-2"
+  >
+    <ChatMessagePart
+      v-for="(part, i) in message.parts"
+      :key="i"
+      :part="part"
+    />
+  </div>
+</template>

package/dist/runtime/components/ui/chat/ChatMessage.vue.d.ts

@@ -0,0 +1,7 @@
+import type { UIMessage } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    message: UIMessage;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatMessagePart.d.vue.ts

@@ -0,0 +1,7 @@
+import type { UIMessagePart } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    part: UIMessagePart;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatMessagePart.vue

@@ -0,0 +1,43 @@
+<script setup>
+import { computed } from "vue";
+import { isToolUIPart } from "../../../utils/ai/parts";
+import { StreamMarkdown } from "../stream-markdown";
+import ChatReasoning from "./ChatReasoning.vue";
+import ChatToolCall from "./ChatToolCall.vue";
+defineOptions({ name: "UiChatMessagePart" });
+const props = defineProps({
+  part: { type: Object, required: true }
+});
+const toolPart = computed(() => isToolUIPart(props.part) ? props.part : null);
+const reasoningPart = computed(() => props.part.type === "reasoning" ? props.part : null);
+const textPart = computed(
+  () => props.part.type === "text" && props.part.text.trim().length > 0 ? props.part : null
+);
+const isStepStart = computed(() => props.part.type === "step-start");
+</script>
+
+<template>
+  <ChatToolCall
+    v-if="toolPart"
+    :part="toolPart"
+  />
+  <ChatReasoning
+    v-else-if="reasoningPart"
+    :part="reasoningPart"
+  />
+  <hr
+    v-else-if="isStepStart"
+    data-slot="chat-step-start"
+    class="my-1 border-zinc-200/70"
+  >
+  <div
+    v-else-if="textPart"
+    data-slot="chat-text"
+    class="w-fit max-w-full rounded-lg bg-zinc-100 px-3 py-2"
+  >
+    <StreamMarkdown
+      :source="textPart.text"
+      class="prose prose-sm prose-zinc max-w-none text-sm text-zinc-700"
+    />
+  </div>
+</template>

package/dist/runtime/components/ui/chat/ChatMessagePart.vue.d.ts

@@ -0,0 +1,7 @@
+import type { UIMessagePart } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    part: UIMessagePart;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatMessages.d.vue.ts

@@ -0,0 +1,18 @@
+import type { UIMessage } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    messages: ReadonlyArray<UIMessage>;
+    pending?: boolean;
+};
+declare var __VLS_19: {};
+type __VLS_Slots = {} & {
+    empty?: (props: typeof __VLS_19) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/chat/ChatMessages.vue

@@ -0,0 +1,63 @@
+<script setup>
+import { nextTick, ref, watch } from "vue";
+import { Icon } from "@iconify/vue";
+import { ScrollArea } from "../scroll-area";
+import ChatMessage from "./ChatMessage.vue";
+defineOptions({ name: "UiChatMessages" });
+const props = defineProps({
+  messages: { type: Array, required: true },
+  pending: { type: Boolean, required: false }
+});
+const root = ref(null);
+function scrollToBottom() {
+  const viewport = root.value?.$el?.querySelector?.(
+    '[data-slot="scroll-area-viewport"]'
+  );
+  if (viewport) viewport.scrollTop = viewport.scrollHeight;
+}
+watch(
+  () => [props.messages, props.pending],
+  () => nextTick(scrollToBottom),
+  { flush: "post" }
+);
+</script>
+
+<template>
+  <div class="relative">
+    <ScrollArea
+      ref="root"
+      class="size-full"
+    >
+      <div class="flex flex-col gap-4 p-3">
+        <ChatMessage
+          v-for="m in messages"
+          :key="m.id"
+          :message="m"
+        />
+
+        <div
+          v-if="pending"
+          data-slot="chat-typing"
+          class="flex items-center gap-2 self-start text-xs text-zinc-400"
+        >
+          <Icon
+            icon="fluent:spinner-ios-20-regular"
+            class="size-4 animate-spin"
+          />
+          <span>生成中…</span>
+        </div>
+      </div>
+    </ScrollArea>
+
+    <!-- Empty state, physically centered over the FULL message area: the root is
+         `relative` and this overlay is `inset-0`, so it sits dead-center rather
+         than pinned to the top of the scroll content. `pointer-events-none` so it
+         never intercepts (there's nothing to click when empty anyway). -->
+    <div
+      v-if="messages.length === 0 && !pending"
+      class="pointer-events-none absolute inset-0 flex items-center justify-center"
+    >
+      <slot name="empty" />
+    </div>
+  </div>
+</template>

package/dist/runtime/components/ui/chat/ChatMessages.vue.d.ts

@@ -0,0 +1,18 @@
+import type { UIMessage } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    messages: ReadonlyArray<UIMessage>;
+    pending?: boolean;
+};
+declare var __VLS_19: {};
+type __VLS_Slots = {} & {
+    empty?: (props: typeof __VLS_19) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ui/chat/ChatPrompt.d.vue.ts

@@ -0,0 +1,24 @@
+import type { ChatStatus } from '.';
+type __VLS_Props = {
+    status?: ChatStatus;
+    placeholder?: string;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    stop: () => any;
+    submit: () => any;
+    "update:modelValue": (value: string) => any;
+    retry: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onStop?: (() => any) | undefined;
+    onSubmit?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onRetry?: (() => any) | undefined;
+}>, {
+    status: ChatStatus;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatPrompt.vue

@@ -0,0 +1,43 @@
+<script setup>
+import { InputGroup, InputGroupAddon, InputGroupTextarea } from "../input-group";
+import ChatPromptSubmit from "./ChatPromptSubmit.vue";
+defineOptions({ name: "UiChatPrompt" });
+const text = defineModel({ type: String, ...{ default: "" } });
+const props = defineProps({
+  status: { type: String, required: false, default: "ready" },
+  placeholder: { type: String, required: false }
+});
+const emit = defineEmits(["submit", "stop", "retry"]);
+function submit() {
+  if (props.status === "streaming") return;
+  if (!text.value.trim()) return;
+  emit("submit");
+}
+function onKeydown(e) {
+  if (e.key === "Enter" && !e.shiftKey && !e.isComposing) {
+    e.preventDefault();
+    submit();
+  }
+}
+</script>
+
+<template>
+  <InputGroup class="bg-white">
+    <InputGroupTextarea
+      v-model="text"
+      :disabled="status === 'streaming'"
+      :placeholder="placeholder"
+      class="max-h-48 min-h-20 text-sm"
+      @keydown="onKeydown"
+    />
+    <InputGroupAddon align="block-end">
+      <ChatPromptSubmit
+        :status="status"
+        :disabled="!text.trim()"
+        @submit="submit"
+        @stop="emit('stop')"
+        @retry="emit('retry')"
+      />
+    </InputGroupAddon>
+  </InputGroup>
+</template>

package/dist/runtime/components/ui/chat/ChatPrompt.vue.d.ts

@@ -0,0 +1,24 @@
+import type { ChatStatus } from '.';
+type __VLS_Props = {
+    status?: ChatStatus;
+    placeholder?: string;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    stop: () => any;
+    submit: () => any;
+    "update:modelValue": (value: string) => any;
+    retry: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onStop?: (() => any) | undefined;
+    onSubmit?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onRetry?: (() => any) | undefined;
+}>, {
+    status: ChatStatus;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatPromptSubmit.d.vue.ts

@@ -0,0 +1,18 @@
+import type { ChatStatus } from '.';
+type __VLS_Props = {
+    status?: ChatStatus;
+    disabled?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    stop: () => any;
+    submit: () => any;
+    retry: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onStop?: (() => any) | undefined;
+    onSubmit?: (() => any) | undefined;
+    onRetry?: (() => any) | undefined;
+}>, {
+    status: ChatStatus;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatPromptSubmit.vue

@@ -0,0 +1,41 @@
+<script setup>
+import { computed } from "vue";
+import { Icon } from "@iconify/vue";
+import { Button } from "../button";
+defineOptions({ name: "UiChatPromptSubmit" });
+const props = defineProps({
+  status: { type: String, required: false, default: "ready" },
+  disabled: { type: Boolean, required: false }
+});
+const emit = defineEmits(["submit", "stop", "retry"]);
+const view = computed(() => {
+  switch (props.status) {
+    case "streaming":
+      return { icon: "fluent:stop-20-filled", label: "\u505C\u6B62", variant: "default", action: "stop" };
+    case "error":
+      return { icon: "fluent:arrow-clockwise-20-regular", label: "\u91CD\u8BD5", variant: "default", action: "retry" };
+    default:
+      return { icon: "fluent:send-20-regular", label: "\u53D1\u9001", variant: "primary", action: "submit" };
+  }
+});
+function onClick() {
+  const action = view.value.action;
+  if (action === "stop") emit("stop");
+  else if (action === "retry") emit("retry");
+  else emit("submit");
+}
+</script>
+
+<template>
+  <Button
+    type="button"
+    size="sm"
+    :variant="view.variant"
+    :disabled="disabled && status === 'ready'"
+    data-slot="chat-prompt-submit"
+    @click="onClick"
+  >
+    <Icon :icon="view.icon" />
+    {{ view.label }}
+  </Button>
+</template>

package/dist/runtime/components/ui/chat/ChatPromptSubmit.vue.d.ts

@@ -0,0 +1,18 @@
+import type { ChatStatus } from '.';
+type __VLS_Props = {
+    status?: ChatStatus;
+    disabled?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    stop: () => any;
+    submit: () => any;
+    retry: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onStop?: (() => any) | undefined;
+    onSubmit?: (() => any) | undefined;
+    onRetry?: (() => any) | undefined;
+}>, {
+    status: ChatStatus;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatReasoning.d.vue.ts

@@ -0,0 +1,7 @@
+import type { ReasoningUIPart } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    part: ReasoningUIPart;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatReasoning.vue

@@ -0,0 +1,33 @@
+<script setup>
+import { computed } from "vue";
+import { Icon } from "@iconify/vue";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../collapsible";
+defineOptions({ name: "UiChatReasoning" });
+const props = defineProps({
+  part: { type: Object, required: true }
+});
+const streaming = computed(() => props.part.state === "streaming");
+</script>
+
+<template>
+  <Collapsible
+    data-slot="chat-reasoning"
+    class="text-xs text-zinc-400"
+  >
+    <CollapsibleTrigger class="group/reason flex items-center gap-1">
+      <Icon
+        :icon="streaming ? 'fluent:spinner-ios-20-regular' : 'fluent:brain-circuit-20-regular'"
+        class="size-3.5"
+        :class="streaming ? 'animate-spin' : ''"
+      />
+      <span>{{ streaming ? "\u601D\u8003\u4E2D\u2026" : "\u5DF2\u601D\u8003" }}</span>
+      <Icon
+        icon="fluent:chevron-down-20-regular"
+        class="size-3.5 transition-transform duration-180 group-data-[state=open]/reason:rotate-180"
+      />
+    </CollapsibleTrigger>
+    <CollapsibleContent class="mt-1 whitespace-pre-wrap border-l-2 border-zinc-100 pl-2">
+      {{ part.text }}
+    </CollapsibleContent>
+  </Collapsible>
+</template>

package/dist/runtime/components/ui/chat/ChatReasoning.vue.d.ts

@@ -0,0 +1,7 @@
+import type { ReasoningUIPart } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    part: ReasoningUIPart;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatToolCall.d.vue.ts

@@ -0,0 +1,10 @@
+import type { ToolUIPart } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    part: ToolUIPart;
+    defaultOpen?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    defaultOpen: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/ChatToolCall.vue

@@ -0,0 +1,92 @@
+<script setup>
+import { computed } from "vue";
+import { Icon } from "@iconify/vue";
+import { toolNameOf } from "../../../utils/ai/parts";
+import { Badge } from "../badge";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../collapsible";
+defineOptions({ name: "UiChatToolCall" });
+const props = defineProps({
+  part: { type: Object, required: true },
+  defaultOpen: { type: Boolean, required: false, default: false }
+});
+const name = computed(() => toolNameOf(props.part));
+const badge = computed(() => {
+  switch (props.part.state) {
+    case "output-available":
+      return { label: "\u5B8C\u6210", variant: "secondary", spin: false };
+    case "output-error":
+      return { label: "\u5931\u8D25", variant: "destructive", spin: false };
+    default:
+      return { label: "\u8FD0\u884C\u4E2D", variant: "outline", spin: true };
+  }
+});
+function pretty(v) {
+  if (v === void 0) return "";
+  if (typeof v === "string") return v;
+  try {
+    return JSON.stringify(v, null, 2);
+  } catch {
+    return String(v);
+  }
+}
+const inputText = computed(() => pretty(props.part.input));
+const isError = computed(() => props.part.state === "output-error");
+const bodyText = computed(
+  () => isError.value ? props.part.errorText ?? "" : pretty(props.part.output)
+);
+</script>
+
+<template>
+  <Collapsible
+    :default-open="defaultOpen"
+    data-slot="chat-tool-call"
+    class="w-full overflow-hidden rounded-lg border border-zinc-200 bg-white"
+  >
+    <CollapsibleTrigger
+      class="group/tool flex w-full items-center gap-2 px-3 py-2 text-left"
+    >
+      <Icon
+        icon="fluent:wrench-screwdriver-20-regular"
+        class="size-4 shrink-0 text-zinc-400"
+      />
+      <span class="font-mono text-xs text-zinc-600">{{ name }}</span>
+      <Badge
+        :variant="badge.variant"
+        class="ml-auto"
+        data-slot="chat-tool-call-badge"
+      >
+        <Icon
+          v-if="badge.spin"
+          icon="fluent:spinner-ios-20-regular"
+          class="animate-spin"
+        />
+        {{ badge.label }}
+      </Badge>
+      <Icon
+        icon="fluent:chevron-down-20-regular"
+        class="size-4 shrink-0 text-zinc-400 transition-transform duration-180 group-data-[state=open]/tool:rotate-180"
+      />
+    </CollapsibleTrigger>
+    <CollapsibleContent class="space-y-2 border-t border-zinc-100 px-3 py-2 text-xs">
+      <div v-if="inputText">
+        <p class="mb-1 text-zinc-400">
+          输入
+        </p>
+        <pre
+          class="whitespace-pre-wrap break-words rounded bg-zinc-50 p-2 text-zinc-600"
+          data-slot="chat-tool-call-input"
+        >{{ inputText }}</pre>
+      </div>
+      <div v-if="bodyText">
+        <p class="mb-1 text-zinc-400">
+          {{ isError ? "\u9519\u8BEF" : "\u7ED3\u679C" }}
+        </p>
+        <pre
+          class="whitespace-pre-wrap break-words rounded p-2"
+          :class="isError ? 'bg-red-50 text-red-600' : 'bg-zinc-50 text-zinc-600'"
+          data-slot="chat-tool-call-output"
+        >{{ bodyText }}</pre>
+      </div>
+    </CollapsibleContent>
+  </Collapsible>
+</template>

package/dist/runtime/components/ui/chat/ChatToolCall.vue.d.ts

@@ -0,0 +1,10 @@
+import type { ToolUIPart } from '../../../utils/ai/parts.js';
+type __VLS_Props = {
+    part: ToolUIPart;
+    defaultOpen?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    defaultOpen: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/chat/index.d.ts

@@ -0,0 +1,9 @@
+export type ChatStatus = 'ready' | 'streaming' | 'error';
+export { default as ChatMessages } from './ChatMessages.vue.js';
+export { default as ChatMessage } from './ChatMessage.vue.js';
+export { default as ChatMessagePart } from './ChatMessagePart.vue.js';
+export { default as ChatToolCall } from './ChatToolCall.vue.js';
+export { default as ChatReasoning } from './ChatReasoning.vue.js';
+export { default as ChatPrompt } from './ChatPrompt.vue.js';
+export { default as ChatPromptSubmit } from './ChatPromptSubmit.vue.js';
+export { StreamMarkdown as ChatMarkdown } from '../stream-markdown/index.js';

package/dist/runtime/components/ui/chat/index.js

@@ -0,0 +1,8 @@
+export { default as ChatMessages } from "./ChatMessages.vue";
+export { default as ChatMessage } from "./ChatMessage.vue";
+export { default as ChatMessagePart } from "./ChatMessagePart.vue";
+export { default as ChatToolCall } from "./ChatToolCall.vue";
+export { default as ChatReasoning } from "./ChatReasoning.vue";
+export { default as ChatPrompt } from "./ChatPrompt.vue";
+export { default as ChatPromptSubmit } from "./ChatPromptSubmit.vue";
+export { StreamMarkdown as ChatMarkdown } from "../stream-markdown/index.js";