Skip to content

Commit 3445fe5

Browse files
yoyo837yoyo837
authored
chore: move rc-util to @rc-componet/util and move classnames to clsx (#237)
1 parent 37b7a7b commit 3445fe5

18 files changed

+114
-93
lines changed

‎docs/examples/components/Button.tsx‎

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,6 @@
1-
import type {
2-
CSSInterpolation,
3-
CSSObject} from '@ant-design/cssinjs';
4-
import {
5-
unit,
6-
useCSSVarRegister,
7-
useStyleRegister,
8-
} from '@ant-design/cssinjs';
9-
import classNames from 'classnames';
1+
import type { CSSInterpolation, CSSObject } from '@ant-design/cssinjs';
2+
import { unit, useCSSVarRegister, useStyleRegister } from '@ant-design/cssinjs';
3+
import { clsx } from 'clsx';
104
import React from 'react';
115
import type { DerivativeToken } from './theme';
126
import { useToken } from './theme';
@@ -166,7 +160,7 @@ const Button = ({ className, type, ...restProps }: ButtonProps) => {
166160

167161
return (
168162
<button
169-
className={classNames(prefixCls, typeCls, hashId, className, cssVarKey)}
163+
className={clsx(prefixCls, typeCls, hashId, className, cssVarKey)}
170164
{...restProps}
171165
/>
172166
);

‎docs/examples/components/Spin.tsx‎

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import classNames from 'classnames';
1+
import { clsx } from 'clsx';
22
import React from 'react';
33
import type { DerivativeToken } from './theme';
44
import { useToken } from './theme';
@@ -41,14 +41,11 @@ const Spin = ({ className, ...restProps }: SpinProps) => {
4141
const [theme, token, hashId] = useToken();
4242

4343
// 全局注册，内部会做缓存优化
44-
useStyleRegister(
45-
{ theme, token, hashId, path: [prefixCls] },
46-
() => [genSpinStyle(prefixCls, token)],
47-
);
48-
49-
return (
50-
<div className={classNames(prefixCls, hashId, className)} {...restProps} />
51-
);
44+
useStyleRegister({ theme, token, hashId, path: [prefixCls] }, () => [
45+
genSpinStyle(prefixCls, token),
46+
]);
47+
48+
return <div className={clsx(prefixCls, hashId, className)} {...restProps} />;
5249
};
5350

5451
export default Spin;

‎docs/examples/diff-salt.tsx‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { CSSInterpolation } from '@ant-design/cssinjs';
22
import { useStyleRegister } from '@ant-design/cssinjs';
3-
import classNames from 'classnames';
3+
import { clsx } from 'clsx';
44
import React from 'react';
55
import type { DerivativeToken } from './components/theme';
66
import { DesignTokenContext, useToken } from './components/theme';
@@ -49,10 +49,7 @@ const genComponent = (genStyle: typeof genStyle1) => {
4949
]);
5050

5151
return (
52-
<div
53-
className={classNames(prefixCls, hashId, className)}
54-
{...restProps}
55-
/>
52+
<div className={clsx(prefixCls, hashId, className)} {...restProps} />
5653
);
5754
};
5855
};

‎docs/examples/layer.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { StyleProvider, Theme, useStyleRegister } from '@ant-design/cssinjs';
2-
import classNames from 'classnames';
2+
import { clsx } from 'clsx';
33
import React from 'react';
44

55
const theme = new Theme([() => ({})]);
@@ -49,7 +49,7 @@ const Div = ({ className, ...rest }: React.HTMLAttributes<HTMLDivElement>) => {
4949
}),
5050
);
5151

52-
return <div className={classNames(className, 'layer-div')} {...rest} />;
52+
return <div className={clsx(className, 'layer-div')} {...rest} />;
5353
};
5454

5555
export default function App() {

‎package.json‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,9 @@
4545
"@babel/runtime": "^7.11.1",
4646
"@emotion/hash": "^0.8.0",
4747
"@emotion/unitless": "^0.7.5",
48-
"classnames": "^2.3.1",
48+
"@rc-component/util": "^1.4.0",
49+
"clsx": "^2.1.1",
4950
"csstype": "^3.1.3",
50-
"rc-util": "^5.35.0",
5151
"stylis": "^4.3.4"
5252
},
5353
"devDependencies": {
@@ -56,7 +56,6 @@
5656
"@rc-component/np": "^1.0.3",
5757
"@testing-library/jest-dom": "^5.16.3",
5858
"@testing-library/react": "^14.0.0",
59-
"@types/classnames": "^2.2.9",
6059
"@types/enzyme": "^3.10.11",
6160
"@types/react": "^18.0.0",
6261
"@types/react-dom": "^18.0.0",

‎src/StyleContext.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import useMemo from 'rc-util/lib/hooks/useMemo';
2-
import isEqual from 'rc-util/lib/isEqual';
1+
import useMemo from '@rc-component/util/lib/hooks/useMemo';
2+
import isEqual from '@rc-component/util/lib/isEqual';
33
import * as React from 'react';
44
import CacheEntity from './Cache';
55
import type { Linter } from './linters/interface';

‎src/hooks/useCSSVarRegister.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { removeCSS, updateCSS } from 'rc-util/lib/Dom/dynamicCSS';
1+
import { removeCSS, updateCSS } from '@rc-component/util/lib/Dom/dynamicCSS';
22
import { useContext } from 'react';
33
import StyleContext, {
44
ATTR_MARK,
@@ -101,7 +101,7 @@ export const extract: ExtractStyle<CSSVarCacheValue<any>> = (
101101
const order = -999;
102102

103103
// ====================== Style ======================
104-
// Used for rc-util
104+
// Used for @rc-component/util
105105
const sharedAttrs = {
106106
'data-rc-order': 'prependQueue',
107107
'data-rc-priority': `${order}`,

‎src/hooks/useCacheToken.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import hash from '@emotion/hash';
2-
import { updateCSS } from 'rc-util/lib/Dom/dynamicCSS';
2+
import { updateCSS } from '@rc-component/util/lib/Dom/dynamicCSS';
33
import { useContext } from 'react';
44
import StyleContext, {
55
ATTR_MARK,
@@ -96,7 +96,7 @@ function cleanTokenStyle(tokenKey: string, instanceId: string) {
9696
const cleanableKeyList = new Set<string>();
9797
tokenKeys.forEach((value, key) => {
9898
if (value <= 0) cleanableKeyList.add(key);
99-
})
99+
});
100100

101101
// Should keep tokens under threshold for not to insert style too often
102102
if (tokenKeys.size - cleanableKeyList.size > TOKEN_THRESHOLD) {
@@ -252,7 +252,7 @@ export const extract: ExtractStyle<TokenCacheValue<any>> = (
252252
const order = -999;
253253

254254
// ====================== Style ======================
255-
// Used for rc-util
255+
// Used for @rc-component/util
256256
const sharedAttrs = {
257257
'data-rc-order': 'prependQueue',
258258
'data-rc-priority': `${order}`,

‎src/hooks/useEffectCleanupRegister.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import { warning } from 'rc-util/lib/warning';
2-
import { useEffect } from 'react';
1+
import { warning } from '@rc-component/util/lib/warning';
32
import type { DependencyList } from 'react';
3+
import { useEffect } from 'react';
44

55
// DO NOT register functions in useEffect cleanup function, or functions that registered will never be called.
66
const useEffectCleanupRegister = (deps?: DependencyList) => {

‎src/hooks/useStyleRegister.tsx‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import hash from '@emotion/hash';
2+
import { removeCSS, updateCSS } from '@rc-component/util/lib/Dom/dynamicCSS';
23
import type * as CSS from 'csstype';
3-
import { removeCSS, updateCSS } from 'rc-util/lib/Dom/dynamicCSS';
44
import * as React from 'react';
55
// @ts-ignore
66
import unitless from '@emotion/unitless';
@@ -357,8 +357,6 @@ export function uniqueHash(path: (string | number)[], styleStr: string) {
357357
return hash(`${path.join('%')}${styleStr}`);
358358
}
359359

360-
361-
362360
export const STYLE_PREFIX = 'style';
363361

364362
type StyleCacheValue = [
@@ -536,7 +534,7 @@ export const extract: ExtractStyle<StyleCacheValue> = (
536534
let keyStyleText = styleStr;
537535

538536
// ====================== Share ======================
539-
// Used for rc-util
537+
// Used for @rc-component/util
540538
const sharedAttrs = {
541539
'data-rc-order': 'prependQueue',
542540
'data-rc-priority': `${order}`,

0 commit comments

Comments
 (0)