[bug]: /docs/components/smooth-cursor

[talalaslam15]

Describe the bug
On mobile devices, the cursor from the smooth-cursor component appears at the tapped location, even though it should remain invisible on touch devices. This creates an unintended visual artifact that breaks the mobile UX.

To Reproduce
Steps to reproduce the behavior:

Open the /docs/components/smooth-cursor page on a mobile device

Tap anywhere on the screen

Observe that a cursor appears where you tapped

Expected behavior
The cursor should remain completely invisible on mobile/touch devices. No visual cursor should appear when the user interacts with the screen.

Screenshots

Desktop:
OS: Windows 11
Browser: Google Chrome
Version 138.0.7204.184 (Official Build) (64-bit)

Smartphone:
Simulated on Google Chrome

Additional context
It seems the current logic does not fully account for mobile/touch environments. A conditional check for pointer: coarse or a touch capability check might help disable or hide the cursor properly on such devices.

[eggratanurag]

I’d be happy to look into this.

From what I can see, the custom cursor still renders on touch devices because there’s no check for pointer: coarse or navigator.maxTouchPoints before mounting.

My idea is to detect touch/coarse pointer environments and skip rendering the cursor in those cases, so the mobile UX stays clean without extra CSS from users.

If no one else is already working on this, I can start exploring a PR.