@shwfed/config 1.0.0 → 1.0.1

package/dist/runtime/components/form/fields/2026-04-27/com.shwfed.form.field.datetimerange/schema.js

@@ -4,6 +4,16 @@ import { Locale } from "../../../../../share/locale.js";
 import { commonFieldFields, FieldOrientationSchema } from "../../../utils/common.js";
 export const type = "com.shwfed.form.field.datetimerange";
 export const compatibilityDate = "2026-04-27";
+const BindingPath = Schema.String.pipe(Schema.minLength(1));
+const SplitBinding = Schema.Tuple(BindingPath, BindingPath).pipe(
+  Schema.filter(([a, b]) => a !== b, {
+    message: () => "\u8D77\u59CB\u4E0E\u7ED3\u675F\u7ED1\u5B9A\u8DEF\u5F84\u4E0D\u80FD\u76F8\u540C"
+  })
+);
+const bindingSchema = Schema.Union(BindingPath, SplitBinding).annotations({
+  title: "\u7ED1\u5B9A\u8DEF\u5F84",
+  description: "\u5199\u5165\u8868\u5355\u72B6\u6001\u7684 `dot-prop` \u8DEF\u5F84\uFF1B\u586B\u5199\u5355\u4E2A\u8DEF\u5F84\u65F6\u5199\u5165 `[start, end]` \u5B57\u7B26\u4E32\u6570\u7EC4\uFF0C\u4F8B\u5982 `event.range`\uFF1B\u586B\u5199 `[\u8D77\u59CB\u8DEF\u5F84, \u7ED3\u675F\u8DEF\u5F84]` \u5143\u7EC4\u65F6\u5206\u522B\u5199\u5165\u4E24\u7AEF\uFF1B\u7559\u7A7A\u5219\u4E3A\u975E\u53D7\u63A7\u5B57\u6BB5"
+});
 export const metadata = {
   name: "\u65E5\u671F\u65F6\u95F4\u8303\u56F4",
   icon: "fluent:calendar-clock-20-regular",
@@ -64,10 +74,7 @@ export function schema(configure) {
       description: "\u9F20\u6807\u60AC\u505C\u5728\u6807\u7B7E\u4E0A\u65F6\u5C55\u793A\u7684\u8BF4\u660E"
     })),
     orientation: Schema.optional(FieldOrientationSchema),
-    binding: Schema.optional(Schema.String.pipe(Schema.minLength(1)).annotations({
-      title: "\u7ED1\u5B9A\u8DEF\u5F84",
-      description: "\u5199\u5165\u8868\u5355\u72B6\u6001\u7684 `dot-prop` \u8DEF\u5F84\uFF0C\u4F8B\u5982 `event.range`\uFF1B\u5199\u5165\u503C\u4E3A `[start, end]` \u5B57\u7B26\u4E32\u6570\u7EC4\uFF1B\u7559\u7A7A\u5219\u4E3A\u975E\u53D7\u63A7\u5B57\u6BB5"
-    })),
+    binding: Schema.optional(bindingSchema),
     disabled: Schema.optional(CelBool.annotations({
       title: "\u7981\u7528\u6761\u4EF6",
       description: "\u8FD4\u56DE `true` \u65F6\u8F93\u5165\u6846\u4ECD\u7136\u6E32\u67D3\u4F46\u4E0D\u53EF\u7F16\u8F91"

package/dist/runtime/components/form/fields/2026-04-27/com.shwfed.form.field.timerange/config.d.vue.ts

@@ -30,7 +30,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
         readonly valueFormat?: string | undefined;
         readonly timeGranularity?: "second" | "minute" | "hour" | undefined;
         readonly rangeSeparatorIcon?: string | undefined;
-        readonly binding?: string | undefined;
+        readonly binding?: string | readonly [string, string] | undefined;
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: {
@@ -60,7 +60,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
         readonly valueFormat?: string | undefined;
         readonly timeGranularity?: "second" | "minute" | "hour" | undefined;
         readonly rangeSeparatorIcon?: string | undefined;
-        readonly binding?: string | undefined;
+        readonly binding?: string | readonly [string, string] | undefined;
     }) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/form/fields/2026-04-27/com.shwfed.form.field.timerange/config.vue

@@ -1,10 +1,11 @@
 <script setup>
+import { Icon } from "@iconify/vue";
 import { computed } from "vue";
 import { format as formatDate } from "date-fns";
 import { ExpressionEditor } from "../../../../ui/expression-editor";
 import { Field, FieldLabel } from "../../../../ui/field";
 import { IconPicker } from "../../../../ui/icon-picker";
-import { InputGroup, InputGroupAddon, InputGroupInput, InputGroupText } from "../../../../ui/input-group";
+import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText } from "../../../../ui/input-group";
 import { Locale as LocaleField } from "../../../../ui/locale";
 import { Markdown } from "../../../../ui/markdown";
 import {
@@ -23,8 +24,11 @@ const fieldSchema = schema(() => {
 });
 const fieldTitle = (f) => getStructFieldTitle(fieldSchema, f) ?? f;
 const fieldDescription = (f) => getStructFieldDescription(fieldSchema, f);
-const pathText = computed({
-  get: () => value.value.binding ?? "",
+const bindingMode = computed(
+  () => Array.isArray(value.value.binding) ? "split" : "single"
+);
+const singlePathText = computed({
+  get: () => typeof value.value.binding === "string" ? value.value.binding : "",
   set: (next) => {
     const trimmed = next.trim();
     if (trimmed.length === 0) {
@@ -35,6 +39,28 @@ const pathText = computed({
     }
   }
 });
+const splitStartText = computed(
+  () => Array.isArray(value.value.binding) ? value.value.binding[0] : ""
+);
+const splitEndText = computed(
+  () => Array.isArray(value.value.binding) ? value.value.binding[1] : ""
+);
+function setSplitStart(next) {
+  const cur = Array.isArray(value.value.binding) ? value.value.binding : ["", ""];
+  value.value = { ...value.value, binding: [next.trim(), cur[1]] };
+}
+function setSplitEnd(next) {
+  const cur = Array.isArray(value.value.binding) ? value.value.binding : ["", ""];
+  value.value = { ...value.value, binding: [cur[0], next.trim()] };
+}
+function toggleBindingMode() {
+  if (bindingMode.value === "single") {
+    value.value = { ...value.value, binding: ["", ""] };
+  } else {
+    const { binding: _omit, ...rest } = value.value;
+    value.value = rest;
+  }
+}
 const valueFormatText = computed({
   get: () => value.value.valueFormat ?? "",
   set: (next) => {
@@ -122,20 +148,70 @@ const valueFormatExample = computed(() => {
         <FieldLabel class="text-xs text-zinc-500">
           <template #tooltip>
             <Markdown
-              source="写入表单状态的嵌套键路径，使用 `.` 分隔；写入值为 `[start, end]` 字符串数组"
+              source="写入表单状态的嵌套键路径，使用 `.` 分隔。单路径模式写入 `[start, end]` 字符串数组；拆分模式分别写入起始与结束两端"
               block
               class="prose prose-sm prose-zinc"
             />
           </template>
           {{ fieldTitle("binding") }}
         </FieldLabel>
-        <InputGroup>
-          <InputGroupInput
-            v-model="pathText"
-            placeholder="例：meeting.timeRange"
-            class="font-mono"
-          />
-        </InputGroup>
+        <template v-if="bindingMode === 'single'">
+          <InputGroup>
+            <InputGroupInput
+              v-model="singlePathText"
+              placeholder="例：meeting.timeRange"
+              class="font-mono"
+            />
+            <InputGroupAddon align="inline-end">
+              <InputGroupButton
+                size="icon-xs"
+                aria-label="拆分起止绑定路径"
+                @click="toggleBindingMode"
+              >
+                <Icon icon="fluent:split-horizontal-20-regular" />
+              </InputGroupButton>
+            </InputGroupAddon>
+          </InputGroup>
+        </template>
+        <template v-else>
+          <div class="grid grid-cols-2 gap-2">
+            <InputGroup>
+              <InputGroupAddon align="inline-start">
+                <InputGroupText class="text-xs text-zinc-400">
+                  起
+                </InputGroupText>
+              </InputGroupAddon>
+              <InputGroupInput
+                :model-value="splitStartText"
+                placeholder="例：meeting.startTime"
+                class="font-mono"
+                @update:model-value="(v) => setSplitStart(String(v ?? ''))"
+              />
+            </InputGroup>
+            <InputGroup>
+              <InputGroupAddon align="inline-start">
+                <InputGroupText class="text-xs text-zinc-400">
+                  止
+                </InputGroupText>
+              </InputGroupAddon>
+              <InputGroupInput
+                :model-value="splitEndText"
+                placeholder="例：meeting.endTime"
+                class="font-mono"
+                @update:model-value="(v) => setSplitEnd(String(v ?? ''))"
+              />
+              <InputGroupAddon align="inline-end">
+                <InputGroupButton
+                  size="icon-xs"
+                  aria-label="合并起止绑定路径"
+                  @click="toggleBindingMode"
+                >
+                  <Icon icon="fluent:merge-vertical-20-regular" />
+                </InputGroupButton>
+              </InputGroupAddon>
+            </InputGroup>
+          </div>
+        </template>
       </Field>
     </div>
 

package/dist/runtime/components/form/fields/2026-04-27/com.shwfed.form.field.timerange/config.vue.d.ts

@@ -30,7 +30,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
         readonly valueFormat?: string | undefined;
         readonly timeGranularity?: "second" | "minute" | "hour" | undefined;
         readonly rangeSeparatorIcon?: string | undefined;
-        readonly binding?: string | undefined;
+        readonly binding?: string | readonly [string, string] | undefined;
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: {
@@ -60,7 +60,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
         readonly valueFormat?: string | undefined;
         readonly timeGranularity?: "second" | "minute" | "hour" | undefined;
         readonly rangeSeparatorIcon?: string | undefined;
-        readonly binding?: string | undefined;
+        readonly binding?: string | readonly [string, string] | undefined;
     }) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/dist/runtime/components/form/fields/2026-04-27/com.shwfed.form.field.timerange/runtime.vue

@@ -41,20 +41,32 @@ function asRange(raw) {
   if (a.length === 0 || b.length === 0) return void 0;
   return [a, b];
 }
+function asString(raw) {
+  return typeof raw === "string" && raw.length > 0 ? raw : void 0;
+}
 const uncontrolled = ref(void 0);
 const model = computed({
   get: () => {
-    const path = props.config.binding;
-    if (path == null) return uncontrolled.value;
-    return asRange(getAt(path));
+    const binding = props.config.binding;
+    if (binding == null) return uncontrolled.value;
+    if (typeof binding === "string") return asRange(getAt(binding));
+    const a = asString(getAt(binding[0]));
+    const b = asString(getAt(binding[1]));
+    if (a == null || b == null) return void 0;
+    return [a, b];
   },
   set: (next) => {
-    const path = props.config.binding;
-    if (path == null) {
+    const binding = props.config.binding;
+    if (binding == null) {
       uncontrolled.value = next;
       return;
     }
-    setAt(path, next);
+    if (typeof binding === "string") {
+      setAt(binding, next);
+      return;
+    }
+    setAt(binding[0], next?.[0]);
+    setAt(binding[1], next?.[1]);
   }
 });
 const readonlyText = computed(() => {

package/dist/runtime/components/form/fields/2026-04-27/com.shwfed.form.field.timerange/schema.d.ts

@@ -42,7 +42,7 @@ export declare function schema(configure: (env: Environment) => void): Schema.St
         message: Schema.SchemaClass<string, string, never>;
     }>]>>;
     orientation: Schema.optional<Schema.Literal<["vertical", "floating"]>>;
-    binding: Schema.optional<Schema.refine<string, typeof Schema.String>>;
+    binding: Schema.optional<Schema.Union<[Schema.filter<typeof Schema.String>, Schema.filter<Schema.Tuple2<Schema.filter<typeof Schema.String>, Schema.filter<typeof Schema.String>>>]>>;
     disabled: Schema.optional<Schema.Schema<string, string, never>>;
     readonly: Schema.optional<Schema.Schema<string, string, never>>;
     valueFormat: Schema.optional<Schema.refine<string, typeof Schema.String>>;

package/dist/runtime/components/form/fields/2026-04-27/com.shwfed.form.field.timerange/schema.js

@@ -4,6 +4,16 @@ import { Locale } from "../../../../../share/locale.js";
 import { commonFieldFields, FieldOrientationSchema } from "../../../utils/common.js";
 export const type = "com.shwfed.form.field.timerange";
 export const compatibilityDate = "2026-04-27";
+const BindingPath = Schema.String.pipe(Schema.minLength(1));
+const SplitBinding = Schema.Tuple(BindingPath, BindingPath).pipe(
+  Schema.filter(([a, b]) => a !== b, {
+    message: () => "\u8D77\u59CB\u4E0E\u7ED3\u675F\u7ED1\u5B9A\u8DEF\u5F84\u4E0D\u80FD\u76F8\u540C"
+  })
+);
+const bindingSchema = Schema.Union(BindingPath, SplitBinding).annotations({
+  title: "\u7ED1\u5B9A\u8DEF\u5F84",
+  description: "\u5199\u5165\u8868\u5355\u72B6\u6001\u7684 `dot-prop` \u8DEF\u5F84\uFF1B\u586B\u5199\u5355\u4E2A\u8DEF\u5F84\u65F6\u5199\u5165 `[start, end]` \u5B57\u7B26\u4E32\u6570\u7EC4\uFF0C\u4F8B\u5982 `meeting.timeRange`\uFF1B\u586B\u5199 `[\u8D77\u59CB\u8DEF\u5F84, \u7ED3\u675F\u8DEF\u5F84]` \u5143\u7EC4\u65F6\u5206\u522B\u5199\u5165\u4E24\u7AEF\uFF1B\u7559\u7A7A\u5219\u4E3A\u975E\u53D7\u63A7\u5B57\u6BB5"
+});
 export const metadata = {
   name: "\u65F6\u95F4\u8303\u56F4",
   icon: "fluent:clock-arrow-download-20-regular",
@@ -35,10 +45,7 @@ export function schema(configure) {
       description: "\u9F20\u6807\u60AC\u505C\u5728\u6807\u7B7E\u4E0A\u65F6\u5C55\u793A\u7684\u8BF4\u660E"
     })),
     orientation: Schema.optional(FieldOrientationSchema),
-    binding: Schema.optional(Schema.String.pipe(Schema.minLength(1)).annotations({
-      title: "\u7ED1\u5B9A\u8DEF\u5F84",
-      description: "\u5199\u5165\u8868\u5355\u72B6\u6001\u7684 `dot-prop` \u8DEF\u5F84\uFF0C\u4F8B\u5982 `meeting.timeRange`\uFF1B\u5199\u5165\u503C\u4E3A `[start, end]` \u5B57\u7B26\u4E32\u6570\u7EC4\uFF1B\u7559\u7A7A\u5219\u4E3A\u975E\u53D7\u63A7\u5B57\u6BB5"
-    })),
+    binding: Schema.optional(bindingSchema),
     disabled: Schema.optional(CelBool.annotations({
       title: "\u7981\u7528\u6761\u4EF6",
       description: "\u8FD4\u56DE `true` \u65F6\u8F93\u5165\u6846\u4ECD\u7136\u6E32\u67D3\u4F46\u4E0D\u53EF\u7F16\u8F91"

package/dist/runtime/components/form/fields/2026-05-12/com.shwfed.form.field.upload/config.vue

@@ -77,7 +77,10 @@ const MIME_GROUPS = [
   { id: "doc", label: "DOC", mimes: ["application/msword"] },
   { id: "xlsx", label: "XLSX", mimes: ["application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"] },
   { id: "xls", label: "XLS", mimes: ["application/vnd.ms-excel"] },
+  { id: "pptx", label: "PPTX", mimes: ["application/vnd.openxmlformats-officedocument.presentationml.presentation"] },
+  { id: "ppt", label: "PPT", mimes: ["application/vnd.ms-powerpoint"] },
   { id: "zip", label: "ZIP", mimes: ["application/zip", "application/x-zip-compressed"] },
+  { id: "rar", label: "RAR", mimes: ["application/vnd.rar", "application/x-rar-compressed"] },
   { id: "ofd", label: "OFD", mimes: ["application/ofd"] },
   { id: "xml", label: "XML", mimes: ["application/xml"] },
   { id: "png", label: "PNG", mimes: ["image/png"] },

package/dist/runtime/components/form/fields/2026-05-12/com.shwfed.form.field.upload/runtime.vue

@@ -15,8 +15,12 @@ import { useFormState } from "../../../utils/state";
 const ICONS = {
   "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "vscode-icons:file-type-excel",
   "application/vnd.ms-excel": "vscode-icons:file-type-excel",
+  "application/vnd.openxmlformats-officedocument.presentationml.presentation": "vscode-icons:file-type-powerpoint",
+  "application/vnd.ms-powerpoint": "vscode-icons:file-type-powerpoint",
   "application/zip": "vscode-icons:file-type-zip",
   "application/x-zip-compressed": "vscode-icons:file-type-zip",
+  "application/vnd.rar": "vscode-icons:file-type-zip",
+  "application/x-rar-compressed": "vscode-icons:file-type-zip",
   "application/pdf": "vscode-icons:file-type-pdf2",
   "application/ofd": "vscode-icons:file-type-ofd",
   "application/xml": "vscode-icons:file-type-xml",
@@ -29,8 +33,12 @@ const ICONS = {
 const SHORT_NAMES = {
   "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "XLSX",
   "application/vnd.ms-excel": "XLS",
+  "application/vnd.openxmlformats-officedocument.presentationml.presentation": "PPTX",
+  "application/vnd.ms-powerpoint": "PPT",
   "application/zip": "ZIP",
   "application/x-zip-compressed": "ZIP",
+  "application/vnd.rar": "RAR",
+  "application/x-rar-compressed": "RAR",
   "application/pdf": "PDF",
   "application/ofd": "OFD",
   "application/xml": "XML",

package/dist/runtime/components/form/index.vue

@@ -20,8 +20,6 @@ const configure = props.configure ?? (() => {
 });
 void configure;
 const { $cel: _rawCel } = useNuxtApp();
-const inherited = injectCELContext();
-const $cel = (expression, context) => _rawCel(expression, { ...celBindings(inherited), ...context });
 provideCELContext({
   form: {
     type: "dyn",
@@ -40,6 +38,8 @@ provideCELContext({
     value: () => new TZDate()
   }
 });
+const inherited = injectCELContext();
+const $cel = (expression, context) => _rawCel(expression, { ...celBindings(inherited), ...context });
 provideFormState(state);
 const seeded = (() => {
   const current = state.value ?? {};

package/dist/runtime/components/table/ai/columns-button.vue

@@ -157,13 +157,8 @@ const description = [
   "",
   "AI \u4F1A**\u6574\u5217\u66FF\u6362**\u5F53\u524D\u7684\u5217\u914D\u7F6E \u2014 \u672A\u5728\u63CF\u8FF0\u4E2D\u63D0\u5230\u7684\u5217\u4F1A\u88AB\u79FB\u9664\uFF0C\u8BF7\u628A\u6240\u6709\u9700\u8981\u4FDD\u7559\u7684\u5217\u4E5F\u4E00\u5E76\u63CF\u8FF0\u51FA\u6765\u3002"
 ].join("\n");
-const visible = computed(() => $ai.available.value);
 const canSubmit = computed(() => !submitting.value && context.value.trim().length > 0);
 function onTrigger() {
-  if (!$ai.available.value) {
-    $ai.openSettings();
-    return;
-  }
   open.value = true;
 }
 const CEL_FIELDS_BY_TYPE = {
@@ -391,107 +386,105 @@ ${renderRegisterables()}`;
 </script>
 
 <template>
-  <template v-if="visible">
-    <Tooltip :delay-duration="180">
-      <TooltipTrigger as-child>
-        <InputGroupButton
-          size="icon-xs"
-          variant="ghost"
-          as-child
+  <Tooltip :delay-duration="180">
+    <TooltipTrigger as-child>
+      <InputGroupButton
+        size="icon-xs"
+        variant="ghost"
+        as-child
+      >
+        <button
+          type="button"
+          :disabled="submitting"
+          class="-ml-4"
+          @click="onTrigger"
         >
-          <button
-            type="button"
-            :disabled="submitting"
-            class="-ml-4"
-            @click="onTrigger"
-          >
-            <Icon
-              icon="fluent:magic-wand-20-regular"
-              class="size-4"
-            />
-          </button>
-        </InputGroupButton>
-      </TooltipTrigger>
-      <TooltipContent side="top">
-        AI 生成列
-      </TooltipContent>
-    </Tooltip>
-
-    <ShwfedModal
-      v-model:open="open"
-      content-width="48rem"
-      :dismissible="!submitting"
-    >
-      <template #title>
-        <span class="flex items-center gap-2">
           <Icon
             icon="fluent:magic-wand-20-regular"
-            class="size-5"
+            class="size-4"
           />
-          AI 生成列
-        </span>
-      </template>
-      <template #description>
-        <Markdown
-          :source="description"
-          block
-          class="prose prose-sm prose-zinc max-w-none"
-        />
-      </template>
+        </button>
+      </InputGroupButton>
+    </TooltipTrigger>
+    <TooltipContent side="top">
+      AI 生成列
+    </TooltipContent>
+  </Tooltip>
 
-      <form
-        class="flex flex-col gap-2 py-2"
-        @submit.prevent="onSubmit"
-      >
-        <Textarea
-          v-model="context"
-          placeholder="任意上下文，建议包含：&#10;- 想要的列：例如「显示姓名、邮箱、注册时间」&#10;- 字段含义或示例响应（JSON）&#10;- 列宽 / 对齐 / 复制等额外要求"
-          wrap="soft"
-          class="field-sizing-fixed h-72 max-h-[60vh] resize-none overflow-auto break-all whitespace-pre-wrap font-mono text-xs"
-          :disabled="submitting"
+  <ShwfedModal
+    v-model:open="open"
+    content-width="48rem"
+    :dismissible="!submitting"
+  >
+    <template #title>
+      <span class="flex items-center gap-2">
+        <Icon
+          icon="fluent:magic-wand-20-regular"
+          class="size-5"
         />
-      </form>
+        AI 生成列
+      </span>
+    </template>
+    <template #description>
+      <Markdown
+        :source="description"
+        block
+        class="prose prose-sm prose-zinc max-w-none"
+      />
+    </template>
 
-      <template #footer>
-        <div class="flex items-center gap-2">
-          <div
-            v-if="submitting"
-            class="mr-auto flex items-center gap-2 text-xs text-muted-foreground"
-            aria-live="polite"
-          >
-            <span
-              :key="tick"
-              class="ai-progress-dot"
-              :class="tick > 0 ? 'is-streaming' : 'is-waiting'"
-            />
-            <span>{{ tick > 0 ? "\u6B63\u5728\u63A5\u6536\u6A21\u578B\u8F93\u51FA\u2026" : "\u6B63\u5728\u8BF7\u6C42\u6A21\u578B\u2026" }}</span>
-          </div>
-          <Button
-            type="button"
-            size="sm"
-            :disabled="submitting"
-            @click="open = false"
-          >
-            <Icon icon="fluent:dismiss-20-regular" />
-            取消
-          </Button>
-          <Button
-            type="button"
-            variant="primary"
-            size="sm"
-            :disabled="!canSubmit"
-            @click="onSubmit"
-          >
-            <Icon
-              :icon="submitting ? 'fluent:arrow-sync-20-regular' : 'fluent:sparkle-20-regular'"
-              :class="submitting ? 'animate-spin' : ''"
-            />
-            生成
-          </Button>
+    <form
+      class="flex flex-col gap-2 py-2"
+      @submit.prevent="onSubmit"
+    >
+      <Textarea
+        v-model="context"
+        placeholder="任意上下文，建议包含：&#10;- 想要的列：例如「显示姓名、邮箱、注册时间」&#10;- 字段含义或示例响应（JSON）&#10;- 列宽 / 对齐 / 复制等额外要求"
+        wrap="soft"
+        class="field-sizing-fixed h-72 max-h-[60vh] resize-none overflow-auto break-all whitespace-pre-wrap font-mono text-xs"
+        :disabled="submitting"
+      />
+    </form>
+
+    <template #footer>
+      <div class="flex items-center gap-2">
+        <div
+          v-if="submitting"
+          class="mr-auto flex items-center gap-2 text-xs text-muted-foreground"
+          aria-live="polite"
+        >
+          <span
+            :key="tick"
+            class="ai-progress-dot"
+            :class="tick > 0 ? 'is-streaming' : 'is-waiting'"
+          />
+          <span>{{ tick > 0 ? "\u6B63\u5728\u63A5\u6536\u6A21\u578B\u8F93\u51FA\u2026" : "\u6B63\u5728\u8BF7\u6C42\u6A21\u578B\u2026" }}</span>
         </div>
-      </template>
-    </ShwfedModal>
-  </template>
+        <Button
+          type="button"
+          size="sm"
+          :disabled="submitting"
+          @click="open = false"
+        >
+          <Icon icon="fluent:dismiss-20-regular" />
+          取消
+        </Button>
+        <Button
+          type="button"
+          variant="primary"
+          size="sm"
+          :disabled="!canSubmit"
+          @click="onSubmit"
+        >
+          <Icon
+            :icon="submitting ? 'fluent:arrow-sync-20-regular' : 'fluent:sparkle-20-regular'"
+            :class="submitting ? 'animate-spin' : ''"
+          />
+          生成
+        </Button>
+      </div>
+    </template>
+  </ShwfedModal>
 </template>
 
 <style scoped>