feat: support custom hashPriority (#7)

* feat: support custom hashPriority

* feat: code optimize

* feat: code optimize

* feat: code optimize

Author: kiner-tang

package.json

@@ -55,7 +55,7 @@
     "typescript": "^4.0.0"
   },
   "dependencies": {
-    "@ant-design/cssinjs": "^1.6.1",
+    "@ant-design/cssinjs": "^1.8.1",
     "@babel/runtime": "^7.18.3",
     "@rc-component/portal": "^1.1.0",
     "antd": "^5.3.0",

src/index.tsx

@@ -6,7 +6,7 @@ import {
 } from '@ant-design/cssinjs';
 import * as antd from 'antd';
 import { renderToString } from 'react-dom/server';
-import type { ExtractStyleParams } from './interface';
+import type { CustomRender } from './interface';
 const blackList: string[] = [
   'ConfigProvider',
   'Drawer',
@@ -18,8 +18,6 @@ const blackList: string[] = [
   'Tour',
 ];
 
-const styleTagReg = /<style[^>]*>([\s\S]*?)<\/style>/g;
-
 const defaultNode = () => (
   <>
     {Object.keys(antd)
@@ -44,7 +42,7 @@ const defaultNode = () => (
   </>
 );
 
-export function extractStyle(customTheme?: ExtractStyleParams): string {
+export function extractStyle(customTheme?: CustomRender): string {
   const cache = createCache();
   renderToString(
     <StyleProvider cache={cache}>
@@ -53,8 +51,7 @@ export function extractStyle(customTheme?: ExtractStyleParams): string {
   );
 
   // Grab style from cache
-  const styleText = extStyle(cache);
-  
+  const styleText = extStyle(cache, true);
 
-  return styleText.replace(styleTagReg, '$1');
+  return styleText;
 }

src/interface.ts

@@ -1 +1 @@
-export type ExtractStyleParams = (node: JSX.Element) => JSX.Element;
+export type CustomRender = (node: JSX.Element) => JSX.Element;

tests/__snapshots__/index.test.tsx.snap

@@ -1,3 +1,4 @@
+import { StyleProvider } from '@ant-design/cssinjs';
 import { extractStyle } from '../src/index';
 import { ConfigProvider } from 'antd';
 
@@ -23,4 +24,37 @@ describe('Static-Style-Extract', () => {
     expect(cssText).toContain(testGreenColor);
     expect(cssText).toMatchSnapshot();
   });
+  it('with custom hashPriority', () => {
+    const cssText = extractStyle(
+      (node) => (
+        <StyleProvider hashPriority='high'>
+          <ConfigProvider
+            theme={{
+              token: {
+                colorPrimary: testGreenColor,
+              },
+            }}
+          >
+            {node}
+          </ConfigProvider>
+        </StyleProvider>
+      )
+    );
+    expect(cssText).toContain(testGreenColor);
+    expect(cssText).not.toContain(':where');
+    expect(cssText).toMatchSnapshot();
+
+    const cssText2 = extractStyle((node) => (
+      <ConfigProvider
+        theme={{
+          token: {
+            colorPrimary: testGreenColor,
+          },
+        }}
+      >
+        {node}
+      </ConfigProvider>
+    ));
+    expect(cssText2).toContain(':where');
+  });
 });