feat(shared/utils): 抽取 transition 的 isSameEl 为公共 util isSameReactEl

packages/shared/src/utils/__tests__/isSameReactEl.test.tsx

@@ -0,0 +1,26 @@
+import { isSameReactEl } from '@pkg/shared';
+
+describe('isSameReactEl', () => {
+  const isSame = isSameReactEl;
+  it('should return false when one of the two values is not a ReactElement', () => {
+    expect(isSame(true, true)).toBeFalsy();
+    expect(isSame(false, true)).toBeFalsy();
+    expect(isSame(true, false)).toBeFalsy();
+    expect(isSame(false, false)).toBeFalsy();
+    expect(isSame(false, <div></div>)).toBeFalsy();
+    expect(isSame(<div></div>, true)).toBeFalsy();
+  });
+
+  it('should return false', () => {
+    expect(isSame(<div></div>, <div></div>)).toBeFalsy();
+    expect(isSame(<div key={1}></div>, <div key={2}></div>)).toBeFalsy();
+    expect(isSame(<div key={1}></div>, <span key={1}></span>)).toBeFalsy();
+  });
+
+  it('should return true', () => {
+    const div = <div></div>;
+    expect(isSame(div, div)).toBeTruthy();
+    expect(isSame(<div key={1}></div>, <div key={1}></div>)).toBeTruthy();
+    expect(isSame(<div key={1}>123</div>, <div key={1}>456</div>)).toBeTruthy();
+  });
+});

packages/shared/src/utils/index.ts

@@ -3,3 +3,4 @@ export * from './numToPx';
 export * from './getElRealSize';
 export * from './getSizeClassName';
 export * from './getClasses';
+export * from './isSameReactEl';

packages/shared/src/utils/isSameReactEl.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+
+export function isSameReactEl(prev: unknown, next: unknown): boolean {
+  if (!React.isValidElement(next)) return false;
+  if (prev === next) return true;
+  if (!React.isValidElement(prev)) return false;
+  return prev.type === next.type && prev.key !== null && prev.key === next.key;
+}