Scope Hoist breaks Mermaid.JS

[Belphemur]

🐛 bug report

When using mermaid in a react component and building the prod version with parcel, I get method not found:

(0 , $3bCKe.select) is not a function

I tried all I could, only removing scope hoist fixes it.

🎛 Configuration (.babelrc, package.json, cli command)

{
  "name": "chatpad",
  "private": true,
  "source": "src/index.html",
  "browserslist": "> 0.5%, last 2 versions, not dead",
  "scripts": {
    "start": "parcel",
    "build": "parcel build --no-scope-hoist"
  },
  "staticFiles": {
    "staticPath": "src/static"
  },
  "devDependencies": {
    "@parcel/config-default": "^2.9.3",
    "@parcel/transformer-sass": "^2.9.3",
    "@types/downloadjs": "^1.4.3",
    "@types/lodash": "^4.14.197",
    "@types/mermaid": "^9.2.0",
    "@types/node": "20.5.6",
    "@types/react": "^18.0.28",
    "@types/react-dom": "^18.0.11",
    "@types/react-highlight": "^0.12.5",
    "@types/react-lazyload": "^3.2.0",
    "@types/react-virtualized": "^9.21.22",
    "buffer": "^6.0.3",
    "parcel": "^2.9.3",
    "parcel-reporter-static-files-copy": "^1.5.2",
    "path-browserify": "^1.0.1",
    "process": "^0.11.10",
    "property-information": "^6.2.0"
  },
  "dependencies": {
    "@emotion/react": "^11.11.1",
    "@emotion/server": "^11.11.0",
    "@mantine/core": "^6.0.19",
    "@mantine/hooks": "^6.0.19",
    "@mantine/next": "^6.0.19",
    "@mantine/notifications": "^6.0.19",
    "@mantine/prism": "^6.0.19",
    "@tabler/icons-react": "^2.32.0",
    "@tanstack/react-location": "^3.7.4",
    "dexie": "^3.2.4",
    "dexie-export-import": "^4.0.7",
    "dexie-react-hooks": "^1.1.6",
    "downloadjs": "^1.4.7",
    "eslint": "8.48.0",
    "eslint-config-next": "13.4.19",
    "gpt-token-utils": "^1.2.0",
    "gpt-tokens": "^1.1.2",
    "highlight.js": "^11.8.0",
    "lodash": "^4.17.21",
    "mermaid": "^10.4.0",
    "nanoid": "^4.0.2",
    "next": "13.4.19",
    "openai": "^4.2.0",
    "openai-ext": "^1.2.7",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-highlight": "^0.15.0",
    "react-icons": "^4.10.1",
    "react-markdown": "^8.0.7",
    "react-virtualized": "^9.22.5",
    "remark-gfm": "^3.0.1",
    "typescript": "5.2.2"
  },
  "pnpm": {
    "overrides": {
      "highlight.js": "^11.8.0"
    }
  }
}

🤔 Expected Behavior

Being able to build a prod version of the app with Scope Hoist and have mermaid able to generate a flow chart from text.

😯 Current Behavior

mermaid crashing and not able to generate a graph since a function is missing.

(0 , $3bCKe.select) is not a function

💁 Possible Solution

Disabling scope hoist.

🔦 Context

💻 Code Sample

React code for the mermaid component:
https://github.com/Belphemur/chatpad/blob/main/src/components/Mermaid.tsx

🌍 Your Environment

Software	Version(s)
Parcel	2.9.3
Node	18/lts
npm/Yarn/pnpm	pnpm
Operating System	Windows

[mischnic]

Looks like this was recently fixed by #9331