taptickit 0.0.6

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 thor-op
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,57 @@
+# TapticKit
+
+Haptic feedback for the mobile web. Zero dependencies.
+
+## Install
+
+```bash
+npm i taptickit
+```
+
+## Usage
+
+**React:**
+```tsx
+import { useTaptic } from "taptickit/react";
+
+const haptic = useTaptic();
+<button onClick={() => haptic.trigger("success")}>Tap</button>
+```
+
+**Vue:**
+```vue
+<script setup>
+import { useTaptic } from "taptickit/vue";
+const haptic = useTaptic();
+</script>
+<button @click="haptic.trigger('success')">Tap</button>
+```
+
+**Svelte:**
+```svelte
+<script>
+import { createTaptic } from "taptickit/svelte";
+const haptic = createTaptic();
+</script>
+<button on:click={() => haptic.trigger('success')}>Tap</button>
+```
+
+**Vanilla:**
+```js
+import { TapticKit } from "taptickit";
+const haptic = new TapticKit();
+haptic.trigger("success");
+```
+
+## Presets
+
+- `trigger()` - medium tap (default)
+- `trigger("light")` - subtle tap
+- `trigger("medium")` - standard tap
+- `trigger("heavy")` - strong tap
+- `trigger("success")` - positive outcome
+- `trigger("warning")` - cautionary
+- `trigger("error")` - negative outcome
+- `trigger("selection")` - discrete tick
+
+Next.js: add `"use client"` when using hooks.

package/dist/index.d.mts

@@ -0,0 +1,144 @@
+var version = "0.0.6";
+
+interface Vibration {
+    duration: number;
+    intensity?: number;
+    delay?: number;
+}
+type HapticPattern = number[] | Vibration[];
+interface HapticPreset {
+    pattern: Vibration[];
+}
+type HapticInput = number | string | HapticPattern | HapticPreset;
+interface TriggerOptions {
+    intensity?: number;
+}
+interface TapticKitOptions {
+    debug?: boolean;
+    showSwitch?: boolean;
+}
+/** @deprecated Use TapticKitOptions instead */
+type WebHapticsOptions = TapticKitOptions;
+
+declare class TapticKit {
+    private hapticLabel;
+    private domInitialized;
+    private instanceId;
+    private debug;
+    private showSwitch;
+    private rafId;
+    private patternResolve;
+    private audioCtx;
+    private audioFilter;
+    private audioGain;
+    private audioBuffer;
+    constructor(options?: TapticKitOptions);
+    static readonly isSupported: boolean;
+    trigger(input?: HapticInput, options?: TriggerOptions): Promise<void>;
+    cancel(): void;
+    destroy(): void;
+    setDebug(debug: boolean): void;
+    setShowSwitch(show: boolean): void;
+    private stopPattern;
+    private runPattern;
+    private playClick;
+    private ensureAudio;
+    private ensureDOM;
+}
+/** @deprecated Use TapticKit instead */
+declare const WebHaptics: typeof TapticKit;
+
+declare const defaultPatterns: {
+    readonly success: {
+        readonly pattern: [{
+            readonly duration: 30;
+            readonly intensity: 0.5;
+        }, {
+            readonly delay: 60;
+            readonly duration: 40;
+            readonly intensity: 1;
+        }];
+    };
+    readonly warning: {
+        readonly pattern: [{
+            readonly duration: 40;
+            readonly intensity: 0.8;
+        }, {
+            readonly delay: 100;
+            readonly duration: 40;
+            readonly intensity: 0.6;
+        }];
+    };
+    readonly error: {
+        readonly pattern: [{
+            readonly duration: 40;
+            readonly intensity: 0.7;
+        }, {
+            readonly delay: 40;
+            readonly duration: 40;
+            readonly intensity: 0.7;
+        }, {
+            readonly delay: 40;
+            readonly duration: 40;
+            readonly intensity: 0.9;
+        }, {
+            readonly delay: 40;
+            readonly duration: 50;
+            readonly intensity: 0.6;
+        }];
+    };
+    readonly light: {
+        readonly pattern: [{
+            readonly duration: 15;
+            readonly intensity: 0.4;
+        }];
+    };
+    readonly medium: {
+        readonly pattern: [{
+            readonly duration: 25;
+            readonly intensity: 0.7;
+        }];
+    };
+    readonly heavy: {
+        readonly pattern: [{
+            readonly duration: 35;
+            readonly intensity: 1;
+        }];
+    };
+    readonly soft: {
+        readonly pattern: [{
+            readonly duration: 40;
+            readonly intensity: 0.5;
+        }];
+    };
+    readonly rigid: {
+        readonly pattern: [{
+            readonly duration: 10;
+            readonly intensity: 1;
+        }];
+    };
+    readonly selection: {
+        readonly pattern: [{
+            readonly duration: 8;
+            readonly intensity: 0.3;
+        }];
+    };
+    readonly nudge: {
+        readonly pattern: [{
+            readonly duration: 80;
+            readonly intensity: 0.8;
+        }, {
+            readonly delay: 80;
+            readonly duration: 50;
+            readonly intensity: 0.3;
+        }];
+    };
+    readonly buzz: {
+        readonly pattern: [{
+            readonly duration: 1000;
+            readonly intensity: 1;
+        }];
+    };
+};
+
+export { type HapticInput, type HapticPattern, type HapticPreset, TapticKit, type TapticKitOptions, type TriggerOptions, type Vibration, WebHaptics, type WebHapticsOptions, defaultPatterns, version };

package/dist/index.d.ts

@@ -0,0 +1,144 @@
+var version = "0.0.6";
+
+interface Vibration {
+    duration: number;
+    intensity?: number;
+    delay?: number;
+}
+type HapticPattern = number[] | Vibration[];
+interface HapticPreset {
+    pattern: Vibration[];
+}
+type HapticInput = number | string | HapticPattern | HapticPreset;
+interface TriggerOptions {
+    intensity?: number;
+}
+interface TapticKitOptions {
+    debug?: boolean;
+    showSwitch?: boolean;
+}
+/** @deprecated Use TapticKitOptions instead */
+type WebHapticsOptions = TapticKitOptions;
+
+declare class TapticKit {
+    private hapticLabel;
+    private domInitialized;
+    private instanceId;
+    private debug;
+    private showSwitch;
+    private rafId;
+    private patternResolve;
+    private audioCtx;
+    private audioFilter;
+    private audioGain;
+    private audioBuffer;
+    constructor(options?: TapticKitOptions);
+    static readonly isSupported: boolean;
+    trigger(input?: HapticInput, options?: TriggerOptions): Promise<void>;
+    cancel(): void;
+    destroy(): void;
+    setDebug(debug: boolean): void;
+    setShowSwitch(show: boolean): void;
+    private stopPattern;
+    private runPattern;
+    private playClick;
+    private ensureAudio;
+    private ensureDOM;
+}
+/** @deprecated Use TapticKit instead */
+declare const WebHaptics: typeof TapticKit;
+
+declare const defaultPatterns: {
+    readonly success: {
+        readonly pattern: [{
+            readonly duration: 30;
+            readonly intensity: 0.5;
+        }, {
+            readonly delay: 60;
+            readonly duration: 40;
+            readonly intensity: 1;
+        }];
+    };
+    readonly warning: {
+        readonly pattern: [{
+            readonly duration: 40;
+            readonly intensity: 0.8;
+        }, {
+            readonly delay: 100;
+            readonly duration: 40;
+            readonly intensity: 0.6;
+        }];
+    };
+    readonly error: {
+        readonly pattern: [{
+            readonly duration: 40;
+            readonly intensity: 0.7;
+        }, {
+            readonly delay: 40;
+            readonly duration: 40;
+            readonly intensity: 0.7;
+        }, {
+            readonly delay: 40;
+            readonly duration: 40;
+            readonly intensity: 0.9;
+        }, {
+            readonly delay: 40;
+            readonly duration: 50;
+            readonly intensity: 0.6;
+        }];
+    };
+    readonly light: {
+        readonly pattern: [{
+            readonly duration: 15;
+            readonly intensity: 0.4;
+        }];
+    };
+    readonly medium: {
+        readonly pattern: [{
+            readonly duration: 25;
+            readonly intensity: 0.7;
+        }];
+    };
+    readonly heavy: {
+        readonly pattern: [{
+            readonly duration: 35;
+            readonly intensity: 1;
+        }];
+    };
+    readonly soft: {
+        readonly pattern: [{
+            readonly duration: 40;
+            readonly intensity: 0.5;
+        }];
+    };
+    readonly rigid: {
+        readonly pattern: [{
+            readonly duration: 10;
+            readonly intensity: 1;
+        }];
+    };
+    readonly selection: {
+        readonly pattern: [{
+            readonly duration: 8;
+            readonly intensity: 0.3;
+        }];
+    };
+    readonly nudge: {
+        readonly pattern: [{
+            readonly duration: 80;
+            readonly intensity: 0.8;
+        }, {
+            readonly delay: 80;
+            readonly duration: 50;
+            readonly intensity: 0.3;
+        }];
+    };
+    readonly buzz: {
+        readonly pattern: [{
+            readonly duration: 1000;
+            readonly intensity: 1;
+        }];
+    };
+};
+
+export { type HapticInput, type HapticPattern, type HapticPreset, TapticKit, type TapticKitOptions, type TriggerOptions, type Vibration, WebHaptics, type WebHapticsOptions, defaultPatterns, version };

package/dist/index.js

@@ -0,0 +1 @@
+'use strict';var g="0.0.6";var b={success:{pattern:[{duration:30,intensity:.5},{delay:60,duration:40,intensity:1}]},warning:{pattern:[{duration:40,intensity:.8},{delay:100,duration:40,intensity:.6}]},error:{pattern:[{duration:40,intensity:.7},{delay:40,duration:40,intensity:.7},{delay:40,duration:40,intensity:.9},{delay:40,duration:50,intensity:.6}]},light:{pattern:[{duration:15,intensity:.4}]},medium:{pattern:[{duration:25,intensity:.7}]},heavy:{pattern:[{duration:35,intensity:1}]},soft:{pattern:[{duration:40,intensity:.5}]},rigid:{pattern:[{duration:10,intensity:1}]},selection:{pattern:[{duration:8,intensity:.3}]},nudge:{pattern:[{duration:80,intensity:.8},{delay:80,duration:50,intensity:.3}]},buzz:{pattern:[{duration:1e3,intensity:1}]}};var C=16,M=184,v=1e3,f=20;function k(r){if(typeof r=="number")return {vibrations:[{duration:r}]};if(typeof r=="string"){let i=b[r];return i?{vibrations:i.pattern.map(t=>({...t}))}:(console.warn(`[taptickit] Unknown preset: "${r}"`),null)}if(Array.isArray(r)){if(r.length===0)return {vibrations:[]};if(typeof r[0]=="number"){let i=r,t=[];for(let e=0;e<i.length;e+=2){let n=e>0?i[e-1]:0;t.push({...n>0&&{delay:n},duration:i[e]});}return {vibrations:t}}return {vibrations:r.map(i=>({...i}))}}return {vibrations:r.pattern.map(i=>({...i}))}}function w(r,i){if(i>=1)return [r];if(i<=0)return [];let t=Math.max(1,Math.round(f*i)),e=f-t,n=[],a=r;for(;a>=f;)n.push(t),n.push(e),a-=f;if(a>0){let s=Math.max(1,Math.round(a*i));n.push(s);let o=a-s;o>0&&n.push(o);}return n}function I(r,i){let t=[];for(let e=0;e<r.length;e++){let n=r[e],a=Math.max(0,Math.min(1,n.intensity??i)),s=n.delay??0;s>0&&(t.length>0&&t.length%2===0?t[t.length-1]+=s:(t.length===0&&t.push(0),t.push(s)));let o=w(n.duration,a);if(o.length===0){t.length>0&&t.length%2===0?t[t.length-1]+=n.duration:n.duration>0&&(t.push(0),t.push(n.duration));continue}for(let d of o)t.push(d);}return t}var P=0,y=class r{hapticLabel=null;domInitialized=false;instanceId;debug;showSwitch;rafId=null;patternResolve=null;audioCtx=null;audioFilter=null;audioGain=null;audioBuffer=null;constructor(i){this.instanceId=++P,this.debug=i?.debug??false,this.showSwitch=i?.showSwitch??false;}static isSupported=typeof navigator<"u"&&typeof navigator.vibrate=="function";async trigger(i=[{duration:25,intensity:.7}],t){let e=k(i);if(!e)return;let{vibrations:n}=e;if(n.length===0)return;let a=Math.max(0,Math.min(1,t?.intensity??.5));for(let s of n)if(s.duration>v&&(s.duration=v),!Number.isFinite(s.duration)||s.duration<0||s.delay!==void 0&&(!Number.isFinite(s.delay)||s.delay<0)){console.warn("[taptickit] Invalid vibration values. Durations and delays must be finite non-negative numbers.");return}if(r.isSupported&&navigator.vibrate(I(n,a)),!r.isSupported||this.debug){if(this.ensureDOM(),!this.hapticLabel)return;this.debug&&await this.ensureAudio(),this.stopPattern();let o=(n[0]?.delay??0)===0;if(o&&(this.hapticLabel.click(),this.debug&&this.audioCtx)){let d=Math.max(0,Math.min(1,n[0].intensity??a));this.playClick(d);}await this.runPattern(n,a,o);}}cancel(){this.stopPattern(),r.isSupported&&navigator.vibrate(0);}destroy(){this.stopPattern(),this.hapticLabel&&(this.hapticLabel.remove(),this.hapticLabel=null,this.domInitialized=false),this.audioCtx&&(this.audioCtx.close(),this.audioCtx=null,this.audioFilter=null,this.audioGain=null,this.audioBuffer=null);}setDebug(i){this.debug=i,!i&&this.audioCtx&&(this.audioCtx.close(),this.audioCtx=null,this.audioFilter=null,this.audioGain=null,this.audioBuffer=null);}setShowSwitch(i){if(this.showSwitch=i,this.hapticLabel){let t=this.hapticLabel.querySelector("input");this.hapticLabel.style.display=i?"":"none",t&&(t.style.display=i?"":"none");}}stopPattern(){this.rafId!==null&&(cancelAnimationFrame(this.rafId),this.rafId=null),this.patternResolve?.(),this.patternResolve=null;}runPattern(i,t,e){return new Promise(n=>{this.patternResolve=n;let a=[],s=0;for(let u of i){let c=Math.max(0,Math.min(1,u.intensity??t)),l=u.delay??0;l>0&&(s+=l,a.push({end:s,isOn:false,intensity:0})),s+=u.duration,a.push({end:s,isOn:true,intensity:c});}let o=s,d=0,p=-1,m=u=>{d===0&&(d=u);let c=u-d;if(c>=o){this.rafId=null,this.patternResolve=null,n();return}let l=a[0];for(let h of a)if(c<h.end){l=h;break}if(l.isOn){let h=C+(1-l.intensity)*M;p===-1?(p=u,e||(this.hapticLabel?.click(),this.debug&&this.audioCtx&&this.playClick(l.intensity),e=true)):u-p>=h&&(this.hapticLabel?.click(),this.debug&&this.audioCtx&&this.playClick(l.intensity),p=u);}this.rafId=requestAnimationFrame(m);};this.rafId=requestAnimationFrame(m);})}playClick(i){if(!this.audioCtx||!this.audioFilter||!this.audioGain||!this.audioBuffer)return;let t=this.audioBuffer.getChannelData(0);for(let s=0;s<t.length;s++)t[s]=(Math.random()*2-1)*Math.exp(-s/25);this.audioGain.gain.value=.5*i;let e=2e3+i*2e3,n=1+(Math.random()-.5)*.3;this.audioFilter.frequency.value=e*n;let a=this.audioCtx.createBufferSource();a.buffer=this.audioBuffer,a.connect(this.audioFilter),a.onended=()=>a.disconnect(),a.start();}async ensureAudio(){if(!this.audioCtx&&typeof AudioContext<"u"){this.audioCtx=new AudioContext,this.audioFilter=this.audioCtx.createBiquadFilter(),this.audioFilter.type="bandpass",this.audioFilter.frequency.value=4e3,this.audioFilter.Q.value=8,this.audioGain=this.audioCtx.createGain(),this.audioFilter.connect(this.audioGain),this.audioGain.connect(this.audioCtx.destination);let i=.004;this.audioBuffer=this.audioCtx.createBuffer(1,this.audioCtx.sampleRate*i,this.audioCtx.sampleRate);let t=this.audioBuffer.getChannelData(0);for(let e=0;e<t.length;e++)t[e]=(Math.random()*2-1)*Math.exp(-e/25);}this.audioCtx?.state==="suspended"&&await this.audioCtx.resume();}ensureDOM(){if(this.domInitialized||typeof document>"u")return;let i=`taptickit-${this.instanceId}`,t=document.createElement("label");t.setAttribute("for",i),t.textContent="Haptic feedback",t.style.position="fixed",t.style.bottom="10px",t.style.left="10px",t.style.padding="5px 10px",t.style.backgroundColor="rgba(0, 0, 0, 0.7)",t.style.color="white",t.style.fontFamily="sans-serif",t.style.fontSize="14px",t.style.borderRadius="4px",t.style.zIndex="9999",t.style.userSelect="none",this.hapticLabel=t;let e=document.createElement("input");e.type="checkbox",e.setAttribute("switch",""),e.id=i,e.style.all="initial",e.style.appearance="auto",this.showSwitch||(t.style.display="none",e.style.display="none"),t.appendChild(e),document.body.appendChild(t),this.domInitialized=true;}},F=y;exports.TapticKit=y;exports.WebHaptics=F;exports.defaultPatterns=b;exports.version=g;

package/dist/index.mjs

@@ -0,0 +1 @@
+var g="0.0.6";var b={success:{pattern:[{duration:30,intensity:.5},{delay:60,duration:40,intensity:1}]},warning:{pattern:[{duration:40,intensity:.8},{delay:100,duration:40,intensity:.6}]},error:{pattern:[{duration:40,intensity:.7},{delay:40,duration:40,intensity:.7},{delay:40,duration:40,intensity:.9},{delay:40,duration:50,intensity:.6}]},light:{pattern:[{duration:15,intensity:.4}]},medium:{pattern:[{duration:25,intensity:.7}]},heavy:{pattern:[{duration:35,intensity:1}]},soft:{pattern:[{duration:40,intensity:.5}]},rigid:{pattern:[{duration:10,intensity:1}]},selection:{pattern:[{duration:8,intensity:.3}]},nudge:{pattern:[{duration:80,intensity:.8},{delay:80,duration:50,intensity:.3}]},buzz:{pattern:[{duration:1e3,intensity:1}]}};var C=16,M=184,v=1e3,f=20;function k(r){if(typeof r=="number")return {vibrations:[{duration:r}]};if(typeof r=="string"){let i=b[r];return i?{vibrations:i.pattern.map(t=>({...t}))}:(console.warn(`[taptickit] Unknown preset: "${r}"`),null)}if(Array.isArray(r)){if(r.length===0)return {vibrations:[]};if(typeof r[0]=="number"){let i=r,t=[];for(let e=0;e<i.length;e+=2){let n=e>0?i[e-1]:0;t.push({...n>0&&{delay:n},duration:i[e]});}return {vibrations:t}}return {vibrations:r.map(i=>({...i}))}}return {vibrations:r.pattern.map(i=>({...i}))}}function w(r,i){if(i>=1)return [r];if(i<=0)return [];let t=Math.max(1,Math.round(f*i)),e=f-t,n=[],a=r;for(;a>=f;)n.push(t),n.push(e),a-=f;if(a>0){let s=Math.max(1,Math.round(a*i));n.push(s);let o=a-s;o>0&&n.push(o);}return n}function I(r,i){let t=[];for(let e=0;e<r.length;e++){let n=r[e],a=Math.max(0,Math.min(1,n.intensity??i)),s=n.delay??0;s>0&&(t.length>0&&t.length%2===0?t[t.length-1]+=s:(t.length===0&&t.push(0),t.push(s)));let o=w(n.duration,a);if(o.length===0){t.length>0&&t.length%2===0?t[t.length-1]+=n.duration:n.duration>0&&(t.push(0),t.push(n.duration));continue}for(let d of o)t.push(d);}return t}var P=0,y=class r{hapticLabel=null;domInitialized=false;instanceId;debug;showSwitch;rafId=null;patternResolve=null;audioCtx=null;audioFilter=null;audioGain=null;audioBuffer=null;constructor(i){this.instanceId=++P,this.debug=i?.debug??false,this.showSwitch=i?.showSwitch??false;}static isSupported=typeof navigator<"u"&&typeof navigator.vibrate=="function";async trigger(i=[{duration:25,intensity:.7}],t){let e=k(i);if(!e)return;let{vibrations:n}=e;if(n.length===0)return;let a=Math.max(0,Math.min(1,t?.intensity??.5));for(let s of n)if(s.duration>v&&(s.duration=v),!Number.isFinite(s.duration)||s.duration<0||s.delay!==void 0&&(!Number.isFinite(s.delay)||s.delay<0)){console.warn("[taptickit] Invalid vibration values. Durations and delays must be finite non-negative numbers.");return}if(r.isSupported&&navigator.vibrate(I(n,a)),!r.isSupported||this.debug){if(this.ensureDOM(),!this.hapticLabel)return;this.debug&&await this.ensureAudio(),this.stopPattern();let o=(n[0]?.delay??0)===0;if(o&&(this.hapticLabel.click(),this.debug&&this.audioCtx)){let d=Math.max(0,Math.min(1,n[0].intensity??a));this.playClick(d);}await this.runPattern(n,a,o);}}cancel(){this.stopPattern(),r.isSupported&&navigator.vibrate(0);}destroy(){this.stopPattern(),this.hapticLabel&&(this.hapticLabel.remove(),this.hapticLabel=null,this.domInitialized=false),this.audioCtx&&(this.audioCtx.close(),this.audioCtx=null,this.audioFilter=null,this.audioGain=null,this.audioBuffer=null);}setDebug(i){this.debug=i,!i&&this.audioCtx&&(this.audioCtx.close(),this.audioCtx=null,this.audioFilter=null,this.audioGain=null,this.audioBuffer=null);}setShowSwitch(i){if(this.showSwitch=i,this.hapticLabel){let t=this.hapticLabel.querySelector("input");this.hapticLabel.style.display=i?"":"none",t&&(t.style.display=i?"":"none");}}stopPattern(){this.rafId!==null&&(cancelAnimationFrame(this.rafId),this.rafId=null),this.patternResolve?.(),this.patternResolve=null;}runPattern(i,t,e){return new Promise(n=>{this.patternResolve=n;let a=[],s=0;for(let u of i){let c=Math.max(0,Math.min(1,u.intensity??t)),l=u.delay??0;l>0&&(s+=l,a.push({end:s,isOn:false,intensity:0})),s+=u.duration,a.push({end:s,isOn:true,intensity:c});}let o=s,d=0,p=-1,m=u=>{d===0&&(d=u);let c=u-d;if(c>=o){this.rafId=null,this.patternResolve=null,n();return}let l=a[0];for(let h of a)if(c<h.end){l=h;break}if(l.isOn){let h=C+(1-l.intensity)*M;p===-1?(p=u,e||(this.hapticLabel?.click(),this.debug&&this.audioCtx&&this.playClick(l.intensity),e=true)):u-p>=h&&(this.hapticLabel?.click(),this.debug&&this.audioCtx&&this.playClick(l.intensity),p=u);}this.rafId=requestAnimationFrame(m);};this.rafId=requestAnimationFrame(m);})}playClick(i){if(!this.audioCtx||!this.audioFilter||!this.audioGain||!this.audioBuffer)return;let t=this.audioBuffer.getChannelData(0);for(let s=0;s<t.length;s++)t[s]=(Math.random()*2-1)*Math.exp(-s/25);this.audioGain.gain.value=.5*i;let e=2e3+i*2e3,n=1+(Math.random()-.5)*.3;this.audioFilter.frequency.value=e*n;let a=this.audioCtx.createBufferSource();a.buffer=this.audioBuffer,a.connect(this.audioFilter),a.onended=()=>a.disconnect(),a.start();}async ensureAudio(){if(!this.audioCtx&&typeof AudioContext<"u"){this.audioCtx=new AudioContext,this.audioFilter=this.audioCtx.createBiquadFilter(),this.audioFilter.type="bandpass",this.audioFilter.frequency.value=4e3,this.audioFilter.Q.value=8,this.audioGain=this.audioCtx.createGain(),this.audioFilter.connect(this.audioGain),this.audioGain.connect(this.audioCtx.destination);let i=.004;this.audioBuffer=this.audioCtx.createBuffer(1,this.audioCtx.sampleRate*i,this.audioCtx.sampleRate);let t=this.audioBuffer.getChannelData(0);for(let e=0;e<t.length;e++)t[e]=(Math.random()*2-1)*Math.exp(-e/25);}this.audioCtx?.state==="suspended"&&await this.audioCtx.resume();}ensureDOM(){if(this.domInitialized||typeof document>"u")return;let i=`taptickit-${this.instanceId}`,t=document.createElement("label");t.setAttribute("for",i),t.textContent="Haptic feedback",t.style.position="fixed",t.style.bottom="10px",t.style.left="10px",t.style.padding="5px 10px",t.style.backgroundColor="rgba(0, 0, 0, 0.7)",t.style.color="white",t.style.fontFamily="sans-serif",t.style.fontSize="14px",t.style.borderRadius="4px",t.style.zIndex="9999",t.style.userSelect="none",this.hapticLabel=t;let e=document.createElement("input");e.type="checkbox",e.setAttribute("switch",""),e.id=i,e.style.all="initial",e.style.appearance="auto",this.showSwitch||(t.style.display="none",e.style.display="none"),t.appendChild(e),document.body.appendChild(t),this.domInitialized=true;}},F=y;export{y as TapticKit,F as WebHaptics,b as defaultPatterns,g as version};

package/dist/react/index.d.mts

@@ -0,0 +1,27 @@
+interface Vibration {
+    duration: number;
+    intensity?: number;
+    delay?: number;
+}
+type HapticPattern = number[] | Vibration[];
+interface HapticPreset {
+    pattern: Vibration[];
+}
+type HapticInput = number | string | HapticPattern | HapticPreset;
+interface TriggerOptions {
+    intensity?: number;
+}
+interface TapticKitOptions {
+    debug?: boolean;
+    showSwitch?: boolean;
+}
+
+declare function useTaptic(options?: TapticKitOptions): {
+    trigger: (input?: HapticInput, options?: TriggerOptions) => Promise<void> | undefined;
+    cancel: () => void | undefined;
+    isSupported: boolean;
+};
+/** @deprecated Use useTaptic instead */
+declare const useWebHaptics: typeof useTaptic;
+
+export { useTaptic, useWebHaptics };

package/dist/react/index.d.ts

@@ -0,0 +1,27 @@
+interface Vibration {
+    duration: number;
+    intensity?: number;
+    delay?: number;
+}
+type HapticPattern = number[] | Vibration[];
+interface HapticPreset {
+    pattern: Vibration[];
+}
+type HapticInput = number | string | HapticPattern | HapticPreset;
+interface TriggerOptions {
+    intensity?: number;
+}
+interface TapticKitOptions {
+    debug?: boolean;
+    showSwitch?: boolean;
+}
+
+declare function useTaptic(options?: TapticKitOptions): {
+    trigger: (input?: HapticInput, options?: TriggerOptions) => Promise<void> | undefined;
+    cancel: () => void | undefined;
+    isSupported: boolean;
+};
+/** @deprecated Use useTaptic instead */
+declare const useWebHaptics: typeof useTaptic;
+
+export { useTaptic, useWebHaptics };

package/dist/react/index.js

@@ -0,0 +1 @@
+'use strict';var react=require('react'),taptickit=require('taptickit');function u(e){let t=react.useRef(null);react.useEffect(()=>(t.current=new taptickit.TapticKit(e),()=>{t.current?.destroy(),t.current=null;}),[]),react.useEffect(()=>{t.current?.setDebug(e?.debug??false);},[e?.debug]),react.useEffect(()=>{t.current?.setShowSwitch(e?.showSwitch??false);},[e?.showSwitch]);let n=react.useCallback((a,o)=>t.current?.trigger(a,o),[]),s=react.useCallback(()=>t.current?.cancel(),[]),p=taptickit.TapticKit.isSupported;return {trigger:n,cancel:s,isSupported:p}}var f=u;exports.useTaptic=u;exports.useWebHaptics=f;

package/dist/react/index.mjs

@@ -0,0 +1 @@
+import {useRef,useEffect,useCallback}from'react';import {TapticKit}from'taptickit';function u(e){let t=useRef(null);useEffect(()=>(t.current=new TapticKit(e),()=>{t.current?.destroy(),t.current=null;}),[]),useEffect(()=>{t.current?.setDebug(e?.debug??false);},[e?.debug]),useEffect(()=>{t.current?.setShowSwitch(e?.showSwitch??false);},[e?.showSwitch]);let n=useCallback((a,o)=>t.current?.trigger(a,o),[]),s=useCallback(()=>t.current?.cancel(),[]),p=TapticKit.isSupported;return {trigger:n,cancel:s,isSupported:p}}var f=u;export{u as useTaptic,f as useWebHaptics};

package/dist/svelte/index.d.mts

@@ -0,0 +1,29 @@
+interface Vibration {
+    duration: number;
+    intensity?: number;
+    delay?: number;
+}
+type HapticPattern = number[] | Vibration[];
+interface HapticPreset {
+    pattern: Vibration[];
+}
+type HapticInput = number | string | HapticPattern | HapticPreset;
+interface TriggerOptions {
+    intensity?: number;
+}
+interface TapticKitOptions {
+    debug?: boolean;
+    showSwitch?: boolean;
+}
+
+declare function createTaptic(options?: TapticKitOptions): {
+    trigger: (input?: HapticInput, options?: TriggerOptions) => Promise<void>;
+    cancel: () => void;
+    destroy: () => void;
+    setDebug: (debug: boolean) => void;
+    isSupported: boolean;
+};
+/** @deprecated Use createTaptic instead */
+declare const createWebHaptics: typeof createTaptic;
+
+export { createTaptic, createWebHaptics };

package/dist/svelte/index.d.ts

@@ -0,0 +1,29 @@
+interface Vibration {
+    duration: number;
+    intensity?: number;
+    delay?: number;
+}
+type HapticPattern = number[] | Vibration[];
+interface HapticPreset {
+    pattern: Vibration[];
+}
+type HapticInput = number | string | HapticPattern | HapticPreset;
+interface TriggerOptions {
+    intensity?: number;
+}
+interface TapticKitOptions {
+    debug?: boolean;
+    showSwitch?: boolean;
+}
+
+declare function createTaptic(options?: TapticKitOptions): {
+    trigger: (input?: HapticInput, options?: TriggerOptions) => Promise<void>;
+    cancel: () => void;
+    destroy: () => void;
+    setDebug: (debug: boolean) => void;
+    isSupported: boolean;
+};
+/** @deprecated Use createTaptic instead */
+declare const createWebHaptics: typeof createTaptic;
+
+export { createTaptic, createWebHaptics };

package/dist/svelte/index.js

@@ -0,0 +1 @@
+'use strict';var taptickit=require('taptickit');function c(p){let t=new taptickit.TapticKit(p),o=(e,g)=>t.trigger(e,g),r=()=>t.cancel(),n=()=>t.destroy(),s=e=>t.setDebug(e),a=taptickit.TapticKit.isSupported;return {trigger:o,cancel:r,destroy:n,setDebug:s,isSupported:a}}var u=c;exports.createTaptic=c;exports.createWebHaptics=u;

package/dist/svelte/index.mjs

@@ -0,0 +1 @@
+import {TapticKit}from'taptickit';function c(p){let t=new TapticKit(p),o=(e,g)=>t.trigger(e,g),r=()=>t.cancel(),n=()=>t.destroy(),s=e=>t.setDebug(e),a=TapticKit.isSupported;return {trigger:o,cancel:r,destroy:n,setDebug:s,isSupported:a}}var u=c;export{c as createTaptic,u as createWebHaptics};

package/dist/vue/index.d.mts

@@ -0,0 +1,27 @@
+interface Vibration {
+    duration: number;
+    intensity?: number;
+    delay?: number;
+}
+type HapticPattern = number[] | Vibration[];
+interface HapticPreset {
+    pattern: Vibration[];
+}
+type HapticInput = number | string | HapticPattern | HapticPreset;
+interface TriggerOptions {
+    intensity?: number;
+}
+interface TapticKitOptions {
+    debug?: boolean;
+    showSwitch?: boolean;
+}
+
+declare function useTaptic(options?: TapticKitOptions): {
+    trigger: (input?: HapticInput, options?: TriggerOptions) => Promise<void> | undefined;
+    cancel: () => void | undefined;
+    isSupported: boolean;
+};
+/** @deprecated Use useTaptic instead */
+declare const useWebHaptics: typeof useTaptic;
+
+export { useTaptic, useWebHaptics };

package/dist/vue/index.d.ts

@@ -0,0 +1,27 @@
+interface Vibration {
+    duration: number;
+    intensity?: number;
+    delay?: number;
+}
+type HapticPattern = number[] | Vibration[];
+interface HapticPreset {
+    pattern: Vibration[];
+}
+type HapticInput = number | string | HapticPattern | HapticPreset;
+interface TriggerOptions {
+    intensity?: number;
+}
+interface TapticKitOptions {
+    debug?: boolean;
+    showSwitch?: boolean;
+}
+
+declare function useTaptic(options?: TapticKitOptions): {
+    trigger: (input?: HapticInput, options?: TriggerOptions) => Promise<void> | undefined;
+    cancel: () => void | undefined;
+    isSupported: boolean;
+};
+/** @deprecated Use useTaptic instead */
+declare const useWebHaptics: typeof useTaptic;
+
+export { useTaptic, useWebHaptics };

package/dist/vue/index.js

@@ -0,0 +1 @@
+'use strict';var vue=require('vue'),taptickit=require('taptickit');function n(i){let t=null;vue.onMounted(()=>{t=new taptickit.TapticKit(i);}),vue.onUnmounted(()=>{t?.destroy(),t=null;}),vue.watch(()=>i?.debug,e=>{t?.setDebug(e??false);});let o=(e,s)=>t?.trigger(e,s),r=()=>t?.cancel(),c=taptickit.TapticKit.isSupported;return {trigger:o,cancel:r,isSupported:c}}var g=n;exports.useTaptic=n;exports.useWebHaptics=g;

package/dist/vue/index.mjs

@@ -0,0 +1 @@
+import {onMounted,onUnmounted,watch}from'vue';import {TapticKit}from'taptickit';function n(i){let t=null;onMounted(()=>{t=new TapticKit(i);}),onUnmounted(()=>{t?.destroy(),t=null;}),watch(()=>i?.debug,e=>{t?.setDebug(e??false);});let o=(e,s)=>t?.trigger(e,s),r=()=>t?.cancel(),c=TapticKit.isSupported;return {trigger:o,cancel:r,isSupported:c}}var g=n;export{n as useTaptic,g as useWebHaptics};

package/package.json

@@ -0,0 +1,113 @@
+{
+  "name": "taptickit",
+  "version": "0.0.6",
+  "description": "Haptic for the mobile web.",
+  "homepage": "https://taptickit.thorxop.dev",
+  "sideEffects": false,
+  "author": "thor-op",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/thor-op/taptickit.git",
+    "directory": "packages/taptickit"
+  },
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./react": {
+      "types": "./dist/react/index.d.ts",
+      "import": "./dist/react/index.mjs",
+      "require": "./dist/react/index.js"
+    },
+    "./vue": {
+      "types": "./dist/vue/index.d.ts",
+      "import": "./dist/vue/index.mjs",
+      "require": "./dist/vue/index.js"
+    },
+    "./svelte": {
+      "types": "./dist/svelte/index.d.ts",
+      "import": "./dist/svelte/index.mjs",
+      "require": "./dist/svelte/index.js"
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "lint": "eslint -c .eslintrc.cjs ./src/**/*.{ts,tsx}",
+    "lint:fix": "eslint --fix -c .eslintrc.cjs ./src/**/*.{ts,tsx}",
+    "pre-commit": "lint-staged",
+    "prepublishOnly": "pnpm build"
+  },
+  "keywords": [
+    "haptics",
+    "vibration",
+    "feedback",
+    "web",
+    "mobile",
+    "react",
+    "vue",
+    "svelte",
+    "typescript"
+  ],
+  "bugs": {
+    "url": "https://github.com/thor-op/taptickit/issues"
+  },
+  "files": [
+    "dist/**/*.js",
+    "dist/**/*.mjs",
+    "dist/**/*.d.ts",
+    "dist/**/*.d.mts",
+    "LICENSE",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18",
+    "vue": ">=3",
+    "svelte": ">=4"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "react-dom": {
+      "optional": true
+    },
+    "vue": {
+      "optional": true
+    },
+    "svelte": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.15",
+    "@typescript-eslint/eslint-plugin": "^6.8.0",
+    "@typescript-eslint/parser": "^6.8.0",
+    "eslint": "^9.36.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-airbnb-typescript": "^17.1.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-import": "^2.28.1",
+    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-prettier": "^5.0.1",
+    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "prettier": "^3.0.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "svelte": "^4.0.0",
+    "tsup": "^8.5.0",
+    "typescript": "^5.9.3",
+    "vue": "^3.3.0"
+  }
+}