Adding a leaflet Extension to React-Leaflet

Question

I'm trying to use "Leaflet.Heightgraph" on my React app. For this React app, I've used "React-Leaflet".

My issue is that I cannot use the required initialization for Leaflet.Heightgraph - which is L.control.Heightgraph(). Doing so returns the following error:

Uncaught TypeError: leaflet__WEBPACK_IMPORTED_MODULE_7___default.a.control.heightgraph is not a function
    at CompMap (CompMap.jsx:289:1)
    at renderWithHooks (react-dom.development.js:14985:1)
    at mountIndeterminateComponent (react-dom.development.js:17811:1)
    at beginWork (react-dom.development.js:19049:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1)
    at invokeGuardedCallback (react-dom.development.js:4056:1)
    at beginWork$1 (react-dom.development.js:23964:1)
    at performUnitOfWork (react-dom.development.js:22779:1)
    at workLoopSync (react-dom.development.js:22707:1)
    at renderRootSync (react-dom.development.js:22670:1)
    at performSyncWorkOnRoot (react-dom.development.js:22293:1)
    at scheduleUpdateOnFiber (react-dom.development.js:21881:1)
    at updateContainer (react-dom.development.js:25482:1)
    at react-dom.development.js:26021:1
    at unbatchedUpdates (react-dom.development.js:22431:1)
    at legacyRenderSubtreeIntoContainer (react-dom.development.js:26020:1)
    at Object.render (react-dom.development.js:26103:1)
    at Module../src/index.js (index.js:14:1)
    at __webpack_require__ (bootstrap:784:1)
    at fn (bootstrap:150:1)
    at Object.1 (serviceWorker.js:164:1)
    at __webpack_require__ (bootstrap:784:1)
    at checkDeferredModules (bootstrap:45:1)
    at Array.webpackJsonpCallback [as push] (bootstrap:32:1)
    at main.chunk.js:1:65

I'm pretty sure I've added all the needed imports. If relevant, I'm using L.icon without any issues. And using this import import L from "leaflet"; import LH from "leaflet.heightgraph";