ios-haptics 3.1.1 → 3.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/dist/index.js +2 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,8 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
javascript library for haptic feedback inside of safari on ios
|
|
4
4
|
|
|
5
|
-
please note this only works on ios 17.4 to 26.4, as apple patched it in ios 26.5
|
|
6
|
-
|
|
7
5
|
|
|
8
6
|
[](https://npmjs.com/package/ios-haptics)
|
|
9
7
|
|
|
@@ -51,7 +49,9 @@ vue
|
|
|
51
49
|
|
|
52
50
|
this uses the `<input type="checkbox" switch />` (introduced in safari 17.4), which has haptic feedback when toggled
|
|
53
51
|
|
|
54
|
-
`hapticTrigger` renders
|
|
52
|
+
`hapticTrigger` renders a transparent `<label>` on top of your element, wired to a hidden switch. when the user taps the element, the label forwards the tap to the switch as a trusted click, and safari triggers the native haptic feedback
|
|
53
|
+
|
|
54
|
+
the switch itself never sits under the finger, so scroll gestures that start on the element still scroll the page
|
|
55
55
|
|
|
56
56
|
---
|
|
57
57
|
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* ios-haptics v3.
|
|
2
|
+
* ios-haptics v3.1.1
|
|
3
3
|
* tijn.dev
|
|
4
4
|
* @license MIT
|
|
5
5
|
**/
|
|
6
|
-
function e(
|
|
6
|
+
function e(){return typeof navigator>`u`?!1:/iPad|iPhone|iPod/.test(navigator.userAgent)||navigator.platform===`MacIntel`&&navigator.maxTouchPoints>1}function t(t){if(!t||typeof window>`u`||!e()||t.querySelector(`[data-haptic-trigger]`))return;let n=document.createElement(`input`);n.type=`checkbox`,n.setAttribute(`switch`,``),n.setAttribute(`data-haptic-trigger`,``),n.setAttribute(`aria-hidden`,`true`),n.tabIndex=-1,Object.assign(n.style,{position:`absolute`,inset:`0`,width:`100%`,height:`100%`,margin:`0`,opacity:`0`,clipPath:`inset(0 round 999px)`,touchAction:`pan-x pan-y`}),n.style.setProperty(`-webkit-tap-highlight-color`,`transparent`),getComputedStyle(t).position===`static`&&(t.style.position=`relative`);let r=0,i=!1;n.addEventListener(`pointerdown`,e=>{r=e.clientY,i=!1},{passive:!0}),n.addEventListener(`pointermove`,e=>{Math.abs(e.clientY-r)>10&&(i=!0,n.checked=!1)},{passive:!0}),n.addEventListener(`pointerup`,()=>{i&&(n.checked=!1),i=!1},{passive:!0}),n.addEventListener(`pointercancel`,()=>{i=!1,n.checked=!1},{passive:!0}),t.insertAdjacentElement(`beforeend`,n)}export{t as hapticTrigger};
|