MudBlazor / MudBlazor

Blazor Component Library based on Material design with an emphasis on ease of use. Mainly written in C# with Javascript kept to a bare minimum it empowers .NET developers to easily debug it if needed.
http://mudblazor.com
MIT License
7.24k stars 1.18k forks source link

Components: Remove tap delay on mobile #8861

Closed danielchalmers closed 6 days ago

danielchalmers commented 2 weeks ago

Feature request type

Other

Component name

No response

Is your feature request related to a problem?

Tapping an interactable Mud component will result in a delay of about 300ms. This is especially noticeable when watching the active-to-ripple animation:

https://github.com/MudBlazor/MudBlazor/assets/7112040/64b37a26-b145-46cd-aa17-f40ec09a63a0

It triggers the active effect, then the ripple on a delay after letting go because the ripple uses the onclick event.

This delay noticeably slows down any app that hasn't worked around this themselves and ruins the animations.

Describe the solution you'd like

The delay could be removed to make it feel more native and so the user doesn't have to do it themselves.

This might be doable through the touch-action CSS property. There are more methods mentioned in https://www.sitepoint.com/5-ways-prevent-300ms-click-delay-mobile-devices.

Have you seen this feature anywhere else?

https://mui.com/material-ui/react-button/

https://github.com/MudBlazor/MudBlazor/assets/7112040/7d34cc9f-aef5-48fa-9146-507ca5ff91a1

Describe alternatives you've considered

No response

Pull Request

Code of Conduct

danielchalmers commented 2 weeks ago

@Garderoben you would find this interesting

danielchalmers commented 6 days ago

Related to #8488

danielchalmers commented 6 days ago

Moved to #8488 as I think it's more the animation that's the problem than an actual delay in the Click callback.