@fe-free/core 2.2.16 → 2.3.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @fe-free/core
 
+## 2.3.0
+
+### Minor Changes
+
+- feat: add CoreApp
+
+### Patch Changes
+
+- @fe-free/tool@2.3.0
+
 ## 2.2.16
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fe-free/core",
-  "version": "2.2.16",
+  "version": "2.3.0",
   "description": "",
   "main": "./src/index.ts",
   "author": "",
@@ -41,7 +41,7 @@
     "remark-gfm": "^4.0.1",
     "vanilla-jsoneditor": "^0.23.1",
     "zustand": "^4.5.4",
-    "@fe-free/tool": "2.2.16"
+    "@fe-free/tool": "2.3.0"
   },
   "peerDependencies": {
     "@ant-design/pro-components": "2.8.9",

package/src/core_app/core_app.stories.tsx

@@ -0,0 +1,29 @@
+import { CoreApp } from '@fe-free/core';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+
+const meta: Meta = {
+  title: '@fe-free/core/CoreApp',
+  component: CoreApp,
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      description: {
+        component: `
+CoreApp 组件
+- 封装常用 ProConfigProvider
+- 封装常用 ConfigProvider
+- 封装常用 APP
+- 封装常用 Router
+- 提供了 @fe-core/app 初始化能力
+`,
+      },
+    },
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {
+  render: () => <div>hello world</div>,
+};

package/src/core_app/index.tsx

@@ -0,0 +1,59 @@
+import { ProConfigProvider } from '@ant-design/pro-components';
+import { App, ConfigProvider } from 'antd';
+import zhCN from 'antd/locale/zh_CN';
+import { useEffect, useMemo } from 'react';
+import { BrowserRouter as Router, useNavigate } from 'react-router-dom';
+import { routeTool } from '../route';
+import { customValueTypeMap } from '../value_type_map';
+
+function SetRouteTool({ basename }: { basename: string }) {
+  const navigate = useNavigate();
+
+  // 立马设置
+  useMemo(() => {
+    routeTool.setNavigate(navigate);
+    routeTool.setBaseName(basename);
+  }, [navigate, basename]);
+
+  useEffect(() => {
+    // 首页，且 basename 不是 /，一定是要去到 basename 的
+    if (location.pathname === '/' && basename !== '/') {
+      location.href = basename;
+    }
+  }, []);
+
+  return null;
+}
+
+/** 提供一些基础的组 APP 功能 */
+function CoreApp(props: {
+  basename: string;
+  proConfigProviderProps?: React.ComponentProps<typeof ProConfigProvider>;
+  configProviderProps?: React.ComponentProps<typeof ConfigProvider>;
+  appProps?: React.ComponentProps<typeof App>;
+  routerProps?: Partial<React.ComponentProps<typeof Router>>;
+  children: React.ReactNode;
+}) {
+  const { basename, children, proConfigProviderProps, configProviderProps, appProps, routerProps } =
+    props;
+
+  return (
+    <ProConfigProvider
+      {...proConfigProviderProps}
+      // 集成好 customValueTypeMap
+      valueTypeMap={{ ...customValueTypeMap, ...proConfigProviderProps?.valueTypeMap }}
+    >
+      {/* 集成好 locale */}
+      <ConfigProvider {...configProviderProps} locale={configProviderProps?.locale || zhCN}>
+        <App {...appProps}>
+          <Router {...routerProps} basename={basename}>
+            <SetRouteTool basename={basename} />
+            {children}
+          </Router>
+        </App>
+      </ConfigProvider>
+    </ProConfigProvider>
+  );
+}
+
+export { CoreApp };

package/src/index.ts

@@ -5,6 +5,7 @@ export { useGlobalRequest } from './ahooks/use_global_request';
 export { LoadingButton } from './button';
 export { Copy } from './copy';
 export type { CopyProps } from './copy';
+export { CoreApp } from './core_app';
 export { CRUD, CRUDDetail, CRUDOfSimple, OperateDelete, useDelete } from './crud';
 export type { CRUDDetailProps, CRUDMethods, CRUDOfSimpleProps, CRUDProps } from './crud';
 export { Editor } from './editor';