@arronqzy/react-blueprint 1.0.3 → 1.0.5

package/index.ts

@@ -7,7 +7,8 @@ export type {
   BlueprintLibraryOption,
 } from "./src/BlueprintNodeConfigSidebar";
 export * from "./src/graph";
-export { resolveBlueprintConfigSource, resolveBlueprintNodeTypeLabel } from "./src/graph/document";
+export { patchNodeConfigSource } from "./src/graph/document";
+export { resolveBlueprintConfigSource, resolveBlueprintNodeTypeLabel, getBlueprintNodeTypeLabel, getLifecyclePhaseLabel, BLUEPRINT_CONFIG_TYPE_LABEL_KEYS, BLUEPRINT_LIFECYCLE_PHASE_KEYS } from "./src/graph/document";
 export type { BlueprintConfigSource } from "./src/graph/document";
 export { documentToRunnableGraph } from "./src/runtime/document-to-runnable-graph";
 export { BlueprintExecutionLogPanel } from "./src/components/BlueprintExecutionLogPanel";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arronqzy/react-blueprint",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "",
   "main": "index.ts",
   "exports": {
@@ -12,9 +12,10 @@
     "dayjs": "^1.11.13",
     "react-dom": "^19",
     "@xyflow/react": "^12.9.3",
-    "@arronqzy/blueprint-dsl": "1.0.3",
-    "@arronqzy/react-rx-store": "1.1.2",
-    "@arronqzy/ui": "1.0.2"
+    "@arronqzy/blueprint-dsl": "1.0.4",
+    "@arronqzy/i18n": "0.1.2",
+    "@arronqzy/react-rx-store": "1.1.3",
+    "@arronqzy/ui": "1.0.4"
   },
   "devDependencies": {
     "@types/react": "^19.0.1",
@@ -27,9 +28,9 @@
     "eslint": "^8.57.0",
     "typescript": "^5.5.4",
     "vite": "^5.1.4",
-    "@arronqzy/tailwind": "1.0.2",
+    "@arronqzy/typescript-config": "1.0.0",
     "@arronqzy/eslint-config": "0.0.0",
-    "@arronqzy/typescript-config": "1.0.0"
+    "@arronqzy/tailwind": "1.0.2"
   },
   "keywords": [],
   "author": "",

package/src/BlueprintContextMenu.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useRef } from "react";
+import { useI18n } from "@arronqzy/i18n/react";
 
 export type BlueprintContextMenuState =
   | {
@@ -35,6 +36,7 @@ export function BlueprintContextMenu({
   onDeleteNode,
   onDeleteEdge,
 }: BlueprintContextMenuProps) {
+  const { t } = useI18n();
   const menuRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
@@ -74,7 +76,7 @@ export function BlueprintContextMenu({
             onClose();
           }}
         >
-          新增节点
+          {t("blueprint.toolbar.addNode")}
         </button>
       ) : null}
 
@@ -87,7 +89,7 @@ export function BlueprintContextMenu({
             onClose();
           }}
         >
-          删除节点
+          {t("blueprint.toolbar.deleteNode")}
         </button>
       ) : null}
 
@@ -100,7 +102,7 @@ export function BlueprintContextMenu({
             onClose();
           }}
         >
-          删除连线
+          {t("blueprint.toolbar.deleteEdge")}
         </button>
       ) : null}
     </div>

package/src/BlueprintNodeConfigSidebar.tsx

@@ -9,10 +9,10 @@ import {
 } from "@arronqzy/ui";
 import {
   LIFECYCLE_NODE_TYPE,
-  PAGE_LIFECYCLE_LABELS,
   PAGE_LIFECYCLE_PHASES,
   type PageLifecyclePhase,
 } from "@arronqzy/blueprint-dsl";
+import { useI18n } from "@arronqzy/i18n/react";
 
 import { FetchNodeConfigPanel } from "./components/FetchNodeConfigPanel";
 import { ClockNodeConfigPanel } from "./components/ClockNodeConfigPanel";
@@ -20,12 +20,14 @@ import { JsonNodeConfigPanel } from "./components/JsonNodeConfigPanel";
 import { LogicNodeConfigPanel } from "./components/LogicNodeConfigPanel";
 import { ViewElementMultiSelect } from "./components/ViewElementMultiSelect";
 import {
+  getLifecyclePhaseLabel,
   patchNodeConfigSource,
   pruneViewElementIds,
   resolveBlueprintConfigSource,
   resolveViewElementIds,
   type BlueprintConfigSource,
   type BlueprintGraphNode,
+  type BlueprintNodeRole,
 } from "./graph/document";
 
 export type BlueprintViewElementOption = {
@@ -67,6 +69,16 @@ export type BlueprintNodeConfigSidebarProps = {
   ) => void;
 };
 
+const ROLE_LABEL_KEYS: Record<BlueprintNodeRole, string> = {
+  blueprint: "blueprint.config.roleBlueprint",
+  lifecycle: "blueprint.config.roleLifecycle",
+  and: "blueprint.config.roleAnd",
+  fetch: "blueprint.config.roleFetch",
+  json: "blueprint.config.roleJson",
+  logic: "blueprint.config.roleLogic",
+  clock: "blueprint.config.roleClock",
+};
+
 export function BlueprintNodeConfigSidebar({
   node,
   viewElementOptions = [],
@@ -75,6 +87,7 @@ export function BlueprintNodeConfigSidebar({
   onUpdateAllowFalseSignalPropagation,
   onUpdateNode,
 }: BlueprintNodeConfigSidebarProps) {
+  const { t } = useI18n();
   const configSource = resolveBlueprintConfigSource(node);
   const linkedViewElementIds = resolveViewElementIds(node);
   const existingViewElementIdSet = useMemo(
@@ -108,28 +121,19 @@ export function BlueprintNodeConfigSidebar({
     viewElementOptions.length,
   ]);
 
+  const roleLabel = t(ROLE_LABEL_KEYS[node.role] ?? "blueprint.config.roleLogic");
+
   return (
     <div className="flex h-full min-h-0 flex-col overflow-hidden bg-background text-foreground">
       <div className="shrink-0 border-b border-border px-3 py-2">
-        <div className="text-xs font-semibold">蓝图节点配置</div>
+        <div className="text-xs font-semibold">{t("blueprint.config.title")}</div>
         <div className="mt-0.5 text-[11px] text-muted-foreground">
-          {node.role === "blueprint"
-            ? "蓝图节点"
-            : node.role === "lifecycle"
-              ? "生命周期节点"
-              : node.role === "and"
-                ? "并运算节点"
-              : node.role === "fetch"
-                ? "数据源节点"
-                : node.role === "json"
-                  ? "JSON 节点"
-                  : "逻辑节点"}{" "}
-          · {node.id}
+          {roleLabel} · {node.id}
         </div>
       </div>
       <div className="min-h-0 flex-1 space-y-3 overflow-auto p-3 text-xs">
         <label className="block space-y-1">
-          <span className="text-muted-foreground">节点名称</span>
+          <span className="text-muted-foreground">{t("blueprint.config.nodeName")}</span>
           <Input
             value={node.label}
             onChange={(e: ChangeEvent<HTMLInputElement>) =>
@@ -140,7 +144,7 @@ export function BlueprintNodeConfigSidebar({
         </label>
 
         <label className="block space-y-1">
-          <span className="text-muted-foreground">配置类型</span>
+          <span className="text-muted-foreground">{t("blueprint.config.configType")}</span>
           <Select
             value={configSource}
             onValueChange={(value: string) => {
@@ -163,25 +167,25 @@ export function BlueprintNodeConfigSidebar({
               <SelectValue />
             </SelectTrigger>
             <SelectContent>
-              <SelectItem value="blueprint">蓝图配置</SelectItem>
-              <SelectItem value="logic">逻辑配置</SelectItem>
-              <SelectItem value="and">并运算</SelectItem>
-              <SelectItem value="lifecycle">生命周期配置</SelectItem>
-              <SelectItem value="fetch">数据源获取</SelectItem>
-              <SelectItem value="json">JSON 节点</SelectItem>
-              <SelectItem value="clock">时钟</SelectItem>
-              <SelectItem value="view">视图节点配置</SelectItem>
+              <SelectItem value="blueprint">{t("blueprint.config.configBlueprint")}</SelectItem>
+              <SelectItem value="logic">{t("blueprint.config.configLogic")}</SelectItem>
+              <SelectItem value="and">{t("blueprint.config.configAnd")}</SelectItem>
+              <SelectItem value="lifecycle">{t("blueprint.config.configLifecycle")}</SelectItem>
+              <SelectItem value="fetch">{t("blueprint.config.configFetch")}</SelectItem>
+              <SelectItem value="json">{t("blueprint.config.configJson")}</SelectItem>
+              <SelectItem value="clock">{t("blueprint.config.configClock")}</SelectItem>
+              <SelectItem value="view">{t("blueprint.config.configView")}</SelectItem>
             </SelectContent>
           </Select>
         </label>
 
         {configSource === "view" ? (
           <div className="block space-y-1">
-            <span className="text-muted-foreground">关联视图节点</span>
+            <span className="text-muted-foreground">{t("blueprint.config.linkedViewNodes")}</span>
             <ViewElementMultiSelect
               options={viewElementOptions}
               value={linkedViewElementIds}
-              placeholder="选择视图节点"
+              placeholder={t("blueprint.config.selectViewNode")}
               onChange={(next) =>
                 onUpdateNode(node.id, {
                   viewElementIds: next,
@@ -192,15 +196,16 @@ export function BlueprintNodeConfigSidebar({
             />
             {linkedViewElementIds.length === 0 ? (
               <p className="text-[11px] text-muted-foreground">
-                可多选视图画布节点；关联后仍在此配置蓝图节点，视图属性请在视图面板中编辑。
+                {t("blueprint.config.viewMultiHint")}
               </p>
             ) : (
               <p className="text-[11px] text-muted-foreground">
-                已关联 {linkedViewElementIds.length} 个视图节点：
-                {linkedViewElementIds
-                  .map((id) => viewElementLabelById.get(id) ?? id)
-                  .join("、")}
-                。
+                {t("blueprint.config.linkedViewCount", {
+                  count: linkedViewElementIds.length,
+                  names: linkedViewElementIds
+                    .map((id) => viewElementLabelById.get(id) ?? id)
+                    .join("、"),
+                })}
               </p>
             )}
           </div>
@@ -208,15 +213,12 @@ export function BlueprintNodeConfigSidebar({
 
         {configSource === "blueprint" ? (
           <div className="space-y-2 rounded-md border border-border/70 bg-muted/20 p-2.5">
-            <div className="font-medium text-foreground">蓝图属性</div>
+            <div className="font-medium text-foreground">{t("blueprint.config.blueprintAttrs")}</div>
             <p className="text-[11px] text-muted-foreground">
-              选中蓝图库中的蓝图后，当输入端收到<strong>真信号</strong>
-              时才会执行该蓝图；执行完成后从输出端发出
-              <strong>真信号</strong>（含嵌套蓝图输出值与当前节点信息），执行失败则发出
-              <strong>假信号</strong>。
+              {t("blueprint.config.blueprintAttrsHint")}
             </p>
             <label className="block space-y-1">
-              <span className="text-muted-foreground">引用蓝图库</span>
+              <span className="text-muted-foreground">{t("blueprint.config.refLibrary")}</span>
               <Select
                 value={node.libraryBlueprintId ?? "__none__"}
                 onValueChange={(value: string) => {
@@ -227,10 +229,10 @@ export function BlueprintNodeConfigSidebar({
                 }}
               >
                 <SelectTrigger className="h-8">
-                  <SelectValue placeholder="选择蓝图库中的蓝图" />
+                  <SelectValue placeholder={t("blueprint.config.selectLibraryBlueprint")} />
                 </SelectTrigger>
                 <SelectContent className="z-[10100]">
-                  <SelectItem value="__none__">未关联</SelectItem>
+                  <SelectItem value="__none__">{t("blueprint.config.unlinked")}</SelectItem>
                   {blueprintLibraryOptions.map((opt) => (
                     <SelectItem key={opt.id} value={opt.id}>
                       {opt.label}
@@ -241,7 +243,7 @@ export function BlueprintNodeConfigSidebar({
             </label>
             {!node.libraryBlueprintId ? (
               <p className="text-[11px] text-muted-foreground">
-                请先从蓝图库选择要引用的蓝图。
+                {t("blueprint.config.selectLibraryFirst")}
               </p>
             ) : null}
             <label className="flex items-start gap-2 pt-1">
@@ -254,7 +256,7 @@ export function BlueprintNodeConfigSidebar({
                 className="mt-0.5 h-3.5 w-3.5 shrink-0 rounded border border-input"
               />
               <span className="text-[11px] leading-relaxed text-muted-foreground">
-                允许假信号传递：开启后，节点输出假信号时不会阻塞任务链，错误信息会继续向下游传递。
+                {t("blueprint.config.allowFalsePropagateBlueprint")}
               </span>
             </label>
           </div>
@@ -262,15 +264,15 @@ export function BlueprintNodeConfigSidebar({
 
         {configSource === "lifecycle" ? (
           <div className="space-y-2 rounded-md border border-border/70 bg-muted/20 p-2.5">
-            <div className="font-medium text-foreground">生命周期钩子</div>
+            <div className="font-medium text-foreground">{t("blueprint.config.lifecycleHook")}</div>
             <p className="text-[11px] text-muted-foreground">
-              生命周期节点<strong>没有输入口</strong>，仅右侧输出口。
+              {t("blueprint.config.lifecycleNoInput")}
               {node.lifecyclePhase === "blueprintActivated"
-                ? "当本蓝图被其他蓝图的蓝图配置节点引用且收到真信号时，自动向下游发出真信号，输出值为父级传入的输入数据。"
-                : "当页面进入对应生命周期时，自动向下游发出真/假信号。"}
+                ? t("blueprint.config.lifecycleBlueprintActivatedHint")
+                : t("blueprint.config.lifecyclePageHint")}
             </p>
             <label className="block space-y-1">
-              <span className="text-muted-foreground">监听阶段</span>
+              <span className="text-muted-foreground">{t("blueprint.config.listenPhase")}</span>
               <Select
                 value={node.lifecyclePhase ?? "mounted"}
                 onValueChange={(value: string) =>
@@ -288,7 +290,7 @@ export function BlueprintNodeConfigSidebar({
                 <SelectContent>
                   {PAGE_LIFECYCLE_PHASES.map((phase) => (
                     <SelectItem key={phase} value={phase}>
-                      {PAGE_LIFECYCLE_LABELS[phase]}
+                      {getLifecyclePhaseLabel(t, phase)}
                     </SelectItem>
                   ))}
                 </SelectContent>
@@ -296,7 +298,7 @@ export function BlueprintNodeConfigSidebar({
             </label>
             {node.parentId ? (
               <p className="text-[11px] text-muted-foreground">
-                所属蓝图节点：{node.parentId}
+                {t("blueprint.config.parentBlueprintNode", { id: node.parentId })}
               </p>
             ) : null}
           </div>
@@ -316,12 +318,9 @@ export function BlueprintNodeConfigSidebar({
 
         {configSource === "and" ? (
           <div className="space-y-2 rounded-md border border-border/70 bg-muted/20 p-2.5">
-            <div className="font-medium text-foreground">并运算</div>
+            <div className="font-medium text-foreground">{t("blueprint.config.andTitle")}</div>
             <p className="text-[11px] text-muted-foreground">
-              左侧两个输入口 <strong>inA</strong>、<strong>inB</strong>。
-              每个输入口可连 n 条线，同端口任一为真则该端口视为真（或）。
-              仅当 <strong>inA 与 inB 均为真信号</strong> 时，从输出口发出真信号；
-              否则发出假信号。
+              {t("blueprint.config.andHint")}
             </p>
           </div>
         ) : null}
@@ -331,7 +330,7 @@ export function BlueprintNodeConfigSidebar({
             <LogicNodeConfigPanel node={node} onUpdateNode={onUpdateNode} />
             {node.parentId ? (
               <p className="text-[11px] text-muted-foreground">
-                所属蓝图节点：{node.parentId}
+                {t("blueprint.config.parentBlueprintNode", { id: node.parentId })}
               </p>
             ) : null}
           </>
@@ -339,7 +338,7 @@ export function BlueprintNodeConfigSidebar({
 
         {configSource !== "blueprint" && configSource !== "and" ? (
           <div className="space-y-2 rounded-md border border-border/70 bg-muted/20 p-2.5">
-            <div className="font-medium text-foreground">任务链执行</div>
+            <div className="font-medium text-foreground">{t("blueprint.config.taskChain")}</div>
             <label className="flex items-start gap-2">
               <input
                 type="checkbox"
@@ -350,7 +349,7 @@ export function BlueprintNodeConfigSidebar({
                 className="mt-0.5 h-3.5 w-3.5 shrink-0 rounded border border-input"
               />
               <span className="text-[11px] leading-relaxed text-muted-foreground">
-                允许假信号传递：默认假信号会阻塞任务链；开启后继续向下游传递假信号与错误信息。
+                {t("blueprint.config.allowFalsePropagateDefault")}
               </span>
             </label>
           </div>

package/src/components/BlueprintExecutionLogPanel.tsx

@@ -17,10 +17,11 @@ import {
   cn,
 } from "@arronqzy/ui";
 import {
-  PAGE_LIFECYCLE_LABELS,
-  type ExecutionTraceEntry,
+    type ExecutionTraceEntry,
   type PageLifecyclePhase,
 } from "@arronqzy/blueprint-dsl";
+import { useI18n } from "@arronqzy/i18n/react";
+import { getLifecyclePhaseLabel } from "../graph/document";
 
 import type { ExecutionLogSettings } from "../library/execution-log-settings";
 
@@ -151,6 +152,7 @@ export function BlueprintExecutionLogPanel({
   hasSavedRuns = false,
   lifecyclePhase,
 }: BlueprintExecutionLogPanelProps) {
+  const { t } = useI18n();
   const scrollRef = useRef<HTMLDivElement>(null);
   const bottomRef = useRef<HTMLDivElement>(null);
   const prevEntryCountRef = useRef(entries.length);
@@ -160,8 +162,8 @@ export function BlueprintExecutionLogPanel({
 
   const phaseLabel = useMemo(() => {
     if (!lifecyclePhase) return null;
-    return PAGE_LIFECYCLE_LABELS[lifecyclePhase as PageLifecyclePhase] ?? lifecyclePhase;
-  }, [lifecyclePhase]);
+    return getLifecyclePhaseLabel(t, lifecyclePhase as PageLifecyclePhase);
+  }, [lifecyclePhase, t]);
 
   const latestEntryPreview = useMemo(() => {
     const latest = entries[entries.length - 1];
@@ -211,9 +213,9 @@ export function BlueprintExecutionLogPanel({
         <div className="shrink-0 border-b border-border px-3 py-2">
           <div className="flex items-start justify-between gap-2">
             <div className="min-w-0">
-              <div className="text-xs font-semibold">蓝图任务输出日志</div>
+              <div className="text-xs font-semibold">{t("blueprint.log.title")}</div>
               <div className="mt-0.5 text-[11px] text-muted-foreground">
-                {phaseLabel ? `模拟场景：${phaseLabel}` : "选择生命周期节点并开始调试"}
+                {phaseLabel ? t("blueprint.log.simulateSceneWithPhase", { phaseLabel }) : t("blueprint.log.selectLifecycleToDebug")}
               </div>
             </div>
             <div className="flex shrink-0 items-center gap-1">
@@ -223,8 +225,8 @@ export function BlueprintExecutionLogPanel({
                   variant="outline"
                   size="icon"
                   className="h-7 w-7 shrink-0"
-                  content="立即清空 IndexedDB 中所有已保存的蓝图执行日志"
-                  aria-label="清空 IndexedDB 日志"
+                  content={t("blueprint.log.clearIdbTooltip")}
+                  aria-label={t("blueprint.log.clearIdbAria")}
                   disabled={!hasSavedRuns}
                   onClick={() => void onClearAllSaved()}
                 >
@@ -236,8 +238,8 @@ export function BlueprintExecutionLogPanel({
                 variant="outline"
                 size="icon"
                 className="h-7 w-7 shrink-0"
-                content="清空当前日志，并重置画布执行高亮"
-                aria-label="清空日志"
+                content={t("blueprint.log.clearCurrentTooltip")}
+                aria-label={t("blueprint.log.clearCurrentAria")}
                 disabled={entries.length === 0}
                 onClick={onClear}
               >
@@ -255,7 +257,7 @@ export function BlueprintExecutionLogPanel({
           >
             {entries.length === 0 ? (
               <p className="text-[11px] text-muted-foreground">
-                暂无执行记录。使用工具栏「走完全流程」或「下一步」开始模拟。
+                {t("blueprint.log.emptyHint")}
               </p>
             ) : (
               <div className="space-y-0">
@@ -279,7 +281,7 @@ export function BlueprintExecutionLogPanel({
                       <div className="mt-2 grid gap-2">
                         <div>
                           <div className="mb-1 text-[10px] font-medium text-muted-foreground">
-                            输入
+                            {t("blueprint.log.input")}
                           </div>
                           <pre className="max-h-32 overflow-auto rounded border border-border/60 bg-background p-2 font-mono text-[10px] leading-relaxed text-foreground">
                             {formatJson(entry.inputs)}
@@ -287,7 +289,7 @@ export function BlueprintExecutionLogPanel({
                         </div>
                         <div>
                           <div className="mb-1 text-[10px] font-medium text-muted-foreground">
-                            输出
+                            {t("blueprint.log.output")}
                           </div>
                           <pre
                             className={cn(
@@ -322,7 +324,7 @@ export function BlueprintExecutionLogPanel({
                 onClick={() => scrollToBottom("smooth")}
               >
                 <ArrowDownIcon className="h-3.5 w-3.5 shrink-0" />
-                <span className="truncate">有新日志</span>
+                <span className="truncate">{t("blueprint.log.hasNewLogs")}</span>
                 {latestEntryPreview ? (
                   <span className="truncate opacity-90">· {latestEntryPreview}</span>
                 ) : null}
@@ -338,26 +340,26 @@ export function BlueprintExecutionLogPanel({
               variant="outline"
               size="sm"
               className="w-full"
-              content="将当前调试日志保存到 IndexedDB"
+              content={t("blueprint.log.saveLogTooltip")}
               disabled={entries.length === 0}
               onClick={onSave}
             >
-              保存日志
+              {t("blueprint.log.saveLog")}
             </LogTooltipButton>
             <LogTooltipButton
               type="button"
               variant="outline"
               size="sm"
               className="w-full"
-              content="将当前调试日志导出为 JSON 文件"
+              content={t("blueprint.log.exportJsonTooltip")}
               disabled={entries.length === 0}
               onClick={onExport}
             >
-              导出 JSON
+              {t("blueprint.log.exportJson")}
             </LogTooltipButton>
           </div>
 
-          <LogTooltip content="调试运行完成后，自动将日志写入 IndexedDB">
+          <LogTooltip content={t("blueprint.log.autoSaveTooltip")}>
             <label className="flex cursor-default items-center gap-2">
               <input
                 type="checkbox"
@@ -366,15 +368,15 @@ export function BlueprintExecutionLogPanel({
                 className="h-3.5 w-3.5 rounded border border-input"
               />
               <span className="text-[11px] text-muted-foreground">
-                运行完成后自动保存到 IndexedDB
+                {t("blueprint.log.autoSaveAfterRun")}
               </span>
             </label>
           </LogTooltip>
 
           <div className="grid grid-cols-2 gap-2">
-            <LogTooltip content="IndexedDB 中最多保留的日志条数，超出后自动删除最旧记录">
+            <LogTooltip content={t("blueprint.log.maxSavedCountTooltip")}>
               <div className="space-y-1">
-                <Label className="text-[11px] text-muted-foreground">最多保存条数</Label>
+                <Label className="text-[11px] text-muted-foreground">{t("blueprint.log.maxSavedCount")}</Label>
                 <Input
                   type="number"
                   min={1}
@@ -386,13 +388,13 @@ export function BlueprintExecutionLogPanel({
                     })
                   }
                   className="h-8"
-                  aria-label="IndexedDB 最多保存日志条数"
+                  aria-label={t("blueprint.log.maxSavedCountAria")}
                 />
               </div>
             </LogTooltip>
-            <LogTooltip content="超过保留天数的已保存日志将在清理时被删除">
+            <LogTooltip content={t("blueprint.log.retentionDaysTooltip")}>
               <div className="space-y-1">
-                <Label className="text-[11px] text-muted-foreground">保留天数</Label>
+                <Label className="text-[11px] text-muted-foreground">{t("blueprint.log.retentionDays")}</Label>
                 <Input
                   type="number"
                   min={1}
@@ -404,7 +406,7 @@ export function BlueprintExecutionLogPanel({
                     })
                   }
                   className="h-8"
-                  aria-label="日志保留天数"
+                  aria-label={t("blueprint.log.retentionDaysAria")}
                 />
               </div>
             </LogTooltip>
@@ -415,10 +417,10 @@ export function BlueprintExecutionLogPanel({
             variant="secondary"
             size="sm"
             className="w-full"
-            content="按保留天数与条数上限，清理 IndexedDB 中的日志记录"
+            content={t("blueprint.log.cleanupTooltip")}
             onClick={onApplyRetention}
           >
-            清理过期与超额
+            {t("blueprint.log.cleanupExpired")}
           </LogTooltipButton>
         </div>
       </div>

package/src/components/BlueprintLibrarySelect.tsx

@@ -7,6 +7,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@arronqzy/ui";
+import { useI18n } from "@arronqzy/i18n/react";
 
 import type { BlueprintLibraryListItem } from "../library/types";
 
@@ -26,11 +27,13 @@ function groupItems(items: BlueprintLibraryListItem[]) {
 export function BlueprintLibrarySelect({
   items,
   value,
-  placeholder = "蓝图库",
+  placeholder,
   onSelect,
 }: BlueprintLibrarySelectProps) {
+  const { t } = useI18n();
   const { saved, imported } = groupItems(items);
   const hasItems = items.length > 0;
+  const resolvedPlaceholder = placeholder ?? t("blueprint.toolbar.library");
 
   return (
     <Select
@@ -39,12 +42,16 @@ export function BlueprintLibrarySelect({
       disabled={!hasItems}
     >
       <SelectTrigger className="h-7 w-[168px] text-xs">
-        <SelectValue placeholder={hasItems ? placeholder : "蓝图库为空"} />
+        <SelectValue
+          placeholder={
+            hasItems ? resolvedPlaceholder : t("blueprint.toolbar.libraryEmpty")
+          }
+        />
       </SelectTrigger>
       <SelectContent className="z-[10100]">
         {saved.length > 0 ? (
           <SelectGroup>
-            <SelectLabel>已保存</SelectLabel>
+            <SelectLabel>{t("blueprint.toolbar.saved")}</SelectLabel>
             {saved.map((item) => (
               <SelectItem key={item.id} value={item.id} className="text-xs">
                 {item.name}
@@ -54,7 +61,7 @@ export function BlueprintLibrarySelect({
         ) : null}
         {imported.length > 0 ? (
           <SelectGroup>
-            <SelectLabel>已导入</SelectLabel>
+            <SelectLabel>{t("blueprint.toolbar.imported")}</SelectLabel>
             {imported.map((item) => (
               <SelectItem key={item.id} value={item.id} className="text-xs">
                 {item.name}