feat(create): 首页消息渲染与历史抽屉细节批 - 会话头对称/操作组悬停/输入条紧凑/气泡微调/行距, 历史行模式图标/三点菜单图标+文字/导出 Markdown/新建卡作用域修复

web/src/components/assets/asset-library-picker-modal.tsx

@@ -128,7 +128,7 @@ export function AssetLibraryPickerModal({
     });
     const remoteItems = useMemo<AssetLibraryPickerItem[]>(() => (remoteQuery.data?.assets || []).filter((asset) => asset.kind !== "entity" && asset.kind !== "model").map((asset) => ({
         id: asset.id, title: asset.title, category: asset.category || "other", archived: asset.status === "archived", asset,
-        kindLabel: asset.kind === "image" ? "图片" : asset.kind === "video" ? "视频" : asset.kind === "audio" ? "音频" : "文本", searchText: asset.tags.join(" "),
+        kindLabel: asset.kind === "image" ? "图片" : asset.kind === "video" ? "视频" : asset.kind === "audio" ? "音频" : "文本", searchText: (asset.tags ?? []).join(" "),
         ...(items.find((item) => item.id === asset.id) || { disabledReason: "此素材不适用于当前操作" }),
     })), [remoteQuery.data, items]);
     const effectivePagination = remoteEnabled ? { current: remotePage, pageSize: remotePageSize, total: remoteQuery.data?.total || 0, onChange: (page: number, pageSize: number) => { setRemotePage(page); setRemotePageSize(pageSize); } } : pagination;
@@ -355,6 +355,7 @@ export function AssetLibraryPickerModal({
 
     return (
         <Modal
+            centered
             open={open}
             footer={null}
             title={null}

web/src/components/ui/product/settings-row/index.ts

@@ -0,0 +1 @@
+export { SettingsRow, type SettingsRowProps } from "./settings-row";

web/src/components/ui/product/settings-row/settings-row.tsx

@@ -0,0 +1,31 @@
+import type { ReactNode } from "react";
+
+import { cn } from "@/lib/utils";
+
+export interface SettingsRowProps {
+    label: string;
+    description?: string;
+    control?: ReactNode;
+    align?: "center" | "top";
+    className?: string;
+    controlClassName?: string;
+}
+
+/**
+ * SettingsRow —— 设置项行（左侧标签/说明 + 右侧控件）。
+ *
+ * 用途：设置页与偏好面板内"一行一个设置项"的排版，替代 Form.Item 的纵向大块布局。
+ *   行间以细分隔线区分，信息密度高、便于扫读；最后一行自动去掉分隔线。
+ * token：分隔线 border-foreground/10，标签 text-foreground，说明 text-foreground/55。
+ */
+export function SettingsRow({ label, description, control, align = "center", className, controlClassName }: SettingsRowProps) {
+    return (
+        <div className={cn("flex w-full items-center gap-4 border-b border-foreground/10 py-2.5 last:border-b-0", align === "top" && "items-start", className)}>
+            <div className="min-w-0 flex-1">
+                <span className="block text-sm font-medium text-foreground">{label}</span>
+                {description ? <span className="mt-0.5 block text-xs leading-4 text-foreground/55">{description}</span> : null}
+            </div>
+            {control ? <div className={cn("shrink-0", controlClassName)}>{control}</div> : null}
+        </div>
+    );
+}