NgBlockUI instance is undefined

[Bharathi-Kandhasamy]

I'm currently upgrade my angular application to angular 18.2.3 version and using ng-block-ui version to 4.0.1. when i try to run the application I'm getting undefined error. NgBlockUI is not rendering the instance instead of the instance got undefined. I Included BlockUIModule.forRoot().

package.json
"@angular-architects/module-federation": "18.0.6",
"@angular-architects/module-federation-tools": "18.0.6",
"@angular/animations": "18.2.3",
"@angular/cdk": "18.2.3",
"@angular/common": "18.2.3",
"@angular/compiler": "18.2.3",
"@angular/core": "18.2.3",
"@angular/elements": "18.2.3",
"@angular/forms": "18.2.3",
"@angular/material": "18.2.3",
"@angular/material-moment-adapter": "18.2.3",
"@angular/platform-browser": "18.2.3",
"@angular/platform-browser-dynamic": "18.2.3",
"@angular/platform-server": "18.2.3",
"@angular/router": "18.2.3",
"@evalue/mh-ev-common-lib": "18.0.0",
"@evalue/mh-ev-core-lib": "18.0.0",
"@evalue/mh-ev-styles-lib": "18.0.0",
"@ngrx/effects": "18.0.2",
"@ngrx/entity": "18.0.2",
"@ngrx/operators": "18.0.2",
"@ngrx/router-store": "18.0.2",
"@ngrx/store": "18.0.2",
"@ngxs/store": "18.1.1",
"@sheet/image": "file:./vendor/sheet-image-1.20211011.1.tgz",
"angular-froala-wysiwyg": "4.2.0",
"core-js": "^3.8.2",
"cross-env": "^7.0.3",
"downloadjs": "^1.4.7",
"file": "^0.2.2",
"file-saver": "^2.0.5",
"font-awesome": "^4.7.0",
"froala-editor": "4.2.0",
"immutable": "^3.8.2",
"launchdarkly-js-client-sdk": "^3.1.3",
"luxon": "^3.4.4",
"moment": "^2.24.0",
"moment-timezone": "^0.5.25",
"ng-block-ui": "^4.0.1",
"ng2-file-upload": "^3.0.0",
"ngx-mat-select-search": "~7.0.0",
"ngx-material-timepicker": "^13.0.0",
"rxjs": "7.8.0",
"tslib": "^2.8.0",
"zone.js": "~0.14.10"

Got this Error
error_handler.ts:47 ERROR TypeError: Cannot read properties of undefined (reading 'start')
at BlockUIService.blockUIAngular (block-ui.service.ts:12:18)