Prime-Calendar: Broken when used as Web-Element with ShadowDOM

[codestitch]

Describe the bug

When using p-calendar (CalendarModule) in an angular application that implements web-element and ShadowDOM, the calendar component breaks / non-functional.

So, adding encapsulation: ViewEncapsulation.ShadowDom in App.component.ts, will break the component.

I want my application to be a web-element and isolate my styles inside that's why ShadowDom is used.

Environment

No environment. Any regular application.

Reproducer

https://stackblitz.com/edit/stackblitz-starters-i5v2en?file=src%2Fmain.ts

Angular version

18.0.0

PrimeNG version

17.18.3

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.20.3

Browser(s)

No response

Steps to reproduce the behavior

1. Create a new angular application.
2. Install PrimeNG and @angular/elements
3. Change bootstrapApplication(App, appConfig); to

`(async () => { const app = await createApplication(appConfig);

const customFormElement = createCustomElement(App, { injector: app.injector, });

customElements.define('app-test-element', customFormElement); })();`

5. In index.html change <app-root></app-root> to <app-test-element></app-test-element>
6. Add providers: [provideAnimationsAsync()], in appConfig.
7. Import the Following to app.component.ts: imports: [FormsModule, CalendarModule]
8. Add Calendar in app.component.html: <p-calendar [(ngModel)]="date" />
9. Add Model in app.component.ts: date: Date | undefined;
10. Test it, it works right?!
11. Now, add encapsulation: ViewEncapsulation.ShadowDom
12. Then Add

DomHandler.getParents = ( element: HTMLElement | ShadowRoot, parents: Array<Node | ShadowRoot> = [] ): Array<HTMLElement> => { return ( element['parentNode'] === null ? parents : DomHandler.getParents( element.parentNode, parents.concat([element.parentNode]) ) ).filter((item: HTMLElement | ShadowRoot) => !(item instanceof ShadowRoot)); };

This is to remove the error ->https://github.com/primefaces/primeng/issues/9471.

13. Now Test it again.

Expected behavior

Even when shadowDOM is used, p-calendar should still function expectedly.

[LMatass]

I have also encountered this issue, any workaround?