feat(components/transition-group): 调整类型和导出

packages/components/src/transition-group/TransitionGroup.tsx

@@ -1,35 +1,31 @@
 import React, { memo, useRef } from 'react';
 import { Transition } from '../transition/index';
-import type { Mode } from '../transition/transition.types';
 import { ChildStatus } from './transition-group.enums';
 import { useDispatcher } from './transition-gorup.hooks';
+import { TransitionGroupProps } from './transition-group.types';
 
-const TransitionGroup: React.FC<{
-  name?: string;
-  mode?: Mode;
-  children?: React.ReactElement[];
-  appear?: boolean;
-  tag?: keyof HTMLElementTagNameMap;
-  className?: string;
-}> = ({ mode, className, name, tag = 'div', ...props }): JSX.Element => {
+const TransitionGroup: React.FC<TransitionGroupProps> = (
+  props,
+): React.ReactElement => {
+  const { mode, name, tag, appear, children, ...rest } = props;
   const containerRef = useRef<HTMLElement>(null);
 
-  const [children, appear] = useDispatcher(
+  const [_children, _appear] = useDispatcher(
     containerRef,
     name,
-    props.children,
-    props.appear,
+    children,
+    appear,
   );
 
   return React.createElement(
-    tag,
-    { ref: containerRef, className },
-    children.map((child) => {
+    tag as string,
+    { ...rest, ref: containerRef },
+    _children.map((child) => {
       return (
         <Transition
           name={name}
           mode={mode}
-          appear={appear}
+          appear={_appear}
           key={child.component.key}
           on={child.on}>
           {child.status === ChildStatus.leave ? undefined : child.component}
@@ -38,4 +34,8 @@ const TransitionGroup: React.FC<{
     }),
   );
 };
+
+TransitionGroup.defaultProps = { tag: 'div' };
+TransitionGroup.displayName = 'TransitionGroup';
+
 export default memo(TransitionGroup);

packages/components/src/transition-group/index.ts

@@ -1 +1,2 @@
+export type { TransitionGroupProps } from './transition-group.types';
 export { default as TransitionGroup } from './TransitionGroup';

packages/components/src/transition-group/transition-group.types.ts

@@ -1,5 +1,5 @@
 import type React from 'react';
-import type { CB } from '../transition/transition.types';
+import type { CB, TransitionProps } from '../transition/transition.types';
 import type { ChildStatus } from './transition-group.enums';
 
 export type CompKey = string | number;
@@ -8,3 +8,12 @@ export interface Child {
   on: CB;
   status: ChildStatus;
 }
+
+export type TransitionGroupProps = Omit<
+  React.HTMLAttributes<HTMLElement>,
+  'children'
+> &
+  Pick<TransitionProps, 'name' | 'appear' | 'mode'> & {
+    children?: React.ReactElement[];
+    tag?: keyof HTMLElementTagNameMap;
+  };