@arronqzy/react-view 1.0.18 → 1.0.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arronqzy/react-view",
-  "version": "1.0.18",
+  "version": "1.0.19",
   "files": [
     "src",
     "dist",
@@ -33,11 +33,11 @@
     "@arronqzy/ui": "1.0.6",
     "@arronqzy/blueprint-dsl": "1.0.9",
     "@arronqzy/i18n": "0.1.7",
-    "@arronqzy/rx-store": "1.0.5",
     "@arronqzy/view-scene3d": "0.1.2",
+    "@arronqzy/react-blueprint": "1.0.11",
+    "@arronqzy/rx-store": "1.0.5",
     "@arronqzy/view-table": "0.1.5",
-    "@arronqzy/webllm-assistant": "0.1.9",
-    "@arronqzy/react-blueprint": "1.0.11"
+    "@arronqzy/webllm-assistant": "0.1.9"
   },
   "devDependencies": {
     "@types/react": "^19.0.1",
@@ -46,8 +46,8 @@
     "eslint": "^8.57.0",
     "typescript": "^5.5.4",
     "@arronqzy/eslint-config": "0.0.0",
-    "@arronqzy/typescript-config": "1.0.0",
-    "@arronqzy/tailwind": "1.0.2"
+    "@arronqzy/tailwind": "1.0.2",
+    "@arronqzy/typescript-config": "1.0.0"
   },
   "scripts": {
     "lint": "eslint \"src/**/*.{ts,tsx}\"",

package/src/panel/I18nRoot.tsx

@@ -0,0 +1,21 @@
+import { I18nProvider } from "@arronqzy/i18n/react";
+import type { Locale } from "@arronqzy/i18n";
+import type { ReactNode } from "react";
+
+export type I18nRootProps = {
+  children: ReactNode;
+  locale?: Locale | null;
+  onLocaleChange?: (locale: Locale) => void;
+};
+
+/** Ensures panel / preview subtree always has i18n context (host apps, duplicate package graphs). */
+export function I18nRoot({ children, locale, onLocaleChange }: I18nRootProps) {
+  return (
+    <I18nProvider locale={locale} onLocaleChange={onLocaleChange}>
+      {children}
+    </I18nProvider>
+  );
+}
+
+export { I18nProvider } from "@arronqzy/i18n/react";
+export type { Locale } from "@arronqzy/i18n";

package/src/panel/ReactViewOnlinePreview.tsx

@@ -1,5 +1,6 @@
 import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { useI18n } from "@arronqzy/i18n/react";
+import type { Locale } from "@arronqzy/i18n";
 import {
   BlueprintGraph,
   documentToRunnableGraph,
@@ -41,6 +42,7 @@ import {
 import { applyPreviewSceneFill, readOutputScale } from "./utils/outputScale";
 import { capturePreviewSceneElement } from "./library/capture-preview-snapshot";
 import { registerPreviewSnapshotProvider } from "./library/preview-snapshot";
+import { I18nRoot } from "./I18nRoot";
 
 const PREVIEW_BOOT_PHASES: PageLifecyclePhase[] = ["mounted"];
 
@@ -50,6 +52,8 @@ export type ReactViewOnlinePreviewProps = {
   previewInstanceId?: string;
   /** 直接传入完整工作区数据，用于外部持久化后预览 */
   workspace?: WorkspaceProjectRecord | null;
+  locale?: Locale | null;
+  onLocaleChange?: (locale: Locale) => void;
 };
 
 function applyTitleIcon(titleIconDataUrl?: string) {
@@ -71,6 +75,18 @@ async function loadWorkspaceRecord(projectId: string): Promise<WorkspaceProjectR
 }
 
 export function ReactViewOnlinePreview({
+  locale,
+  onLocaleChange,
+  ...rest
+}: ReactViewOnlinePreviewProps) {
+  return (
+    <I18nRoot locale={locale} onLocaleChange={onLocaleChange}>
+      <ReactViewOnlinePreviewInner {...rest} />
+    </I18nRoot>
+  );
+}
+
+function ReactViewOnlinePreviewInner({
   projectId,
   previewInstanceId,
   workspace = null,

package/src/panel/ReactViewPanel.tsx

@@ -1,5 +1,6 @@
 import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useI18n } from "@arronqzy/i18n/react";
+import type { Locale } from "@arronqzy/i18n";
 import type { State } from "@arronqzy/rx-store";
 import type { PanelElement } from "./types";
 
@@ -78,6 +79,7 @@ import {
   useViewScopeStoreVersion,
 } from "./scope/view-scope-store";
 import { resolvePanelElementScope } from "./utils/scope-template";
+import { I18nRoot } from "./I18nRoot";
 import { getPanelMessages } from "./constants/messages";
 import { PANEL_Z_INDEX } from "./constants/zIndex";
 import { useRafThrottledScroll } from "./hooks/useRafThrottledScroll";
@@ -362,9 +364,12 @@ export type ReactViewPanelProps = {
   className?: string;
   /** 外部传入的完整工作区数据，挂载后自动渲染 */
   initialWorkspace?: WorkspaceProjectRecord | null;
+  /** 界面语言；省略时按 localStorage / 浏览器语言解析 */
+  locale?: Locale | null;
+  onLocaleChange?: (locale: Locale) => void;
 };
 
-export function ReactViewPanel({
+function ReactViewPanelInner({
   initialZoom = 1,
   className,
   initialWorkspace = null,
@@ -3578,3 +3583,15 @@ export function ReactViewPanel({
     </div>
   );
 }
+
+export function ReactViewPanel({
+  locale,
+  onLocaleChange,
+  ...rest
+}: ReactViewPanelProps) {
+  return (
+    <I18nRoot locale={locale} onLocaleChange={onLocaleChange}>
+      <ReactViewPanelInner {...rest} />
+    </I18nRoot>
+  );
+}

package/src/panel/index.tsx

@@ -1,3 +1,5 @@
 export * from "./ReactViewPanel";
 export * from "./ReactViewOnlinePreview";
+export { I18nRoot, I18nProvider } from "./I18nRoot";
+export type { I18nRootProps, Locale } from "./I18nRoot";
 export type * from "./types";