Rails 7: Stimulus Rails Nested Form not working

I am trying to follow the instrcutions mentioned here

https://www.stimulus-components.com/docs/stimulus-rails-nested-form/

but when I add the import statement

import NestedForm from 'stimulus-rails-nested-form'

i see the following error

ERROR in ./node_modules/stimulus-rails-nested-form/dist/stimulus-rails-nested-form.mjs 2:16-17
Can't import the named export 'Controller' from non EcmaScript module (only default export is available)

below is my app/javascript/controllers/application.js

import { Application } from "@hotwired/stimulus"
import NestedForm from 'stimulus-rails-nested-form'

const application = Application.start()
// application.register('nested-form', NestedForm)
// Configure Stimulus development experience
application.debug = false
window.Stimulus   = application

export { application }

below are the contents of my package.json

{
  "name": "backend",
  "private": true,
  "dependencies": {
    "@hotwired/stimulus": "^3.2.1",
    "@hotwired/stimulus-webpack-helpers": "^1.0.1",
    "@rails/webpacker": "5.4.4",
    "node": "^16.20.1",
    "stimulus-rails-nested-form": "^4.1.0",
    "webpack": "^4.46.0",
    "webpack-cli": "^3.3.12"
  },
  "devDependencies": {
    "@babel/plugin-proposal-private-methods": "^7.18.6",
    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
    "webpack-dev-server": "^3"
  }
}

I am on rails Rails 7.0.3. Any help on what could be missing would be great, Thanks.

from Rails 7: Stimulus Rails Nested Form not working