@arronqzy/vue-blueprint 0.1.7 → 0.1.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arronqzy/vue-blueprint",
-  "version": "0.1.7",
+  "version": "0.1.9",
   "description": "Vue 3 blueprint editor for Abuilder (Vue Flow + Ant Design Vue)",
   "license": "MIT",
   "type": "module",
@@ -19,8 +19,8 @@
     "ant-design-vue": "^4.2.6",
     "dayjs": "^1.11.13",
     "vue": "^3.5.13",
-    "@arronqzy/blueprint-dsl": "1.0.9",
-    "@arronqzy/i18n": "0.1.7",
+    "@arronqzy/blueprint-dsl": "1.0.11",
+    "@arronqzy/i18n": "0.1.8",
     "@arronqzy/vue-rx-store": "0.1.3"
   },
   "peerDependencies": {

package/src/BlueprintNodeConfigSidebar.vue

@@ -14,6 +14,7 @@ import {
 import FetchNodeConfigPanel from "./components/FetchNodeConfigPanel.vue";
 import ClockNodeConfigPanel from "./components/ClockNodeConfigPanel.vue";
 import JsonNodeConfigPanel from "./components/JsonNodeConfigPanel.vue";
+import StorageNodeConfigPanel from "./components/StorageNodeConfigPanel.vue";
 import LogicNodeConfigPanel from "./components/LogicNodeConfigPanel.vue";
 import ViewElementMultiSelect from "./components/ViewElementMultiSelect.vue";
 import ConfigHintIcon from "./components/ConfigHintIcon.vue";
@@ -69,6 +70,7 @@ export type BlueprintNodeConfigSidebarProps = {
         | "lifecyclePhase"
         | "fetchConfig"
         | "jsonConfig"
+        | "storageConfig"
         | "logicConfig"
         | "clockConfig"
         | "eventConfig"
@@ -102,6 +104,7 @@ const ROLE_LABEL_KEYS: Record<BlueprintNodeRole, string> = {
   and: "blueprint.config.roleAnd",
   fetch: "blueprint.config.roleFetch",
   json: "blueprint.config.roleJson",
+  storage: "blueprint.config.roleStorage",
   logic: "blueprint.config.roleLogic",
   clock: "blueprint.config.roleClock",
   event: "blueprint.config.roleEvent",
@@ -201,6 +204,7 @@ function toggleEventType(eventType: ViewEventType, checked: boolean) {
           <Select.Option value="lifecycle">{{ t("blueprint.config.configLifecycle") }}</Select.Option>
           <Select.Option value="fetch">{{ t("blueprint.config.configFetch") }}</Select.Option>
           <Select.Option value="json">{{ t("blueprint.config.configJson") }}</Select.Option>
+          <Select.Option value="storage">{{ t("blueprint.config.configStorage") }}</Select.Option>
           <Select.Option value="clock">{{ t("blueprint.config.configClock") }}</Select.Option>
           <Select.Option value="event">{{ t("blueprint.config.configEvent") }}</Select.Option>
           <Select.Option value="view">{{ t("blueprint.config.configView") }}</Select.Option>
@@ -381,6 +385,14 @@ function toggleEventType(eventType: ViewEventType, checked: boolean) {
         :node="node"
         :on-update-node="onUpdateNode"
       />
+      <StorageNodeConfigPanel
+        v-if="configSource === 'storage'"
+        :node="node"
+        :graph-nodes="graphNodes"
+        :graph-edges="graphEdges"
+        :trace-entries="traceEntries"
+        :on-update-node="onUpdateNode"
+      />
       <ClockNodeConfigPanel
         v-if="configSource === 'clock'"
         :node="node"

package/src/blueprintNodeTypes.ts

@@ -5,6 +5,7 @@ import BlueprintFlowNode from "./nodes/BlueprintFlowNode.vue";
 import ClockFlowNode from "./nodes/ClockFlowNode.vue";
 import FetchFlowNode from "./nodes/FetchFlowNode.vue";
 import JsonFlowNode from "./nodes/JsonFlowNode.vue";
+import StorageFlowNode from "./nodes/StorageFlowNode.vue";
 import LifecycleFlowNode from "./nodes/LifecycleFlowNode.vue";
 import EventFlowNode from "./nodes/EventFlowNode.vue";
 import LogicFlowNode from "./nodes/LogicFlowNode.vue";
@@ -16,6 +17,7 @@ export const blueprintNodeTypes: Record<string, Component> = {
   clock: markRaw(ClockFlowNode),
   fetch: markRaw(FetchFlowNode),
   json: markRaw(JsonFlowNode),
+  storage: markRaw(StorageFlowNode),
   logic: markRaw(LogicFlowNode),
   lifecycle: markRaw(LifecycleFlowNode),
   event: markRaw(EventFlowNode),

package/src/components/BlueprintContextMenu.vue

@@ -14,7 +14,7 @@ export type BlueprintContextMenuState =
       clientX: number;
       clientY: number;
       nodeId: string;
-      role: "blueprint" | "logic" | "and" | "lifecycle" | "event" | "fetch" | "json" | "clock";
+      role: "blueprint" | "logic" | "and" | "lifecycle" | "event" | "fetch" | "json" | "storage" | "clock";
     }
   | {
       kind: "edge";

package/src/components/StorageNodeConfigPanel.vue

@@ -0,0 +1,217 @@
+<script setup lang="ts">
+import { useI18n } from "@arronqzy/i18n/vue";
+import { computed, ref } from "vue";
+import { Checkbox, Input, Select } from "ant-design-vue";
+import type {
+  ExecutionTraceEntry,
+  StorageKind,
+  StorageReadConfig,
+  StorageSetConfig,
+} from "@arronqzy/blueprint-dsl";
+import {
+  latestTraceOutputsByNode,
+  resolveFetchIncomingScope,
+  resolveFetchScopeAutocompleteRoot,
+  uniqueStorageKinds,
+} from "@arronqzy/blueprint-dsl";
+
+import type { BlueprintGraphEdge, BlueprintGraphNode } from "../graph/document";
+import { resolveNodeStorageConfig } from "../graph/document";
+import ConfigHintIcon from "./ConfigHintIcon.vue";
+import ScopeTemplateAutocompleteHost from "./ScopeTemplateAutocompleteHost.vue";
+
+const { t } = useI18n();
+
+export type StorageNodeConfigPanelProps = {
+  node: BlueprintGraphNode;
+  graphNodes?: BlueprintGraphNode[];
+  graphEdges?: BlueprintGraphEdge[];
+  traceEntries?: ExecutionTraceEntry[];
+  onUpdateNode: (
+    nodeId: string,
+    patch: Partial<Pick<BlueprintGraphNode, "storageConfig" | "configSource">>
+  ) => void;
+};
+
+const props = withDefaults(defineProps<StorageNodeConfigPanelProps>(), {
+  graphNodes: () => [],
+  graphEdges: () => [],
+  traceEntries: () => [],
+});
+
+const formRef = ref<HTMLDivElement | null>(null);
+const storageConfig = computed(() => resolveNodeStorageConfig(props.node));
+const incomingScope = computed(() => {
+  const outputs = latestTraceOutputsByNode(props.traceEntries);
+  return resolveFetchIncomingScope({
+    fetchNodeId: props.node.id,
+    nodes: props.graphNodes,
+    edges: props.graphEdges,
+    getOutput: (sourceId, port) => outputs[sourceId]?.[port],
+  });
+});
+const autocompleteScope = computed(() =>
+  resolveFetchScopeAutocompleteRoot(incomingScope.value)
+);
+
+function patchStorageConfig(
+  node: BlueprintGraphNode,
+  patch: {
+    read?: Partial<StorageReadConfig>;
+    set?: Partial<StorageSetConfig>;
+  }
+) {
+  const current = resolveNodeStorageConfig(node);
+  return {
+    storageConfig: {
+      read: { ...current.read, ...patch.read },
+      set: { ...current.set, ...patch.set },
+    },
+    configSource: "storage" as const,
+  };
+}
+
+function handleReadStorageChange(value: string) {
+  props.onUpdateNode(
+    props.node.id,
+    patchStorageConfig(props.node, {
+      read: { storage: value === "session" ? "session" : "local" },
+    })
+  );
+}
+
+function handleReadKeyChange(value: string) {
+  props.onUpdateNode(
+    props.node.id,
+    patchStorageConfig(props.node, { read: { key: String(value ?? "") } })
+  );
+}
+
+function handleSetStorageToggle(kind: StorageKind, checked: boolean) {
+  const next = new Set(storageConfig.value.set.storages);
+  if (checked) next.add(kind);
+  else next.delete(kind);
+  props.onUpdateNode(
+    props.node.id,
+    patchStorageConfig(props.node, {
+      set: { storages: uniqueStorageKinds([...next]) },
+    })
+  );
+}
+
+function handleSetKeyChange(value: string) {
+  props.onUpdateNode(
+    props.node.id,
+    patchStorageConfig(props.node, { set: { key: String(value ?? "") } })
+  );
+}
+
+function handleSetValueChange(value: string) {
+  props.onUpdateNode(
+    props.node.id,
+    patchStorageConfig(props.node, { set: { value: String(value ?? "") } })
+  );
+}
+</script>
+
+<template>
+  <div
+    ref="formRef"
+    class="space-y-2 rounded-md border border-border/70 bg-muted/20 p-2.5"
+  >
+    <ScopeTemplateAutocompleteHost :scope="autocompleteScope" :container-ref="formRef" />
+    <div class="flex items-center gap-1.5">
+      <div class="font-medium text-foreground">{{ t("blueprint.config.storageTitle") }}</div>
+      <ConfigHintIcon :label="t('blueprint.config.storageTitle')">
+        {{ t("blueprint.config.storageHint") }}
+      </ConfigHintIcon>
+    </div>
+
+    <div class="space-y-2 rounded-md border border-border/60 bg-background/70 p-2">
+      <div class="flex items-center gap-1.5">
+        <div class="font-medium text-foreground">{{ t("blueprint.config.storageReadTitle") }}</div>
+        <ConfigHintIcon :label="t('blueprint.config.storageReadTitle')">
+          {{ t("blueprint.config.storageReadHint") }}
+        </ConfigHintIcon>
+      </div>
+      <label class="block space-y-1">
+        <span class="text-muted-foreground">{{ t("blueprint.config.storageTarget") }}</span>
+        <Select
+          size="small"
+          class="w-full"
+          :value="storageConfig.read.storage"
+          @change="(v) => handleReadStorageChange(String(v))"
+        >
+          <Select.Option value="session">{{ t("blueprint.config.storageSession") }}</Select.Option>
+          <Select.Option value="local">{{ t("blueprint.config.storageLocal") }}</Select.Option>
+        </Select>
+      </label>
+      <label class="block space-y-1">
+        <span class="text-muted-foreground">{{ t("blueprint.config.storageKey") }}</span>
+        <Input
+          size="small"
+          :value="storageConfig.read.key"
+          spellcheck="false"
+          class="font-mono text-[11px]"
+          placeholder="key"
+          @update:value="(v) => handleReadKeyChange(String(v ?? ''))"
+        />
+      </label>
+    </div>
+
+    <div class="space-y-2 rounded-md border border-border/60 bg-background/70 p-2">
+      <div class="flex items-center gap-1.5">
+        <div class="font-medium text-foreground">{{ t("blueprint.config.storageSetTitle") }}</div>
+        <ConfigHintIcon :label="t('blueprint.config.storageSetTitle')">
+          {{ t("blueprint.config.storageSetHint") }}
+        </ConfigHintIcon>
+      </div>
+      <div class="space-y-1.5">
+        <span class="text-muted-foreground">{{ t("blueprint.config.storageTarget") }}</span>
+        <label class="flex items-center gap-2">
+          <Checkbox
+            :checked="storageConfig.set.storages.includes('session')"
+            class="mt-0.5"
+            @update:checked="(v) => handleSetStorageToggle('session', Boolean(v))"
+          />
+          <span>{{ t("blueprint.config.storageSession") }}</span>
+        </label>
+        <label class="flex items-center gap-2">
+          <Checkbox
+            :checked="storageConfig.set.storages.includes('local')"
+            class="mt-0.5"
+            @update:checked="(v) => handleSetStorageToggle('local', Boolean(v))"
+          />
+          <span>{{ t("blueprint.config.storageLocal") }}</span>
+        </label>
+      </div>
+      <label class="block space-y-1">
+        <span class="text-muted-foreground">{{ t("blueprint.config.storageKey") }}</span>
+        <Input
+          size="small"
+          :value="storageConfig.set.key"
+          spellcheck="false"
+          class="font-mono text-[11px]"
+          placeholder="key"
+          @update:value="(v) => handleSetKeyChange(String(v ?? ''))"
+        />
+      </label>
+      <label class="block space-y-1">
+        <span class="inline-flex items-center gap-1 text-muted-foreground">
+          {{ t("blueprint.config.storageValue") }}
+          <ConfigHintIcon :label="t('blueprint.config.storageValue')">
+            {{ t("blueprint.config.storageValueHint") }}
+          </ConfigHintIcon>
+        </span>
+        <Input
+          size="small"
+          :value="storageConfig.set.value"
+          spellcheck="false"
+          class="font-mono text-[11px]"
+          placeholder="{scope.value}"
+          @update:value="(v) => handleSetValueChange(String(v ?? ''))"
+        />
+      </label>
+    </div>
+  </div>
+</template>

package/src/composables/useBlueprintDebugSession.ts

@@ -41,6 +41,7 @@ export type UseBlueprintDebugSessionOptions = {
   libraryNameById?: MaybeRefOrGetter<ReadonlyMap<string, string> | undefined>;
   onExecutionBlocked?: (message: string) => void;
   onViewScopeUpdate?: (viewElementIds: string[], scope: unknown) => void;
+  nameSpace?: MaybeRefOrGetter<string | null | undefined>;
 };
 
 function buildNodeLabelMap(graph: BlueprintGraph): Record<string, string> {
@@ -63,13 +64,20 @@ export function useBlueprintDebugSession(options: UseBlueprintDebugSessionOption
   const chainComplete = ref(false);
   const logPanelOpen = ref(false);
   const running = ref(false);
-  const settings = ref<ExecutionLogSettings>(readExecutionLogSettings());
+  const settings = ref<ExecutionLogSettings>(
+    readExecutionLogSettings(toValue(options.nameSpace))
+  );
   const savedRuns = ref<ExecutionRunRecord[]>([]);
   const totalSavedRunCount = ref(0);
 
   const graph = computed(() => toValue(options.graph));
   const blueprintId = computed(() => toValue(options.blueprintId));
   const blueprintName = computed(() => toValue(options.blueprintName));
+  const nameSpace = computed(() => toValue(options.nameSpace) ?? null);
+
+  watch(nameSpace, (ns) => {
+    settings.value = readExecutionLogSettings(ns);
+  });
 
   const lifecycleNodes = computed<LifecycleNodeOption[]>(() =>
     graph.value.document.nodes
@@ -145,7 +153,7 @@ export function useBlueprintDebugSession(options: UseBlueprintDebugSessionOption
   }
 
   async function refreshSavedRuns() {
-    const all = await listExecutionRunRecords();
+    const all = await listExecutionRunRecords(undefined, nameSpace.value);
     totalSavedRunCount.value = all.length;
     savedRuns.value = blueprintId.value
       ? all.filter((item) => item.blueprintId === blueprintId.value)
@@ -158,13 +166,13 @@ export function useBlueprintDebugSession(options: UseBlueprintDebugSessionOption
 
   async function enforceSavedRunLimits() {
     const cutoff = retentionCutoffMs(settings.value.retentionDays);
-    await purgeExecutionRunsOlderThan(cutoff);
-    await trimExecutionRunRecordsToMax(settings.value.maxSavedRuns);
+    await purgeExecutionRunsOlderThan(cutoff, nameSpace.value);
+    await trimExecutionRunRecordsToMax(settings.value.maxSavedRuns, nameSpace.value);
     await refreshSavedRuns();
   }
 
   async function clearAllSavedRuns() {
-    const removed = await clearAllExecutionRunRecords();
+    const removed = await clearAllExecutionRunRecords(nameSpace.value);
     savedRuns.value = [];
     totalSavedRunCount.value = 0;
     return removed;
@@ -194,7 +202,7 @@ export function useBlueprintDebugSession(options: UseBlueprintDebugSessionOption
 
   async function persistRunIfNeeded(record: ExecutionRunRecord) {
     if (!settings.value.autoSave) return;
-    await putExecutionRunRecord(record);
+    await putExecutionRunRecord(record, nameSpace.value);
     await enforceSavedRunLimits();
   }
 
@@ -356,7 +364,7 @@ export function useBlueprintDebugSession(options: UseBlueprintDebugSessionOption
       runnerRef.value?.isDebugQueueEmpty() ? "completed" : "paused",
       entries.value
     );
-    await putExecutionRunRecord(record);
+    await putExecutionRunRecord(record, nameSpace.value);
     await enforceSavedRunLimits();
   }
 
@@ -373,10 +381,10 @@ export function useBlueprintDebugSession(options: UseBlueprintDebugSessionOption
   function updateSettings(patch: Partial<ExecutionLogSettings>) {
     const next = { ...settings.value, ...patch };
     settings.value = next;
-    writeExecutionLogSettings(next);
+    writeExecutionLogSettings(next, nameSpace.value);
     if (patch.maxSavedRuns !== undefined) {
       const maxSavedRuns = Math.max(1, Math.floor(patch.maxSavedRuns));
-      void trimExecutionRunRecordsToMax(maxSavedRuns).then(() => refreshSavedRuns());
+      void trimExecutionRunRecordsToMax(maxSavedRuns, nameSpace.value).then(() => refreshSavedRuns());
     }
   }
 

package/src/graph/blueprint-graph.ts

@@ -8,6 +8,7 @@ import {
   resolveNodeEventConfig,
   resolveNodeFetchConfig,
   resolveNodeJsonConfig,
+  resolveNodeStorageConfig,
   resolveNodeLogicConfig,
   resolveRunnableNodeType,
   sanitizeBlueprintDocument,
@@ -197,6 +198,7 @@ export class BlueprintGraph {
         | "lifecyclePhase"
         | "fetchConfig"
         | "jsonConfig"
+        | "storageConfig"
         | "logicConfig"
         | "clockConfig"
         | "eventConfig"
@@ -241,6 +243,20 @@ export class BlueprintGraph {
             ...patch.jsonConfig,
           };
         }
+        if (patch.storageConfig) {
+          nextNode.storageConfig = {
+            ...resolveNodeStorageConfig(n),
+            ...patch.storageConfig,
+            read: {
+              ...resolveNodeStorageConfig(n).read,
+              ...patch.storageConfig.read,
+            },
+            set: {
+              ...resolveNodeStorageConfig(n).set,
+              ...patch.storageConfig.set,
+            },
+          };
+        }
         if (patch.logicConfig) {
           nextNode.logicConfig = {
             ...resolveNodeLogicConfig(n),

package/src/graph/document.ts

@@ -4,6 +4,7 @@ import type {
   JsonNodeConfig,
   LogicNodeConfig,
   PageLifecyclePhase,
+  StorageNodeConfig,
   ViewEventNodeConfig,
   ViewEventType,
 } from "@arronqzy/blueprint-dsl";
@@ -16,13 +17,16 @@ import {
   DEFAULT_JSON_NODE_CONFIG,
   DEFAULT_LOGIC_NODE_CONFIG,
   DEFAULT_LOGIC_NODE_TYPE,
+  DEFAULT_STORAGE_NODE_CONFIG,
   DEFAULT_VIEW_EVENT_NODE_CONFIG,
   EVENT_NODE_TYPE,
   FETCH_NODE_TYPE,
   JSON_NODE_TYPE,
   LIFECYCLE_NODE_TYPE,
   normalizeClockConfig,
+  normalizeStorageConfig,
   normalizeViewEventConfig,
+  STORAGE_NODE_TYPE,
   VIEW_NODE_TYPE,
 } from "@arronqzy/blueprint-dsl";
 
@@ -31,8 +35,9 @@ export type { JsonNodeConfig as BlueprintJsonConfig } from "@arronqzy/blueprint-
 export type { LogicNodeConfig as BlueprintLogicConfig } from "@arronqzy/blueprint-dsl";
 export type { ClockNodeConfig as BlueprintClockConfig } from "@arronqzy/blueprint-dsl";
 export type { ViewEventNodeConfig as BlueprintEventConfig } from "@arronqzy/blueprint-dsl";
+export type { StorageNodeConfig as BlueprintStorageConfig } from "@arronqzy/blueprint-dsl";
 
-export type BlueprintNodeRole = "blueprint" | "logic" | "and" | "lifecycle" | "fetch" | "json" | "clock" | "event";
+export type BlueprintNodeRole = "blueprint" | "logic" | "and" | "lifecycle" | "fetch" | "json" | "storage" | "clock" | "event";
 
 /** 决定右侧配置面板展示哪类配置 */
 export type BlueprintConfigSource =
@@ -43,6 +48,7 @@ export type BlueprintConfigSource =
   | "view"
   | "fetch"
   | "json"
+  | "storage"
   | "clock"
   | "event";
 
@@ -71,6 +77,8 @@ export type BlueprintGraphNode = {
   fetchConfig?: FetchRequestConfig;
   /** JSON 节点的 JSON 字符串配置 */
   jsonConfig?: JsonNodeConfig;
+  /** 存储节点的读写配置 */
+  storageConfig?: StorageNodeConfig;
   /** 逻辑节点的 JavaScript 脚本配置 */
   logicConfig?: LogicNodeConfig;
   /** 时钟节点的间隔与时间格式配置 */
@@ -108,8 +116,10 @@ export function resolveBlueprintConfigSource(
   if (node.role === "and") return "and";
   if (node.role === "fetch") return "fetch";
   if (node.role === "json") return "json";
+  if (node.role === "storage") return "storage";
   if (node.nodeType === FETCH_NODE_TYPE) return "fetch";
   if (node.nodeType === JSON_NODE_TYPE) return "json";
+  if (node.nodeType === STORAGE_NODE_TYPE) return "storage";
   if (node.nodeType === CLOCK_NODE_TYPE) return "clock";
   if (node.nodeType === EVENT_NODE_TYPE) return "event";
   if (node.nodeType === VIEW_NODE_TYPE) return "view";
@@ -187,6 +197,8 @@ export function resolveRunnableNodeType(
       return FETCH_NODE_TYPE;
     case "json":
       return JSON_NODE_TYPE;
+    case "storage":
+      return STORAGE_NODE_TYPE;
     case "logic":
       return DEFAULT_LOGIC_NODE_TYPE;
     default:
@@ -210,6 +222,7 @@ export const BLUEPRINT_CONFIG_TYPE_LABEL_KEYS: Record<
   event: "blueprint.node.typeEvent",
   fetch: "blueprint.node.typeFetch",
   json: "blueprint.node.typeJson",
+  storage: "blueprint.node.typeStorage",
   clock: "blueprint.node.typeClock",
 };
 
@@ -300,6 +313,15 @@ export function resolveNodeJsonConfig(
   };
 }
 
+export function resolveNodeStorageConfig(
+  node: Pick<BlueprintGraphNode, "storageConfig">
+): StorageNodeConfig {
+  return normalizeStorageConfig({
+    ...DEFAULT_STORAGE_NODE_CONFIG,
+    ...node.storageConfig,
+  });
+}
+
 export function resolveNodeLogicConfig(
   node: Pick<BlueprintGraphNode, "logicConfig">
 ): LogicNodeConfig {
@@ -399,6 +421,9 @@ export function sanitizeBlueprintDocument(
     if (next.role === "json") {
       return { ...next, configSource: "json" as const };
     }
+    if (next.role === "storage") {
+      return { ...next, configSource: "storage" as const };
+    }
     if (next.role === "and") {
       return { ...next, configSource: "and" as const };
     }
@@ -452,6 +477,7 @@ export function patchNodeConfigSource(
       logicConfig: undefined,
       clockConfig: undefined,
       eventConfig: undefined,
+      storageConfig: undefined,
     };
   }
 
@@ -469,6 +495,7 @@ export function patchNodeConfigSource(
       jsonConfig: undefined,
       logicConfig: undefined,
       eventConfig: undefined,
+      storageConfig: undefined,
     };
   }
 
@@ -486,6 +513,7 @@ export function patchNodeConfigSource(
       logicConfig: undefined,
       clockConfig: undefined,
       eventConfig: undefined,
+      storageConfig: undefined,
     };
   }
 
@@ -503,6 +531,25 @@ export function patchNodeConfigSource(
       logicConfig: undefined,
       clockConfig: undefined,
       eventConfig: undefined,
+      storageConfig: undefined,
+    };
+  }
+
+  if (configSource === "storage") {
+    return {
+      role: "storage",
+      nodeType: STORAGE_NODE_TYPE,
+      configSource: "storage",
+      storageConfig: resolveNodeStorageConfig(node),
+      lifecyclePhase: undefined,
+      viewElementId: undefined,
+      viewElementIds: undefined,
+      libraryBlueprintId: undefined,
+      fetchConfig: undefined,
+      jsonConfig: undefined,
+      logicConfig: undefined,
+      clockConfig: undefined,
+      eventConfig: undefined,
     };
   }
 
@@ -520,6 +567,7 @@ export function patchNodeConfigSource(
       logicConfig: undefined,
       clockConfig: undefined,
       eventConfig: undefined,
+      storageConfig: undefined,
     };
   }
 
@@ -537,6 +585,7 @@ export function patchNodeConfigSource(
       logicConfig: resolveNodeLogicConfig(node),
       clockConfig: undefined,
       eventConfig: undefined,
+      storageConfig: undefined,
     };
   }
 
@@ -554,6 +603,7 @@ export function patchNodeConfigSource(
       logicConfig: undefined,
       clockConfig: undefined,
       eventConfig: undefined,
+      storageConfig: undefined,
     };
   }
 
@@ -569,6 +619,7 @@ export function patchNodeConfigSource(
       jsonConfig: undefined,
       logicConfig: undefined,
       clockConfig: undefined,
+      storageConfig: undefined,
     };
   }
 
@@ -583,5 +634,6 @@ export function patchNodeConfigSource(
     logicConfig: undefined,
     clockConfig: undefined,
     eventConfig: undefined,
+    storageConfig: undefined,
   };
 }

package/src/graph/index.ts

@@ -1,4 +1,5 @@
 export * from "./document";
+export * from "./parse-blueprint-data";
 export * from "./node-types";
 export * from "./blueprint-graph";
 export * from "./vue-flow-adapter";

package/src/graph/node-summary.ts

@@ -9,6 +9,7 @@ import {
   resolveNodeFetchConfig,
   resolveNodeJsonConfig,
   resolveNodeLogicConfig,
+  resolveNodeStorageConfig,
   resolveViewElementIds,
   resolveNodeEventConfig,
   getViewEventTypeLabel,
@@ -65,6 +66,29 @@ export function resolveBlueprintNodeSummary(
       if (!json) return t("blueprint.node.summaryEmptyJson");
       return truncate(json.replace(/\s+/g, " "), 44);
     }
+    case "storage": {
+      const storage = resolveNodeStorageConfig(data);
+      const setKey = storage.set.key.trim();
+      const readKey = storage.read.key.trim();
+      const hasSet = Boolean(setKey) && storage.set.storages.length > 0;
+      const hasRead = Boolean(readKey);
+      if (hasSet && hasRead) {
+        return truncate(
+          t("blueprint.node.summaryStorageSetRead", {
+            setKey,
+            readKey,
+          }),
+          44
+        );
+      }
+      if (hasSet) {
+        return truncate(t("blueprint.node.summaryStorageSet", { key: setKey }), 44);
+      }
+      if (hasRead) {
+        return truncate(t("blueprint.node.summaryStorageRead", { key: readKey }), 44);
+      }
+      return t("blueprint.node.summaryStorageUnset");
+    }
     case "logic": {
       const code = resolveNodeLogicConfig(data).sourceCode?.trim();
       if (!code) return t("blueprint.node.summaryNoScript");

package/src/graph/node-types.ts

@@ -4,6 +4,7 @@ export {
   DEFAULT_LOGIC_NODE_TYPE,
   LIFECYCLE_NODE_TYPE,
   JSON_NODE_TYPE,
+  STORAGE_NODE_TYPE,
   CLOCK_NODE_TYPE,
   AND_NODE_TYPE,
   EVENT_NODE_TYPE,

package/src/graph/parse-blueprint-data.ts

@@ -0,0 +1,106 @@
+import {
+  sanitizeBlueprintDocument,
+  type BlueprintDocument,
+  type BlueprintGraphEdge,
+  type BlueprintGraphNode,
+  type BlueprintNodeRole,
+} from "./document";
+
+export type ParseCheckResult = {
+  ok: boolean;
+  error?: string;
+};
+
+const NODE_ROLES = new Set<BlueprintNodeRole>([
+  "blueprint",
+  "logic",
+  "and",
+  "lifecycle",
+  "fetch",
+  "json",
+  "storage",
+  "clock",
+  "event",
+]);
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return Boolean(value) && typeof value === "object" && !Array.isArray(value);
+}
+
+function extractBlueprintDocument(data: unknown): unknown {
+  if (!isRecord(data)) return data;
+  if (isRecord(data.blueprintDocument)) return data.blueprintDocument;
+  if (isRecord(data.document) && Array.isArray(data.document.nodes)) {
+    return data.document;
+  }
+  return data;
+}
+
+function isFiniteNumber(value: unknown): value is number {
+  return typeof value === "number" && Number.isFinite(value);
+}
+
+function isBlueprintNode(value: unknown): value is BlueprintGraphNode {
+  if (!isRecord(value)) return false;
+  if (typeof value.id !== "string" || !value.id) return false;
+  if (typeof value.role !== "string" || !NODE_ROLES.has(value.role as BlueprintNodeRole)) {
+    return false;
+  }
+  if (!isRecord(value.position) || !isFiniteNumber(value.position.x) || !isFiniteNumber(value.position.y)) {
+    return false;
+  }
+  return true;
+}
+
+function isBlueprintEdge(value: unknown): value is BlueprintGraphEdge {
+  if (!isRecord(value)) return false;
+  return (
+    typeof value.id === "string" &&
+    value.id.length > 0 &&
+    typeof value.source === "string" &&
+    value.source.length > 0 &&
+    typeof value.target === "string" &&
+    value.target.length > 0
+  );
+}
+
+/**
+ * 校验数据能否被蓝图解析（工作区 `blueprintDocument`、蓝图导出 JSON 或裸文档均可）。
+ */
+export function parseBlueprintData(
+  data: unknown
+): ParseCheckResult & { value?: BlueprintDocument } {
+  if (data == null) {
+    return { ok: false, error: "empty" };
+  }
+  const raw = extractBlueprintDocument(data);
+  if (!isRecord(raw)) {
+    return { ok: false, error: "invalid-blueprint-data" };
+  }
+  if (!Array.isArray(raw.nodes) || !Array.isArray(raw.edges)) {
+    return { ok: false, error: "invalid-blueprint-data" };
+  }
+  if (!raw.nodes.every(isBlueprintNode) || !raw.edges.every(isBlueprintEdge)) {
+    return { ok: false, error: "invalid-blueprint-data" };
+  }
+  try {
+    const value = sanitizeBlueprintDocument({
+      id: typeof raw.id === "string" && raw.id ? raw.id : "default",
+      name: typeof raw.name === "string" ? raw.name : undefined,
+      nodes: raw.nodes as BlueprintGraphNode[],
+      edges: raw.edges as BlueprintGraphEdge[],
+      allowFalseSignalPropagation:
+        typeof raw.allowFalseSignalPropagation === "boolean"
+          ? raw.allowFalseSignalPropagation
+          : undefined,
+    });
+    return { ok: true, value };
+  } catch {
+    return { ok: false, error: "invalid-blueprint-data" };
+  }
+}
+
+export function validateBlueprintData(data: unknown): ParseCheckResult {
+  const parsed = parseBlueprintData(data);
+  return parsed.ok ? { ok: true } : { ok: false, error: parsed.error };
+}

package/src/graph/sync-nodes.ts

@@ -50,6 +50,10 @@ export function nodeStructureSignature(
     viewElementIds?: string[];
     fetchConfig?: { url?: string; method?: string; apiBaseUrl?: string; swaggerDocsUrl?: string };
     jsonConfig?: { jsonString?: string };
+    storageConfig?: {
+      read?: { storage?: string; key?: string };
+      set?: { storages?: string[]; key?: string; value?: string };
+    };
     logicConfig?: { sourceCode?: string };
     clockConfig?: { intervalSeconds?: number; timeFormat?: string; outputCount?: number; emitImmediately?: boolean };
     eventConfig?: { eventTypes?: string[] };
@@ -58,7 +62,7 @@ export function nodeStructureSignature(
   return nodes
     .map(
       (n) =>
-        `${n.id}:${n.role}:${n.label}:${n.configSource ?? ""}:${n.lifecyclePhase ?? ""}:${n.libraryBlueprintId ?? ""}:${n.nodeType ?? ""}:${(n.viewElementIds ?? (n.viewElementId ? [n.viewElementId] : [])).join(",")}:${n.fetchConfig?.url ?? ""}:${n.fetchConfig?.method ?? ""}:${n.fetchConfig?.apiBaseUrl ?? ""}:${n.fetchConfig?.swaggerDocsUrl ?? ""}:${n.jsonConfig?.jsonString ?? ""}:${n.logicConfig?.sourceCode ?? ""}:${n.clockConfig?.intervalSeconds ?? ""}:${n.clockConfig?.timeFormat ?? ""}:${n.clockConfig?.outputCount ?? ""}:${n.clockConfig?.emitImmediately ?? ""}:${(n.eventConfig?.eventTypes ?? []).join(",")}`
+        `${n.id}:${n.role}:${n.label}:${n.configSource ?? ""}:${n.lifecyclePhase ?? ""}:${n.libraryBlueprintId ?? ""}:${n.nodeType ?? ""}:${(n.viewElementIds ?? (n.viewElementId ? [n.viewElementId] : [])).join(",")}:${n.fetchConfig?.url ?? ""}:${n.fetchConfig?.method ?? ""}:${n.fetchConfig?.apiBaseUrl ?? ""}:${n.fetchConfig?.swaggerDocsUrl ?? ""}:${n.jsonConfig?.jsonString ?? ""}:${n.storageConfig?.read?.storage ?? ""}:${n.storageConfig?.read?.key ?? ""}:${(n.storageConfig?.set?.storages ?? []).join(",")}:${n.storageConfig?.set?.key ?? ""}:${n.storageConfig?.set?.value ?? ""}:${n.logicConfig?.sourceCode ?? ""}:${n.clockConfig?.intervalSeconds ?? ""}:${n.clockConfig?.timeFormat ?? ""}:${n.clockConfig?.outputCount ?? ""}:${n.clockConfig?.emitImmediately ?? ""}:${(n.eventConfig?.eventTypes ?? []).join(",")}`
     )
     .sort()
     .join("|");

package/src/graph/vue-flow-adapter.ts

@@ -19,6 +19,7 @@ export type BlueprintFlowNodeData = {
   lifecyclePhase?: BlueprintGraphNode["lifecyclePhase"];
   fetchConfig?: BlueprintGraphNode["fetchConfig"];
   jsonConfig?: BlueprintGraphNode["jsonConfig"];
+  storageConfig?: BlueprintGraphNode["storageConfig"];
   clockConfig?: BlueprintGraphNode["clockConfig"];
   eventConfig?: BlueprintGraphNode["eventConfig"];
   logicConfig?: BlueprintGraphNode["logicConfig"];
@@ -71,6 +72,8 @@ export function toVueFlowNodes(document: BlueprintDocument): VueFlowNodeView[] {
           ? "fetch"
           : n.role === "json"
             ? "json"
+            : n.role === "storage"
+              ? "storage"
             : n.role === "event"
               ? "event"
             : "logic",
@@ -93,6 +96,7 @@ export function toVueFlowNodes(document: BlueprintDocument): VueFlowNodeView[] {
       lifecyclePhase: n.lifecyclePhase,
       fetchConfig: n.fetchConfig,
       jsonConfig: n.jsonConfig,
+      storageConfig: n.storageConfig,
       clockConfig: n.clockConfig,
       eventConfig: n.eventConfig,
       logicConfig: n.logicConfig,

package/src/library/blueprint-library-db.ts

@@ -1,3 +1,4 @@
+import { appStorageKey } from "@arronqzy/blueprint-dsl";
 import type {
   BlueprintLibraryListItem,
   BlueprintLibraryRecord,
@@ -7,9 +8,9 @@ const DB_NAME = "arronqzy-blueprint-library";
 const DB_VERSION = 1;
 const STORE_NAME = "blueprints";
 
-function openDb(): Promise<IDBDatabase> {
+function openDb(nameSpace?: string | null): Promise<IDBDatabase> {
   return new Promise((resolve, reject) => {
-    const request = indexedDB.open(DB_NAME, DB_VERSION);
+    const request = indexedDB.open(appStorageKey(DB_NAME, nameSpace), DB_VERSION);
     request.onerror = () => reject(request.error ?? new Error("indexeddb-open-failed"));
     request.onupgradeneeded = () => {
       const db = request.result;
@@ -25,9 +26,10 @@ function openDb(): Promise<IDBDatabase> {
 
 function runTransaction<T>(
   mode: IDBTransactionMode,
-  runner: (store: IDBObjectStore) => IDBRequest<T>
+  runner: (store: IDBObjectStore) => IDBRequest<T>,
+  nameSpace?: string | null
 ): Promise<T> {
-  return openDb().then(
+  return openDb(nameSpace).then(
     (db) =>
       new Promise<T>((resolve, reject) => {
         const tx = db.transaction(STORE_NAME, mode);
@@ -53,9 +55,13 @@ function runTransaction<T>(
   );
 }
 
-export async function listBlueprintLibrary(): Promise<BlueprintLibraryListItem[]> {
-  const records = await runTransaction<BlueprintLibraryRecord[]>("readonly", (store) =>
-    store.getAll()
+export async function listBlueprintLibrary(
+  nameSpace?: string | null
+): Promise<BlueprintLibraryListItem[]> {
+  const records = await runTransaction<BlueprintLibraryRecord[]>(
+    "readonly",
+    (store) => store.getAll(),
+    nameSpace
   );
   return records
     .map((record) => ({
@@ -69,26 +75,31 @@ export async function listBlueprintLibrary(): Promise<BlueprintLibraryListItem[]
 }
 
 export async function getBlueprintLibraryRecord(
-  id: string
+  id: string,
+  nameSpace?: string | null
 ): Promise<BlueprintLibraryRecord | null> {
-  const record = await runTransaction<BlueprintLibraryRecord | undefined>("readonly", (store) =>
-    store.get(id)
+  const record = await runTransaction<BlueprintLibraryRecord | undefined>(
+    "readonly",
+    (store) => store.get(id),
+    nameSpace
   );
   return record ?? null;
 }
 
 export async function putBlueprintLibraryRecord(
-  record: BlueprintLibraryRecord
+  record: BlueprintLibraryRecord,
+  nameSpace?: string | null
 ): Promise<BlueprintLibraryRecord> {
-  await runTransaction<IDBValidKey>("readwrite", (store) => store.put(record));
+  await runTransaction<IDBValidKey>("readwrite", (store) => store.put(record), nameSpace);
   return record;
 }
 
 export async function updateBlueprintLibraryMeta(
   id: string,
-  patch: { name?: string; remark?: string }
+  patch: { name?: string; remark?: string },
+  nameSpace?: string | null
 ): Promise<BlueprintLibraryRecord | null> {
-  const existing = await getBlueprintLibraryRecord(id);
+  const existing = await getBlueprintLibraryRecord(id, nameSpace);
   if (!existing) return null;
 
   const name = patch.name?.trim() || existing.name;
@@ -103,10 +114,13 @@ export async function updateBlueprintLibraryMeta(
     },
   };
 
-  await putBlueprintLibraryRecord(record);
+  await putBlueprintLibraryRecord(record, nameSpace);
   return record;
 }
 
-export async function deleteBlueprintLibraryRecord(id: string): Promise<void> {
-  await runTransaction<undefined>("readwrite", (store) => store.delete(id));
+export async function deleteBlueprintLibraryRecord(
+  id: string,
+  nameSpace?: string | null
+): Promise<void> {
+  await runTransaction<undefined>("readwrite", (store) => store.delete(id), nameSpace);
 }

package/src/library/execution-log-db.ts

@@ -1,12 +1,13 @@
+import { appStorageKey } from "@arronqzy/blueprint-dsl";
 import type { ExecutionRunRecord } from "@arronqzy/blueprint-dsl";
 
 const DB_NAME = "arronqzy-blueprint-execution-log";
 const DB_VERSION = 1;
 const STORE_NAME = "runs";
 
-function openDb(): Promise<IDBDatabase> {
+function openDb(nameSpace?: string | null): Promise<IDBDatabase> {
   return new Promise((resolve, reject) => {
-    const request = indexedDB.open(DB_NAME, DB_VERSION);
+    const request = indexedDB.open(appStorageKey(DB_NAME, nameSpace), DB_VERSION);
     request.onerror = () => reject(request.error ?? new Error("indexeddb-open-failed"));
     request.onupgradeneeded = () => {
       const db = request.result;
@@ -22,9 +23,10 @@ function openDb(): Promise<IDBDatabase> {
 
 function runTransaction<T>(
   mode: IDBTransactionMode,
-  runner: (store: IDBObjectStore) => IDBRequest<T>
+  runner: (store: IDBObjectStore) => IDBRequest<T>,
+  nameSpace?: string | null
 ): Promise<T> {
-  return openDb().then(
+  return openDb(nameSpace).then(
     (db) =>
       new Promise<T>((resolve, reject) => {
         const tx = db.transaction(STORE_NAME, mode);
@@ -50,28 +52,55 @@ function runTransaction<T>(
   );
 }
 
+function deleteMany(ids: string[], nameSpace?: string | null): Promise<void> {
+  return openDb(nameSpace).then(
+    (db) =>
+      new Promise<void>((resolve, reject) => {
+        const tx = db.transaction(STORE_NAME, "readwrite");
+        const store = tx.objectStore(STORE_NAME);
+        for (const id of ids) {
+          store.delete(id);
+        }
+        tx.oncomplete = () => {
+          db.close();
+          resolve();
+        };
+        tx.onerror = () => {
+          db.close();
+          reject(tx.error ?? new Error("indexeddb-transaction-failed"));
+        };
+      })
+  );
+}
+
 export async function putExecutionRunRecord(
-  record: ExecutionRunRecord
+  record: ExecutionRunRecord,
+  nameSpace?: string | null
 ): Promise<ExecutionRunRecord> {
-  await runTransaction<IDBValidKey>("readwrite", (store) => store.put(record));
+  await runTransaction<IDBValidKey>("readwrite", (store) => store.put(record), nameSpace);
   return record;
 }
 
 export async function getExecutionRunRecord(
-  runId: string
+  runId: string,
+  nameSpace?: string | null
 ): Promise<ExecutionRunRecord | null> {
   const record = await runTransaction<ExecutionRunRecord | undefined>(
     "readonly",
-    (store) => store.get(runId)
+    (store) => store.get(runId),
+    nameSpace
   );
   return record ?? null;
 }
 
 export async function listExecutionRunRecords(
-  blueprintId?: string | null
+  blueprintId?: string | null,
+  nameSpace?: string | null
 ): Promise<ExecutionRunRecord[]> {
-  const records = await runTransaction<ExecutionRunRecord[]>("readonly", (store) =>
-    store.getAll()
+  const records = await runTransaction<ExecutionRunRecord[]>(
+    "readonly",
+    (store) => store.getAll(),
+    nameSpace
   );
   const filtered = blueprintId
     ? records.filter((item) => item.blueprintId === blueprintId)
@@ -79,27 +108,37 @@ export async function listExecutionRunRecords(
   return filtered.sort((a, b) => b.startedAt - a.startedAt);
 }
 
-export async function deleteExecutionRunRecord(runId: string): Promise<void> {
-  await runTransaction<undefined>("readwrite", (store) => store.delete(runId));
+export async function deleteExecutionRunRecord(
+  runId: string,
+  nameSpace?: string | null
+): Promise<void> {
+  await runTransaction<undefined>("readwrite", (store) => store.delete(runId), nameSpace);
 }
 
-export async function clearAllExecutionRunRecords(): Promise<number> {
-  const records = await runTransaction<ExecutionRunRecord[]>("readonly", (store) =>
-    store.getAll()
+export async function clearAllExecutionRunRecords(
+  nameSpace?: string | null
+): Promise<number> {
+  const records = await runTransaction<ExecutionRunRecord[]>(
+    "readonly",
+    (store) => store.getAll(),
+    nameSpace
   );
   if (records.length === 0) return 0;
 
-  await runTransaction<undefined>("readwrite", (store) => store.clear());
+  await runTransaction<undefined>("readwrite", (store) => store.clear(), nameSpace);
   return records.length;
 }
 
 export async function trimExecutionRunRecordsToMax(
-  maxCount: number
+  maxCount: number,
+  nameSpace?: string | null
 ): Promise<number> {
   if (!Number.isFinite(maxCount) || maxCount < 1) return 0;
 
-  const records = await runTransaction<ExecutionRunRecord[]>("readonly", (store) =>
-    store.getAll()
+  const records = await runTransaction<ExecutionRunRecord[]>(
+    "readonly",
+    (store) => store.getAll(),
+    nameSpace
   );
   if (records.length <= maxCount) return 0;
 
@@ -107,52 +146,29 @@ export async function trimExecutionRunRecordsToMax(
   const overflow = sorted.slice(maxCount);
   if (overflow.length === 0) return 0;
 
-  await openDb().then(
-    (db) =>
-      new Promise<void>((resolve, reject) => {
-        const tx = db.transaction(STORE_NAME, "readwrite");
-        const store = tx.objectStore(STORE_NAME);
-        for (const item of overflow) {
-          store.delete(item.runId);
-        }
-        tx.oncomplete = () => {
-          db.close();
-          resolve();
-        };
-        tx.onerror = () => {
-          db.close();
-          reject(tx.error ?? new Error("indexeddb-transaction-failed"));
-        };
-      })
+  await deleteMany(
+    overflow.map((item) => item.runId),
+    nameSpace
   );
 
   return overflow.length;
 }
 
-export async function purgeExecutionRunsOlderThan(cutoffMs: number): Promise<number> {
-  const records = await runTransaction<ExecutionRunRecord[]>("readonly", (store) =>
-    store.getAll()
+export async function purgeExecutionRunsOlderThan(
+  cutoffMs: number,
+  nameSpace?: string | null
+): Promise<number> {
+  const records = await runTransaction<ExecutionRunRecord[]>(
+    "readonly",
+    (store) => store.getAll(),
+    nameSpace
   );
   const stale = records.filter((item) => item.startedAt < cutoffMs);
   if (stale.length === 0) return 0;
 
-  await openDb().then(
-    (db) =>
-      new Promise<void>((resolve, reject) => {
-        const tx = db.transaction(STORE_NAME, "readwrite");
-        const store = tx.objectStore(STORE_NAME);
-        for (const item of stale) {
-          store.delete(item.runId);
-        }
-        tx.oncomplete = () => {
-          db.close();
-          resolve();
-        };
-        tx.onerror = () => {
-          db.close();
-          reject(tx.error ?? new Error("indexeddb-transaction-failed"));
-        };
-      })
+  await deleteMany(
+    stale.map((item) => item.runId),
+    nameSpace
   );
 
   return stale.length;

package/src/library/execution-log-settings.ts

@@ -1,3 +1,5 @@
+import { appStorageKey } from "@arronqzy/blueprint-dsl";
+
 export type ExecutionLogSettings = {
   retentionDays: number;
   autoSave: boolean;
@@ -13,9 +15,11 @@ export const DEFAULT_EXECUTION_LOG_SETTINGS: ExecutionLogSettings = {
   maxSavedRuns: 80,
 };
 
-export function readExecutionLogSettings(): ExecutionLogSettings {
+export function readExecutionLogSettings(
+  nameSpace?: string | null
+): ExecutionLogSettings {
   try {
-    const raw = localStorage.getItem(SETTINGS_KEY);
+    const raw = localStorage.getItem(appStorageKey(SETTINGS_KEY, nameSpace));
     if (!raw) return { ...DEFAULT_EXECUTION_LOG_SETTINGS };
     const parsed = JSON.parse(raw) as Partial<ExecutionLogSettings>;
     return {
@@ -37,9 +41,15 @@ export function readExecutionLogSettings(): ExecutionLogSettings {
   }
 }
 
-export function writeExecutionLogSettings(settings: ExecutionLogSettings) {
+export function writeExecutionLogSettings(
+  settings: ExecutionLogSettings,
+  nameSpace?: string | null
+) {
   try {
-    localStorage.setItem(SETTINGS_KEY, JSON.stringify(settings));
+    localStorage.setItem(
+      appStorageKey(SETTINGS_KEY, nameSpace),
+      JSON.stringify(settings)
+    );
   } catch {
     // ignore storage errors
   }

package/src/nodes/BlueprintNodeCard.vue

@@ -10,7 +10,7 @@ export type BlueprintNodeCardProps = {
   meta?: string;
   subtitle?: string;
   progressLabel?: string;
-  variant?: "blueprint" | "logic" | "and" | "lifecycle" | "event" | "fetch" | "json" | "clock";
+  variant?: "blueprint" | "logic" | "and" | "lifecycle" | "event" | "fetch" | "json" | "storage" | "clock";
   selected?: boolean;
   hideLeadingDot?: boolean;
 };
@@ -61,6 +61,11 @@ const variantStyle = {
     badge: "bg-teal-500/10 text-teal-700 dark:text-teal-300",
     dot: "bg-teal-500",
   },
+  storage: {
+    accent: "border-l-emerald-500 dark:border-l-emerald-400",
+    badge: "bg-emerald-500/10 text-emerald-700 dark:text-emerald-300",
+    dot: "bg-emerald-500",
+  },
   clock: {
     accent: "border-l-rose-500 dark:border-l-rose-400",
     badge: "bg-rose-500/10 text-rose-700 dark:text-rose-300",

package/src/nodes/StorageFlowNode.vue

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import { useI18n } from "@arronqzy/i18n/vue";
+import type { NodeProps } from "@vue-flow/core";
+import { resolveBlueprintNodeTypeLabel } from "../graph/document";
+import { resolveBlueprintNodeSummary } from "../graph/node-summary";
+import { useBlueprintNodeSelect } from "../BlueprintCanvasContext";
+import { resolveBlueprintNodeExecutionTone } from "../runtime/execution-overlay";
+import type { BlueprintFlowNodeData } from "../types";
+import BlueprintNodeShell from "./BlueprintNodeShell.vue";
+
+const { t } = useI18n();
+
+const props = defineProps<NodeProps<BlueprintFlowNodeData>>();
+const onSelect = useBlueprintNodeSelect();
+const nodeData = props.data;
+</script>
+
+<template>
+  <BlueprintNodeShell
+    :node-id="props.id"
+    :label="nodeData.label"
+    :meta="resolveBlueprintNodeTypeLabel(nodeData, t)"
+    :subtitle="resolveBlueprintNodeSummary(nodeData, t)"
+    variant="storage"
+    :selected="Boolean(nodeData.isSelected)"
+    :execution-tone="resolveBlueprintNodeExecutionTone(nodeData)"
+    @select="onSelect"
+  />
+</template>

package/src/runtime/document-to-runnable-graph.ts

@@ -1,10 +1,12 @@
 import {
   FETCH_NODE_TYPE,
+  STORAGE_NODE_TYPE,
   type RunnableGraph,
 } from "@arronqzy/blueprint-dsl";
 
 import {
   resolveNodeFetchConfig,
+  resolveNodeStorageConfig,
   resolveRunnableNodeType,
   resolveViewElementIds,
   type BlueprintDocument,
@@ -34,6 +36,10 @@ export function documentToRunnableGraph(
             ? resolveNodeFetchConfig(node)
             : node.fetchConfig,
         jsonConfig: node.jsonConfig,
+        storageConfig:
+          nodeType === STORAGE_NODE_TYPE
+            ? resolveNodeStorageConfig(node)
+            : node.storageConfig,
         logicConfig: node.logicConfig,
         clockConfig: node.clockConfig,
         eventConfig: node.eventConfig,