fix: 调整一些类型声明

Author: 1ncounter

packages/react-renderer/src/components/app.tsx

@@ -1,33 +1,14 @@
-import { isLowCodeComponentSchema } from '@alilc/lowcode-shared';
 import { useRenderContext } from '../context/render';
-import { createComponentBySchema, ReactComponent } from '../runtime';
+import { getComponentByName } from '../runtime';
 import Route from './route';
 import { rendererExtends } from '../plugin';
 
 export default function App() {
-  const { schema, packageManager } = useRenderContext();
+  const renderContext = useRenderContext();
+  const { schema } = renderContext;
   const appWrappers = rendererExtends.getAppWrappers();
   const wrappers = rendererExtends.getRouteWrappers();
 
-  function getLayoutComponent() {
-    const config = schema.get('config');
-    const componentName = config?.layout?.componentName as string;
-
-    if (componentName) {
-      const Component = packageManager.getComponent<ReactComponent>(componentName);
-
-      if (isLowCodeComponentSchema(Component)) {
-        return createComponentBySchema(Component.schema, {
-          displayName: componentName,
-        });
-      }
-
-      return Component;
-    }
-  }
-
-  const Layout = getLayoutComponent();
-
   let element = <Route />;
 
   if (wrappers.length > 0) {
@@ -36,9 +17,16 @@ export default function App() {
     }, element);
   }
 
-  if (Layout) {
-    const layoutProps: any = schema.get('config')?.layout?.props ?? {};
-    element = <Layout {...layoutProps}>{element}</Layout>;
+  const layoutConfig = schema.get('config')?.layout;
+
+  if (layoutConfig) {
+    const componentName = layoutConfig.componentName as string;
+    const Layout = getComponentByName(componentName, renderContext);
+
+    if (Layout) {
+      const layoutProps: any = layoutConfig.props ?? {};
+      element = <Layout {...layoutProps}>{element}</Layout>;
+    }
   }
 
   if (appWrappers.length > 0) {

packages/react-renderer/src/index.ts

@@ -4,5 +4,6 @@ export { defineRendererPlugin } from './plugin';
 export * from './context/render';
 export * from './context/router';
 
+export type { Spec, ProCodeComponent, LowCodeComponent } from '@alilc/lowcode-shared';
 export type { PackageLoader, CodeScope, Plugin } from '@alilc/lowcode-renderer-core';
 export type { RendererExtends } from './plugin';

packages/react-renderer/src/runtime/index.tsx

@@ -53,15 +53,34 @@ export interface LowCodeComponentProps {
 
 const lowCodeComponentsCache = new Map<string, ReactComponent>();
 
-function getComponentByName(name: string, { packageManager }: RenderContext): ReactComponent {
+export function getComponentByName(
+  name: string,
+  { packageManager, boostsManager }: RenderContext,
+): ReactComponent {
   const componentsRecord = packageManager.getComponentsNameRecord<ReactComponent>();
   // read cache first
   const result = lowCodeComponentsCache.get(name) || componentsRecord[name];
 
   invariant(result, `${name} component not found in componentsRecord`);
 
   if (isLowCodeComponentSchema(result)) {
-    const lowCodeComponent = createComponentBySchema(result.schema, {
+    const { componentsMap, componentsTree, utils, i18n } = result.schema;
+
+    if (componentsMap.length > 0) {
+      packageManager.resolveComponentMaps(componentsMap);
+    }
+
+    const boosts = boostsManager.toExpose();
+
+    utils?.forEach((util) => boosts.util.add(util));
+
+    if (i18n) {
+      Object.keys(i18n).forEach((locale) => {
+        boosts.intl.addTranslations(locale, i18n[locale]);
+      });
+    }
+
+    const lowCodeComponent = createComponentBySchema(componentsTree[0], {
       displayName: name,
     });
 

packages/shared/src/types/material.ts

@@ -1,14 +1,14 @@
 import { Package } from './specs/asset-spec';
-import { ComponentTree } from './specs/lowcode-spec';
+import { Project } from './specs/lowcode-spec';
 
 export interface ProCodeComponent extends Package {
   package: string;
   type: 'proCode';
 }
 
-export interface LowCodeComponent extends Omit<Package, 'schema'> {
+export interface LowCodeComponent extends Package {
   id: string;
   type: 'lowCode';
   componentName: string;
-  schema: ComponentTree;
+  schema: Project;
 }

packages/shared/src/types/specs/asset-spec.ts

@@ -28,15 +28,15 @@ export interface Package {
   /**
    * 组件多个渲染态视图打包后的 CDN url 列表，包含 js 和 css，优先级高于 urls
    */
-  advancedUrls?: ComplexUrls;
+  advancedUrls?: MultiModeUrls;
   /**
    * 组件编辑态视图打包后的 CDN url 列表，包含 js 和 css
    */
   editUrls?: string[];
   /**
    * 组件多个编辑态视图打包后的 CDN url 列表，包含 js 和 css，优先级高于 editUrls
    */
-  advancedEditUrls?: ComplexUrls;
+  advancedEditUrls?: MultiModeUrls;
   /**
    * 低代码组件的 schema 内容
    */
@@ -79,11 +79,6 @@ export interface Package {
   exportSourceLibrary?: string;
 }
 
-/**
- * 复杂 urls 结构，同时兼容简单结构和多模态结构
- */
-export type ComplexUrls = string[] | MultiModeUrls;
-
 /**
  * 多模态资源
  */