Import Error when used with Next.js Pages Router

[MBM1607]

I am attempting to use this package in a Next.js site made with Pages Router. In development on initial page load the error occurs, but after reload it works fine in development.

The production build however is always failing with this error

Stack Trace

error - /home/muhammad/work/tech-hive-website/node_modules/.pnpm/mui-tel-input@5.0.0_@emotion+react@11.11.3_@emotion+styled@11.11.0_@mui+material@5.15.2_@type_2f2brkxw2yuylm3kk4w2p6zl7q/node_modules/mui-tel-input/dist/mui-tel-input.es.js:1
import { jsx as N, jsxs as H, Fragment as Fe } from "react/jsx-runtime";
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at internalCompileFunction (node:internal/vm:77:18)
    at wrapSafe (node:internal/modules/cjs/loader:1288:20)
    at Module._compile (node:internal/modules/cjs/loader:1340:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
    at Module.load (node:internal/modules/cjs/loader:1207:32)
    at Module._load (node:internal/modules/cjs/loader:1023:12)
    at Module.require (node:internal/modules/cjs/loader:1235:19)
    at require (node:internal/modules/helpers:176:18)

Versions

mui-tel-input

5.0.0

Material UI

5.15.2

Next

13.1.1

React

18.2.0

Node

20.10.0

[viclafouch]

Duplicated with https://github.com/viclafouch/mui-tel-input/issues/84

[MBM1607]

Thanks @viclafouch for the quick response, somehow I didn't find that issue when searching.