Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add haptic feedback to Toggle in Safari on iOS 18+ #29942

Open
3 tasks done
jedlikowski opened this issue Oct 16, 2024 · 2 comments · May be fixed by #29945
Open
3 tasks done

feat: add haptic feedback to Toggle in Safari on iOS 18+ #29942

jedlikowski opened this issue Oct 16, 2024 · 2 comments · May be fixed by #29945
Labels

Comments

@jedlikowski
Copy link

jedlikowski commented Oct 16, 2024

Prerequisites

Describe the Feature Request

Safari since iOS 18 supports haptic feedback on checkbox elements via a non-standard switch attribute. We could use it to provide haptic feedback when switching Toggle in non-hybrid environments. This could be a workaround for lack of support for Vibration API in Safari.

Describe the Use Case

Adding haptic feedback to Toggle component in non-hybrid environments would improve native feel of web and PWA apps built with Ionic.

Describe Preferred Solution

To trigger haptic feedback programatically we need an <input type=checkbox switch> element with an associated <label> element. With this setup, when we programatically trigger click() on the label, safari will emit the haptic feedback.

Describe Alternatives

Keep current implementation and wait for Safari to implement Vibration API (if it ever does).

Related Code

Codepen provided in WebKit release notes, demonstrating haptic feedback in checkbox of type switch: https://codepen.io/jensimmons/pen/GReLKWg

Additional Information

No response

@ionitron-bot ionitron-bot bot added the triage label Oct 16, 2024
@jedlikowski jedlikowski linked a pull request Oct 17, 2024 that will close this issue
2 tasks
@DwieDima
Copy link
Contributor

This sounds really interesting!
Would you mind to also include the option to configure this using IonicConfig with defaults to false?

You can find a similar PR for config extension here.

@jedlikowski
Copy link
Author

Hi @DwieDima, thanks for the suggestion 🙇 Added configurability to my PR 😄

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants