Pointer events should not be visibile outside of cdk-drag/cdk-drop area.

[StefaniToto]

Describe the bug

Scenario: Having a component that contain a drag/drop functionality, will affect other components that has on hover effect.

Issue:
Hovering at component-2 should apply some style.
When we drag from comp-1/comp-3 to some other part of the page, but especially at comp-2 that has an active class for hovering,
the pointer-events are making this component as active.

This styles of drag/drop element is better to remain only inside that box and not to affect other elements.

Hot fix: Remove the pointer event from other components, and add it only to drag area where is active.

Pull Request Link

No response

Reason for not contributing a PR

• Lack of time
• Unsure how to implement the fix/feature
• Difficulty understanding the codebase
• Other

Other Reason

No response

Reproducer

https://stackblitz.com/github/StefaniToto/Primeng-Drag-Drop

Environment

Windows 11, WebStorm.

Angular version

18.0.1

PrimeNG version

v17 (LTS Only)

Node version

22.3.0

Browser(s)

Chrome,Firefox

Steps to reproduce the behavior

Drag the element from drag/drop area to other elements of the page that have a hover style.

Expected behavior

Pointer events should not be visible if we decide to drag an element out of that area.
As long as the drag/drop operation will not be valid this should not affect other components style.