Custom package not able to use Mantine

[dim basin]

I'm having a similar issue to this https://stackoverflow.com/questions/76303352/mantine-ui-for-component-library
I created my own package and used mantine core components within the new package. I then tried to use that component in a different repo that was using a mantine provider but got the same error as the stack overflow. i tried wrapping the custom component in the package with the mantine provider as well with no avail. Any ideas?

[twin trellis]

How are you building the library? If you’re using a bundler, make sure that all mantine packages are marked as external on your lib, otherwise it will embed a version of mantine inside the built library code, which will be incompatible with the one installed at the app level.

You can also re-export MantineProvider in your library and import it from there in your app. Then wrap your app root with it as usual

[dim basin]

thanks will try, im creating my lib using github packages

[visual karma]

For building the library I was just using tsc.

In that case shouldn’t it be using the mantine packages from the external repo regardless?

[twin trellis]

If you’re just using tsc then indeed you won’t have an issue with bundled dependencies. You can still end up with two versions of mantine, one only used in the library and one used elsewhere, depending on how you configured the dependencies.
If you’ve specified a different version in the dependencies of your library and your app, then npm/yarn can install a version nested inside your lib if the ranges don’t match.
To work around this, either only install mantine in the library’s dependencies and reexport everything you need, only using your own lib in your app; or set mantine as peer dependency in your lib so that only the app’s one will be used (but beware of how npm7+ handle peer deps now)

Same goes for React too. Even with the same Mantine package used, if you have a duplicated React package, context won’t be propagated

[visual karma]

If the following is my package.json then is that not the second option that you mentioned (set mantine as peer dependency in your lib)?
Am I not understanding peer dependencies correctly?

{
  "name": "@company/modals",
  "version": "1.0.0",
  "description": "Generic modals to be used across company sites",
  "main": "dist/index.js",
  "files": [
    "dist"
  ],
  "exports": {
    ".": {
      "types": "./dist/index.d.ts",
      "default": "./dist/index.js"
    }
  },
  "scripts": {
    "test": "exit 0",
    "build": "tsc"
  },
  "author": "Company Ltd.",
  "license": "ISC",
  "devDependencies": {
    "@types/react": "^18.2.48",
    "@types/react-dom": "^18.2.18",
    "react": "^18.2.0",
    "typescript": "^5.3.3"
  },
  "peerDependencies": {
    "react": "^17.0.0 || ^18.0.0",
    "@types/react": "^18.2.48",
    "@types/react-dom": "^18.2.18",
    "@mantine/core": "^7.4.2",
    "@mantine/hooks": "^7.4.2"
  }
}