@arronqzy/react-blueprint 1.0.18 → 1.0.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arronqzy/react-blueprint",
-  "version": "1.0.18",
+  "version": "1.0.19",
   "description": "",
   "files": [
     "index.ts",
@@ -18,10 +18,10 @@
     "dayjs": "^1.11.13",
     "react-dom": "^19",
     "@xyflow/react": "^12.9.3",
-    "@arronqzy/i18n": "0.1.13",
-    "@arronqzy/ui": "1.0.9",
     "@arronqzy/blueprint-dsl": "1.0.15",
-    "@arronqzy/react-rx-store": "1.1.8"
+    "@arronqzy/react-rx-store": "1.1.8",
+    "@arronqzy/ui": "1.0.9",
+    "@arronqzy/i18n": "0.1.15"
   },
   "devDependencies": {
     "@types/react": "^19.0.1",
@@ -34,8 +34,8 @@
     "eslint": "^8.57.0",
     "typescript": "^5.5.4",
     "vite": "^5.1.4",
-    "@arronqzy/eslint-config": "0.0.0",
     "@arronqzy/tailwind": "1.0.2",
+    "@arronqzy/eslint-config": "0.0.0",
     "@arronqzy/typescript-config": "1.0.0"
   },
   "keywords": [],

package/src/BlueprintContextMenu.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useRef } from "react";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 export type BlueprintContextMenuState =
   | {

package/src/BlueprintNodeConfigSidebar.tsx

@@ -16,7 +16,7 @@ import {
   type PageLifecyclePhase,
   type ViewEventType,
 } from "@arronqzy/blueprint-dsl";
-import { useI18n } from "@arronqzy/i18n/react";
+import { EnsureI18nProvider, useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 import { FetchNodeConfigPanel } from "./components/FetchNodeConfigPanel";
 import { ClockNodeConfigPanel } from "./components/ClockNodeConfigPanel";
@@ -96,7 +96,15 @@ const ROLE_LABEL_KEYS: Record<BlueprintNodeRole, string> = {
   event: "blueprint.config.roleEvent",
 };
 
-export function BlueprintNodeConfigSidebar({
+export function BlueprintNodeConfigSidebar(props: BlueprintNodeConfigSidebarProps) {
+  return (
+    <EnsureI18nProvider>
+      <BlueprintNodeConfigSidebarInner {...props} />
+    </EnsureI18nProvider>
+  );
+}
+
+function BlueprintNodeConfigSidebarInner({
   node,
   graphNodes = [],
   graphEdges = [],

package/src/components/BlueprintExecutionLogPanel.tsx

@@ -20,7 +20,7 @@ import {
     type ExecutionTraceEntry,
   type PageLifecyclePhase,
 } from "@arronqzy/blueprint-dsl";
-import { useI18n } from "@arronqzy/i18n/react";
+import { EnsureI18nProvider, useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import { getLifecyclePhaseLabel } from "../graph/document";
 
 import type { ExecutionLogSettings } from "../library/execution-log-settings";
@@ -140,7 +140,15 @@ export type BlueprintExecutionLogPanelProps = {
   lifecyclePhase?: string;
 };
 
-export function BlueprintExecutionLogPanel({
+export function BlueprintExecutionLogPanel(props: BlueprintExecutionLogPanelProps) {
+  return (
+    <EnsureI18nProvider>
+      <BlueprintExecutionLogPanelInner {...props} />
+    </EnsureI18nProvider>
+  );
+}
+
+function BlueprintExecutionLogPanelInner({
   entries,
   settings,
   onUpdateSettings,

package/src/components/BlueprintLibrarySelect.tsx

@@ -7,7 +7,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@arronqzy/ui";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 import type { BlueprintLibraryListItem } from "../library/types";
 

package/src/components/BlueprintMetaDialog.tsx

@@ -11,7 +11,7 @@ import {
   Label,
   Textarea,
 } from "@arronqzy/ui";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 import type { BlueprintMetaDraft } from "../library/types";
 

package/src/components/BlueprintNodeSwitchTaskDialog.tsx

@@ -7,7 +7,7 @@ import {
   DialogHeader,
   DialogTitle,
 } from "@arronqzy/ui";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 export type BlueprintNodeSwitchTaskDialogProps = {
   open: boolean;

package/src/components/BlueprintPanelToolbar.tsx

@@ -18,7 +18,7 @@ import {
 import type { BlueprintLibraryListItem } from "../library/types";
 import type { LifecycleNodeOption } from "../hooks/useBlueprintDebugSession";
 import { type PageLifecyclePhase } from "@arronqzy/blueprint-dsl";
-import { useI18n } from "@arronqzy/i18n/react";
+import { EnsureI18nProvider, useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import { getLifecyclePhaseLabel } from "../graph/document";
 
 export type BlueprintRenameDialogProps = {
@@ -393,7 +393,15 @@ function LibraryRow({
   );
 }
 
-export function BlueprintPanelToolbar({
+export function BlueprintPanelToolbar(props: BlueprintPanelToolbarProps) {
+  return (
+    <EnsureI18nProvider>
+      <BlueprintPanelToolbarInner {...props} />
+    </EnsureI18nProvider>
+  );
+}
+
+function BlueprintPanelToolbarInner({
   items,
   activeId,
   currentBlueprintLabel,

package/src/components/ClockNodeConfigPanel.tsx

@@ -1,7 +1,7 @@
 import { useCallback, type ChangeEvent } from "react";
 import { Input } from "@arronqzy/ui";
 import type { ClockNodeConfig } from "@arronqzy/blueprint-dsl";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 import type { BlueprintGraphNode } from "../graph/document";
 import { resolveNodeClockConfig } from "../graph/document";

package/src/components/ConfigHintIcon.tsx

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import {
   Tooltip,
   TooltipContent,

package/src/components/FetchNodeConfigPanel.tsx

@@ -45,7 +45,7 @@ import {
   useFetchDebugTask,
   useSwaggerLoadTask,
 } from "../fetch-config-task-store";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 import { ConfigFieldLabel, ConfigHintIcon, ConfigSectionTitle } from "./ConfigHintIcon";
 import { FetchUrlAutocomplete } from "./FetchUrlAutocomplete";

package/src/components/FetchUrlAutocomplete.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useRef, useState } from "react";
 import { cn } from "@arronqzy/ui";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import {
   buildEndpointSuggestions,
   filterEndpointSuggestions,

package/src/components/JsonNodeConfigPanel.tsx

@@ -9,7 +9,7 @@ import {
   resolveFetchScopeAutocompleteRoot,
   validateJsonStringAllowingScope,
 } from "@arronqzy/blueprint-dsl";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 import type { BlueprintGraphEdge, BlueprintGraphNode } from "../graph/document";
 import { resolveNodeJsonConfig } from "../graph/document";

package/src/components/LogicNodeConfigPanel.tsx

@@ -1,7 +1,7 @@
 import { useCallback, useMemo, useState, type ChangeEvent } from "react";
 import { validateLogicSourceCode } from "@arronqzy/blueprint-dsl";
 import type { LogicNodeConfig } from "@arronqzy/blueprint-dsl";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 import type { BlueprintGraphNode } from "../graph/document";
 import { resolveNodeLogicConfig } from "../graph/document";

package/src/components/StorageKeyAutocomplete.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { cn } from "@arronqzy/ui";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import {
   filterStorageKeySuggestions,
   listBrowserStorageKeys,

package/src/components/StorageNodeConfigPanel.tsx

@@ -20,7 +20,7 @@ import {
   resolveFetchScopeAutocompleteRoot,
   uniqueStorageKinds,
 } from "@arronqzy/blueprint-dsl";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 import type { BlueprintGraphEdge, BlueprintGraphNode } from "../graph/document";
 import { resolveNodeStorageConfig } from "../graph/document";

package/src/components/ViewElementMultiSelect.tsx

@@ -12,7 +12,7 @@ import {
   PopoverContent,
   PopoverTrigger,
 } from "@arronqzy/ui";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 
 export type ViewElementMultiSelectOption = {
   id: string;

package/src/hooks/useBlueprintFlowState.ts

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useRef } from "react";
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import { toast } from "@arronqzy/ui";
 import {
   addEdge,

package/src/index.tsx

@@ -14,6 +14,7 @@ import {
   type Node,
   type Edge,
 } from "@xyflow/react";
+import { EnsureI18nProvider } from "@arronqzy/i18n/react";
 import "@xyflow/react/dist/style.css";
 import "./blueprint.css";
 
@@ -241,33 +242,35 @@ export const BluePrintReactRoot: FC<BluePrintReactRootProps> = ({
   const containerRef = useRef<HTMLDivElement>(null);
 
   return (
-    <div
-      ref={containerRef}
-      data-workspace-region="blueprint"
-      className="bp-canvas h-full w-full bg-background text-foreground"
-      style={{
-        width: "100%",
-        height: "100%",
-        minHeight: 0,
-        ...style,
-      }}
-    >
-      <BlueprintCanvasProvider
-        onSelectNode={onSelectNode}
-        onAbortClock={onAbortClock}
+    <EnsureI18nProvider>
+      <div
+        ref={containerRef}
+        data-workspace-region="blueprint"
+        className="bp-canvas h-full w-full bg-background text-foreground"
+        style={{
+          width: "100%",
+          height: "100%",
+          minHeight: 0,
+          ...style,
+        }}
       >
-        <ReactFlowProvider>
-          <BlueprintCanvas
-            containerRef={containerRef}
-            graph={graph}
-            onGraphChange={onGraphChange}
-            selectedNodeId={selectedNodeId}
-            executionOverlay={executionOverlay}
-            onSelectNode={onSelectNode}
-            libraryNameById={libraryNameById}
-          />
-        </ReactFlowProvider>
-      </BlueprintCanvasProvider>
-    </div>
+        <BlueprintCanvasProvider
+          onSelectNode={onSelectNode}
+          onAbortClock={onAbortClock}
+        >
+          <ReactFlowProvider>
+            <BlueprintCanvas
+              containerRef={containerRef}
+              graph={graph}
+              onGraphChange={onGraphChange}
+              selectedNodeId={selectedNodeId}
+              executionOverlay={executionOverlay}
+              onSelectNode={onSelectNode}
+              libraryNameById={libraryNameById}
+            />
+          </ReactFlowProvider>
+        </BlueprintCanvasProvider>
+      </div>
+    </EnsureI18nProvider>
   );
 };

package/src/nodes/AndFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import { Handle, Position, type NodeProps } from "@xyflow/react";
 import { cn } from "@arronqzy/ui";
 

package/src/nodes/BlueprintFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import type { NodeProps } from "@xyflow/react";
 
 import { resolveBlueprintNodeTypeLabel } from "../graph/document";

package/src/nodes/BlueprintNodeCard.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import { cn } from "@arronqzy/ui";
 
 export type BlueprintNodeCardProps = {

package/src/nodes/BlueprintNodeShell.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import { Handle, Position } from "@xyflow/react";
 import { cn } from "@arronqzy/ui";
 

package/src/nodes/ClockFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import type { NodeProps } from "@xyflow/react";
 import { cn } from "@arronqzy/ui";
 

package/src/nodes/EventFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import type { NodeProps } from "@xyflow/react";
 
 import { resolveBlueprintNodeTypeLabel } from "../graph/document";

package/src/nodes/FetchFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import type { NodeProps } from "@xyflow/react";
 
 import { resolveBlueprintNodeTypeLabel } from "../graph/document";

package/src/nodes/JsonFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import type { NodeProps } from "@xyflow/react";
 
 import { resolveBlueprintNodeTypeLabel } from "../graph/document";

package/src/nodes/LifecycleFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import { Handle, Position, type NodeProps } from "@xyflow/react";
 import { cn } from "@arronqzy/ui";
 

package/src/nodes/LogicFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import type { NodeProps } from "@xyflow/react";
 
 import { resolveBlueprintNodeTypeLabel } from "../graph/document";

package/src/nodes/StorageFlowNode.tsx

@@ -1,4 +1,4 @@
-import { useI18n } from "@arronqzy/i18n/react";
+import { useI18nOptional as useI18n } from "@arronqzy/i18n/react";
 import type { NodeProps } from "@xyflow/react";
 
 import { resolveBlueprintNodeTypeLabel } from "../graph/document";