My usecase is i want to build custom component and use it in the primary package. apply a theme from the primrary package that can also be used by my custom component as well.
but for some reason the custom package is not able to get the theme applied to primrary package.

I have two button one inside my custom component package

//PackageA-Custom Component 

import { Button } from "antd"

export default function HelloWorld() {
  return (
    <Button type="primary" style={{ width: 200 }}>Demo button</Button>)
}

and PackageB which uses PackageA

  <React.StrictMode>
    <ConfigProvider
      theme={componentConfig1}>
      <Button type="primary">Demo button s1</Button><br />
      <!-- This loads  the HelloWorldcomponent --> 
      <RouterProvider router={MyRoutesSettings()} />
    </ConfigProvider>
  </React.StrictMode>,

Below is my Config for theme

export const componentConfig1: ThemeConfig = {
  // hashed: false,
  token: {
    colorPrimary: "#237804",
  },
  components: {
    Card: {
      headerBg: "#F9F9F9",
      headerFontSize: 20,
    },
    Button: {
      fontSize: 15,
      fontWeight: "700",
    },
  },

But i see the buttons are generated with differrent color

i also checked the hashes classes for this buttons are differrent

class=”ant-btn css-dev-only-do-not-override-13oz7a8 ant-btn-primary”

class=”ant-btn css-dev-only-do-not-override-1okl62o ant-btn-primary”

Any Hints/Suggeston on how can i make them consistent.