🐛 fix(use-proeditor): 修正 togglePanelExpand 方法缺失的 bug

src/ProEditor/hooks/useProEditor.test.ts

@@ -8,14 +8,28 @@ describe('useProEditor', () => {
     } = renderHook(() => useProEditor<{ name: string }>(), {
       wrapper: ProEditorProvider,
     });
-    expect(instance).toHaveProperty('getViewport');
-    expect(instance).toHaveProperty('setViewport');
+
+    expect(instance).toHaveProperty('getProps');
     expect(instance).toHaveProperty('getConfig');
     expect(instance).toHaveProperty('setConfig');
-    expect(instance).toHaveProperty('getProps');
-    expect(instance).toHaveProperty('getEditorAwareness');
+    expect(instance).toHaveProperty('exportConfig');
+    expect(instance).toHaveProperty('resetConfig');
+
+    expect(instance).toHaveProperty('getViewport');
+    expect(instance).toHaveProperty('setViewport');
+
     expect(instance).toHaveProperty('getCanvasInteraction');
     expect(instance).toHaveProperty('setCanvasInteraction');
+    expect(instance).toHaveProperty('deselectCanvas');
+
+    expect(instance).toHaveProperty('undo');
+    expect(instance).toHaveProperty('redo');
+    expect(instance).toHaveProperty('undoStack');
+    expect(instance).toHaveProperty('redoStack');
+
+    expect(instance).toHaveProperty('getEditorAwareness');
+
+    expect(instance).toHaveProperty('togglePanelExpand');
 
     expect(instance).not.toHaveProperty('props');
     expect(instance).not.toHaveProperty('config');

src/ProEditor/hooks/useProEditor.ts

@@ -2,13 +2,43 @@ import { useMemoizedFn } from 'ahooks';
 import { useMemo } from 'react';
 import { Viewport } from 'reactflow';
 
-import { AwarenessEditor, PublicProEditorStore, useStoreApi } from '../store';
+import { AwarenessPublicAction } from '@/ProEditor/store/slices/awareness';
+import { CanvasPublicAction } from '@/ProEditor/store/slices/canvas';
+import { ConfigPublicAction } from '@/ProEditor/store/slices/config';
+import { ConfigPanelPublicAction } from '@/ProEditor/store/slices/configPanel';
+import { GeneralPublicAction } from '@/ProEditor/store/slices/general';
+import { AwarenessEditor, useStoreApi } from '../store';
 
-export interface ProEditorInstance<Config = any, Props = any> extends PublicProEditorStore {
-  // 提供 get 方法来拿最新值
+/**
+ * ProEditor 实例对象
+ * @template Config - 配置信息的类型
+ * @template Props - 组件属性的类型
+ */
+export interface ProEditorInstance<Config = any, Props = any>
+  extends CanvasPublicAction,
+    ConfigPanelPublicAction,
+    ConfigPublicAction,
+    GeneralPublicAction,
+    AwarenessPublicAction {
+  /**
+   * 获取编辑器的 Awareness 对象
+   * @returns {AwarenessEditor} - 编辑器的 Awareness 对象
+   */
   getEditorAwareness: () => AwarenessEditor;
+  /**
+   * 获取当前视口信息
+   * @returns {Viewport} - 当前视口信息
+   */
   getViewport: () => Viewport;
+  /**
+   * 获取配置信息
+   * @returns {Config} - 配置信息
+   */
   getConfig: () => Config;
+  /**
+   * 获取组件属性
+   * @returns {Props} - 组件属性
+   */
   getProps: () => Props;
 }
 
@@ -26,6 +56,7 @@ export const useProEditor = <T>(): ProEditorInstance<T> => {
     undo,
     redo,
     setCanvasInteraction,
+    togglePanelExpand,
   } = storeApi.getState();
 
   const getViewport = useMemoizedFn(() => storeApi.getState().editorAwareness.viewport);
@@ -55,6 +86,8 @@ export const useProEditor = <T>(): ProEditorInstance<T> => {
 
       getProps,
       getEditorAwareness,
+
+      togglePanelExpand,
     }),
     [],
   );

src/ProEditor/index.ts

@@ -9,8 +9,7 @@ export * from './hooks/useProEditor';
 
 export {
   EditorMode,
-  isDesignModeSelector,
   storeSelectors as proEditorSelectors,
   useStore as useProEditorStore,
 } from './store';
-export type { AwarenessEditor, PublicProEditorStore as ProEditorStore } from './store';
+export type { AwarenessEditor, InternalProEditorStore as ProEditorStore } from './store';

src/ProEditor/store/createStore.ts

@@ -3,21 +3,11 @@ import { create } from 'zustand';
 import { optionalDevtools } from 'zustand-utils';
 import { DevtoolsOptions } from 'zustand/middleware';
 
-import {
-  AwarenessPublicAction,
-  AwarenessSlice,
-  AwarenessSliceState,
-  awarenessSlice,
-} from './slices/awareness';
-import { CanvasPublicAction, CanvasSlice, PublicCanvasState, canvasSlice } from './slices/canvas';
-import { ConfigPublicAction, ConfigPublicState, ConfigSlice, configSlice } from './slices/config';
+import { AwarenessSlice, AwarenessSliceState, awarenessSlice } from './slices/awareness';
+import { CanvasSlice, PublicCanvasState, canvasSlice } from './slices/canvas';
+import { ConfigPublicState, ConfigSlice, configSlice } from './slices/config';
 import { ConfigPanelSlice, configPanelSlice } from './slices/configPanel';
-import {
-  GeneralPublicAction,
-  GeneralSlice,
-  GeneralSliceState,
-  generalSlice,
-} from './slices/general';
+import { GeneralSlice, GeneralSliceState, generalSlice } from './slices/general';
 
 /**
  * ProEditorState 接口描述编辑器状态
@@ -36,13 +26,6 @@ export type InternalProEditorStore = ProEditorState &
   AwarenessSlice &
   GeneralSlice;
 
-export type PublicProEditorStore = CanvasPublicAction &
-  ConfigPublicAction &
-  GeneralPublicAction &
-  AwarenessPublicAction;
-
-export type ProEditorStoreKey = keyof InternalProEditorStore;
-
 const vanillaStore: StateCreator<InternalProEditorStore, [['zustand/devtools', never]]> = (
   ...params
 ) => ({

src/ProEditor/store/index.ts

@@ -8,7 +8,7 @@ const { Provider, useStore, useStoreApi } = createContext<StoreApi<InternalProEd
 
 export { Provider, createStore, useStore, useStoreApi };
 
-export type { ProEditorState, ProEditorStoreKey, PublicProEditorStore } from './createStore';
+export type { InternalProEditorStore, ProEditorState } from './createStore';
 
 export * from './selectors';
 export type { AwarenessEditor } from './slices/awareness';