refactor init functions parameters

packages/arco-lib/src/examples/DemoWrapper/index.tsx

@@ -33,13 +33,9 @@ const codeStyle = css`
 
 export const DemoWrapper: React.FC<Props> = props => {
   const { application } = props;
-  const ui = initSunmaoUI();
+  const { App } = initSunmaoUI({ libs: [ArcoDesignLib] });
   const [isShowCode, setIsShowCode] = useState(false);
 
-  const App = ui.App;
-  const registry = ui.registry;
-  registry.installLib(ArcoDesignLib);
-
   const sunmaoApp = <App options={application} debugEvent={false} debugStore={false} />;
 
   const codeArea = (

packages/editor/__tests__/sevices.ts

@@ -1,3 +1,5 @@
 import { initSunmaoUIEditor } from '../src';
 import { sunmaoChakraUILib } from '@sunmao-ui/chakra-ui-lib';
-export const { registry } = initSunmaoUIEditor({ libs: [sunmaoChakraUILib] });
+export const { registry } = initSunmaoUIEditor({
+  runtimeProps: { libs: [sunmaoChakraUILib] },
+});

packages/editor/src/components/Editor.tsx

@@ -21,7 +21,7 @@ import { ComponentForm } from './ComponentForm';
 import ErrorBoundary from './ErrorBoundary';
 import { PreviewModal } from './PreviewModal';
 import { WarningArea } from './WarningArea';
-import { EditorServices, UIPros } from '../types';
+import { EditorServices } from '../types';
 import { css } from '@emotion/css';
 import { EditorMaskWrapper } from './EditorMaskWrapper';
 import { DataForm } from './DataSource/DataForm';
@@ -39,7 +39,6 @@ type Props = {
   services: EditorServices;
   libs: SunmaoLib[];
   onRefresh: () => void;
-  uiProps: UIPros;
 };
 
 const ApiFormStyle = css`
@@ -52,7 +51,7 @@ const ApiFormStyle = css`
 `;
 
 export const Editor: React.FC<Props> = observer(
-  ({ App, registry, stateStore, services, libs, uiProps, onRefresh: onRefreshApp }) => {
+  ({ App, registry, stateStore, services, libs, onRefresh: onRefreshApp }) => {
     const { eventBus, editorStore } = services;
     const {
       components,
@@ -201,7 +200,7 @@ export const Editor: React.FC<Props> = observer(
                 display="flex"
                 flexDirection="column"
                 textAlign="left"
-                lazyBehavior={uiProps.explorerMenuLazyBehavior}
+                lazyBehavior='keepMounted'
                 isLazy
                 index={explorerMenuTab}
                 onChange={activatedTab => {

packages/editor/src/components/PreviewModal/PreviewModal.tsx

@@ -13,9 +13,8 @@ type Props = {
 };
 
 export const PreviewModal: React.FC<Props> = ({ app, modules, libs, onClose }) => {
-  const { App, registry } = initSunmaoUI();
+  const { App, registry } = initSunmaoUI({libs});
   modules.forEach(m => registry.registerModule(createModule(m)));
-  libs.forEach(lib => registry.installLib(lib));
 
   return (
     <GeneralModal onClose={onClose} title="Preview Modal">

packages/editor/src/init.tsx

@@ -1,5 +1,5 @@
 import { Editor as _Editor } from './components/Editor';
-import { initSunmaoUI, SunmaoLib, SunmaoUIRuntimeProps } from '@sunmao-ui/runtime';
+import { initSunmaoUI, SunmaoUIRuntimeProps } from '@sunmao-ui/runtime';
 import { AppModelManager } from './operations/AppModelManager';
 import React, { useState, useCallback } from 'react';
 import {
@@ -15,19 +15,17 @@ import {
 } from '@chakra-ui/react';
 import { initEventBus } from './services/eventBus';
 import { EditorStore } from './services/EditorStore';
-import { StorageHandler, UIPros } from './types';
+import { StorageHandler } from './types';
 import { AppStorage } from './services/AppStorage';
 import { Application, Module } from '@sunmao-ui/core';
 import './styles.css';
 
 type SunmaoUIEditorProps = {
-  libs?: SunmaoLib[];
   widgets?: ImplementedWidget<any>[];
   runtimeProps?: SunmaoUIRuntimeProps;
   storageHandler?: StorageHandler;
   defaultApplication?: Application;
   defaultModules?: Module[];
-  uiProps?: UIPros;
 };
 
 export function initSunmaoUIEditor(props: SunmaoUIEditorProps = {}) {
@@ -68,10 +66,6 @@ export function initSunmaoUIEditor(props: SunmaoUIEditorProps = {}) {
   const App = ui.App;
   const registry = ui.registry;
 
-  props.libs?.forEach(lib => {
-    registry.installLib(lib);
-  });
-
   const stateManager = ui.stateManager;
   const eventBus = initEventBus();
   const appStorage = new AppStorage(
@@ -113,9 +107,8 @@ export function initSunmaoUIEditor(props: SunmaoUIEditorProps = {}) {
           registry={registry}
           stateStore={store}
           services={services}
-          libs={props.libs || []}
+          libs={props.runtimeProps?.libs || []}
           onRefresh={onRefresh}
-          uiProps={props.uiProps || {}}
         />
       </ChakraProvider>
     );

packages/editor/src/main.tsx

@@ -16,7 +16,6 @@ type Options = Partial<{
 
 const lsManager = new LocalStorageManager();
 const { Editor, registry } = initSunmaoUIEditor({
-  libs: [sunmaoChakraUILib, ArcoDesignLib],
   widgets: [...chakraWidgets],
   storageHandler: {
     onSaveApp(app) {
@@ -28,8 +27,8 @@ const { Editor, registry } = initSunmaoUIEditor({
   },
   defaultApplication: lsManager.getAppFromLS(),
   defaultModules: lsManager.getModulesFromLS(),
-  uiProps: {
-    explorerMenuLazyBehavior: 'keepMounted',
+  runtimeProps: {
+    libs: [sunmaoChakraUILib, ArcoDesignLib],
   },
 });
 

packages/editor/src/playground.tsx

@@ -18,7 +18,7 @@ type Example = {
 const Playground: React.FC<{ examples: Example[] }> = ({ examples }) => {
   const [example, setExample] = useState<Example | null>(examples[0]);
   const { Editor, registry } = initSunmaoUIEditor({
-    libs: [sunmaoChakraUILib],
+    runtimeProps: { libs: [sunmaoChakraUILib] },
     defaultApplication: example?.value.app,
   });
   example?.value.modules?.forEach(m => registry.registerModule(m));

packages/editor/src/types.ts

@@ -22,7 +22,3 @@ export type StorageHandler = {
   onSaveApp?: (app: Application) => void;
   onSaveModules?: (module: Module[]) => void;
 };
-
-export type UIPros = {
-  explorerMenuLazyBehavior?: 'keepMounted' | 'unmount'
-}

packages/runtime/src/index.ts

@@ -1,10 +1,10 @@
 import { StateManager } from './services/StateManager';
 import { genApp } from './App';
-import { initRegistry } from './services/Registry';
+import { initRegistry, SunmaoLib } from './services/Registry';
 import { initApiService } from './services/apiService';
 import { initGlobalHandlerMap } from './services/handler';
 import { UtilMethodManager } from './services/UtilMethodManager';
-import { AppHooks, UtilMethod } from './types';
+import { AppHooks } from './types';
 import { enableES5, setAutoFreeze } from 'immer';
 import './style.css';
 
@@ -14,8 +14,8 @@ enableES5();
 setAutoFreeze(false);
 
 export type SunmaoUIRuntimeProps = {
+  libs?: SunmaoLib[];
   dependencies?: Record<string, any>;
-  utilMethods?: UtilMethod<any>[];
   hooks?: AppHooks;
 };
 
@@ -59,11 +59,16 @@ export * from './utils/buildKit';
 export * from './types';
 export * from './constants';
 export * from './traits/core';
-export { type RegistryInterface, type SunmaoLib } from './services/Registry';
-export { ExpressionError, type StateManagerInterface } from './services/StateManager';
+export type { RegistryInterface, SunmaoLib } from './services/Registry';
+export { ExpressionError } from './services/StateManager';
+export type { StateManagerInterface } from './services/StateManager';
 export { ModuleRenderer } from './components/_internal/ModuleRenderer';
 export { default as Text, TextPropertySpec } from './components/_internal/Text';
-export { EventHandlerSpec, EventCallBackHandlerSpec, ModuleSpec } from '@sunmao-ui/shared';
+export {
+  EventHandlerSpec,
+  EventCallBackHandlerSpec,
+  ModuleSpec,
+} from '@sunmao-ui/shared';
 
 // TODO: check this export
 export { watch } from './utils/watchReactivity';