@fe-free/core 6.0.8 → 6.0.9

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @fe-free/core
 
+## 6.0.9
+
+### Patch Changes
+
+- fix: tabs
+  - @fe-free/icons@6.0.9
+  - @fe-free/tool@6.0.9
+
 ## 6.0.8
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fe-free/core",
-  "version": "6.0.8",
+  "version": "6.0.9",
   "description": "React 业务核心组件库：CRUD、ProForm 扩展、布局、路由、树、上传等（Antd + ProComponents）",
   "license": "ISC",
   "author": "",
@@ -43,8 +43,8 @@
     "i18next-icu": "^2.4.1",
     "react": "^19.2.0",
     "react-i18next": "^16.4.0",
-    "@fe-free/icons": "6.0.8",
-    "@fe-free/tool": "6.0.8"
+    "@fe-free/icons": "6.0.9",
+    "@fe-free/tool": "6.0.9"
   },
   "scripts": {
     "i18n-extract": "rm -rf ./src/locales/zh-CN && npx i18next-cli extract"

package/src/crud_of_list/index.tsx

@@ -3,8 +3,10 @@ import { Input } from 'antd';
 import classNames from 'classnames';
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
+
 import type { CRUDProps } from '../crud';
 import { CRUD } from '../crud';
+
 import './style.scss';
 
 // eslint-disable-next-line @typescript-eslint/no-empty-object-type
@@ -35,7 +37,7 @@ function useTips(props) {
         ),
       );
     }
-  }, [t]);
+  }, [t]); // eslint-disable-line react-hooks/exhaustive-deps
 }
 
 function SearchRender(props: {
@@ -91,7 +93,7 @@ function CRUDOfList(props: CRUDOfListProps) {
 
   const newParams = useMemo(() => {
     return {
-      ...(tableProps.params || {}),
+      ...tableProps.params,
       [searchDataIndex]: debouncedSearchValue,
     };
   }, [debouncedSearchValue, searchDataIndex, tableProps.params]);

package/src/page_layout/index.tsx

@@ -1,3 +1,4 @@
+import type { TabsProps as AntdTabsProps } from 'antd';
 import classNames from 'classnames';
 import { Fragment, useMemo } from 'react';
 import { useSearchParams } from 'react-router-dom';
@@ -94,47 +95,55 @@ function PageLayout({
 }
 
 interface PageLayoutTabsProps extends PageLayoutProps {
-  tabsProps: Omit<TabsProps, 'items' | 'withSearchParams'> & {
-    items: {
-      key: string;
-      label: React.ReactNode;
-      children: React.ReactNode;
-    }[];
+  tabsProps: Omit<TabsProps, 'withSearchParams' | 'tabsProps'> & {
+    tabsProps: Omit<AntdTabsProps, 'items'> & {
+      items: {
+        key: string;
+        label: React.ReactNode;
+        children: React.ReactNode;
+      }[];
+    };
   };
 }
 
 function PageLayoutTabs(props: PageLayoutTabsProps) {
   const { tabsProps, ...rest } = props;
+  const { tabsProps: antdTabsProps, ...tabsPropsRest } = tabsProps;
+  const { items: antdItems, ...antdTabsPropsRest } = antdTabsProps;
 
   const [searchParams] = useSearchParams();
   const tab = searchParams.get(tabsProps.tabKey || 'tab') || undefined;
 
   const { children, newItems } = useMemo(() => {
-    const items = props.tabsProps.items;
+    const items = antdItems ?? [];
 
-    const item = items.find((item) => item.key === tab);
-    const children = item?.children || items[0]?.children;
+    const item = items.find((v) => v.key === tab);
+    const child = item?.children || items[0]?.children;
 
-    const newItems = items.map((item) => ({
-      ...item,
-      children: undefined,
-    }));
-
-    return { children, newItems };
-  }, [props.tabsProps.items, tab]);
+    return {
+      children: child,
+      newItems: items.map((v) => ({
+        ...v,
+        children: undefined,
+      })),
+    };
+  }, [antdItems, tab]);
 
   return (
     <PageLayout
       direction="vertical"
       start={
         <Tabs
-          tabBarExtraContent={{
-            left: <div className="w-4" />,
-            right: <div className="w-4" />,
+          tabsProps={{
+            tabBarExtraContent: {
+              left: <div className="w-4" />,
+              right: <div className="w-4" />,
+            },
+            ...antdTabsPropsRest,
+            items: newItems,
           }}
-          {...tabsProps}
-          items={newItems}
           withSearchParams
+          {...tabsPropsRest}
         />
       }
       {...rest}

package/src/page_layout/page_layout_tabs.stories.tsx

@@ -0,0 +1,17 @@
+import { PageLayoutTabs } from '@fe-free/core';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+
+const meta: Meta<typeof PageLayoutTabs> = {
+  title: '@fe-free/core/PageLayoutTabs',
+  component: PageLayoutTabs,
+  tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<typeof PageLayoutTabs>;
+
+export const Default: Story = {
+  render: () => {
+    return <div>依赖 react-router-dom 的 Route 组件，暂不提供 demo</div>;
+  },
+};

package/src/tabs/index.tsx

@@ -12,15 +12,15 @@ interface TabsProps {
   withSearchParams?: boolean;
   /** 设置 searchParams 的类型，默认 set */
   searchParamsType?: 'set' | 'change';
-  /** 默认 tab */
+  /** url 上字段的名字，默认 tab */
   tabKey?: string;
-
-  tabProps?: AntdTabsProps;
+  /** antd Tabs 的 props */
+  tabsProps?: AntdTabsProps;
 }
 
 function Tabs(props: TabsProps) {
-  const { withSearchParams, searchParamsType = 'set', tabKey = 'tab', tabProps } = props;
-  const { className, activeKey, onChange, ...rest } = tabProps || {};
+  const { withSearchParams, searchParamsType = 'set', tabKey = 'tab', tabsProps } = props;
+  const { className, activeKey, onChange, ...rest } = tabsProps || {};
 
   const [searchParams] = useSearchParams();
   const tab = searchParams.get(tabKey) || undefined;