🐛[BUG] 当StyleProvider挂载在shadowRoot节点时，style样式表挂载位置不对

[lajidemo]

🐛 bug 描述

我在主工程上设置StyleProvider挂载节点为shadowRoot时，通过antd-style开发的二次封装组件样式无法正确的挂载在shadowRoot节点上

📷 复现步骤

1. 主工程设置StyleProvider的container为shadowRoot
2. 在独立的组件库工程上通过antd-style开发自定义组件
3. 组件样式表挂载到了head标签上

🏞 期望结果

组件样式表挂载到shadowRoot节点上

💻 复现代码

// index.tsx
  const shadowRoot = document.getElementById('copilot-root')?.shadowRoot;
  const popupContainer = shadowRoot?.getElementById('copilot-panel');
  return shadowRoot ? (
    <StyleProvider container={shadowRoot}>
      <XProvider
        locale={zhCN}
        // @ts-ignore
        getPopupContainer={() => popupContainer}
        theme={props.themeConfig}
      >
        <Foo {...props} />
      </XProvider>
    </StyleProvider>
  ) : null;

// Foo.tsx
import { createStyles } from 'antd-style';
import React, { type FC } from 'react';

const Foo: FC<{ title: string }> = (props) => {
  const useStyle = createStyles(({ token, css }) => ({
    asd: css`
      color: ${token.colorPrimary};
    `,
  }));
  const { styles } = useStyle();
  return <h4 className={styles.asd}>{props.title}</h4>;
};

export default Foo;

可复现 demo

© 版本信息

• antd-style 版本: 3.7.1
• 浏览器环境 Chrome
• 开发环境 windows 10

🚑 其他信息

[Wxh16144]

没接触过 shadowRoot , 请教一下是否和 ant-design/cssinjs#189 这个问题一样？

[lajidemo]

没接触过 shadowRoot , 请教一下是否和 ant-design/cssinjs#189 这个问题一样？

应该不是同一个问题。因为我的shadowroot节点是动态创建的，我怀疑是否是样式表挂载时机的问题，所以我试着切换了下宿主的样式表挂载节点为document.body，但还是挂载到了head标签上

请问antd-style挂载样式表是否会根据宿主的StyleProvider的container设定而改变？

我在组件中使用antd-style的StyleProvider设定container后，可以看到antd的样式表注入位置正常，但我自定义的样式表位置注入位置依然是异常

[whinc]

使用web component时，遇到同样的问题

[lajidemo]

使用web component时，遇到同样的问题

看了下代码

1. antd是通过 @ant-design/cssinjs-utils 的 genStyleUtils 返回的 useStyle 来生成样式
2. 其中 genStyleUtils 调用了 @ant-design/cssinjs 的 useCSSVarRegister 来注入样式表
3. useCSSVarRegister 是从 StyleContext 上下文中获取到了 container ，再通过 updateCSS 生成 style 标签实现有效注入

翻看 antd-style 并没有使用到 useCSSVarRegister，上下文也不是从 StyleContext 获取，感觉应该是设计上的问题，并不是一个代码bug