add web haptic

This commit is contained in:
2026-05-09 23:47:33 +02:00
parent e909095495
commit b4ececbbb4
3 changed files with 10 additions and 2 deletions
+3
View File
@@ -8,6 +8,7 @@
"@tsdown/css": "^0.21.10", "@tsdown/css": "^0.21.10",
"clsx": "^2.1.1", "clsx": "^2.1.1",
"tailwind-merge": "^3.5.0", "tailwind-merge": "^3.5.0",
"web-haptics": "^0.0.6",
}, },
"devDependencies": { "devDependencies": {
"@biomejs/biome": "^2.4.13", "@biomejs/biome": "^2.4.13",
@@ -1189,6 +1190,8 @@
"vfile-message": ["vfile-message@4.0.3", "", { "dependencies": { "@types/unist": "^3.0.0", "unist-util-stringify-position": "^4.0.0" } }, "sha512-QTHzsGd1EhbZs4AsQ20JX1rC3cOlt/IWJruk893DfLRr57lcnOeMaWG4K0JrRta4mIJZKth2Au3mM3u03/JWKw=="], "vfile-message": ["vfile-message@4.0.3", "", { "dependencies": { "@types/unist": "^3.0.0", "unist-util-stringify-position": "^4.0.0" } }, "sha512-QTHzsGd1EhbZs4AsQ20JX1rC3cOlt/IWJruk893DfLRr57lcnOeMaWG4K0JrRta4mIJZKth2Au3mM3u03/JWKw=="],
"web-haptics": ["web-haptics@0.0.6", "", { "peerDependencies": { "react": ">=18", "react-dom": ">=18", "svelte": ">=4", "vue": ">=3" }, "optionalPeers": ["react", "react-dom", "svelte", "vue"] }, "sha512-eCzcf1LDi20+Fr0x9V3OkX92k0gxEQXaHajmhXHitsnk6SxPeshv8TBtBRqxyst8HI1uf2FyFVE7QS3jo1gkrw=="],
"whatwg-mimetype": ["whatwg-mimetype@3.0.0", "", {}, "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q=="], "whatwg-mimetype": ["whatwg-mimetype@3.0.0", "", {}, "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q=="],
"wrappy": ["wrappy@1.0.2", "", {}, "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="], "wrappy": ["wrappy@1.0.2", "", {}, "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ=="],
+3 -2
View File
@@ -1,7 +1,7 @@
{ {
"name": "@avocadi/ui", "name": "@avocadi/ui",
"type": "module", "type": "module",
"version": "0.3.0", "version": "0.3.1",
"description": "ui elements for avocadi", "description": "ui elements for avocadi",
"private": false, "private": false,
"files": [ "files": [
@@ -67,7 +67,8 @@
"dependencies": { "dependencies": {
"@tsdown/css": "^0.21.10", "@tsdown/css": "^0.21.10",
"clsx": "^2.1.1", "clsx": "^2.1.1",
"tailwind-merge": "^3.5.0" "tailwind-merge": "^3.5.0",
"web-haptics": "^0.0.6"
}, },
"inlinedDependencies": { "inlinedDependencies": {
"@radix-ui/primitive": "1.1.3", "@radix-ui/primitive": "1.1.3",
+4
View File
@@ -1,4 +1,5 @@
import { useSound } from "use-sound"; import { useSound } from "use-sound";
import { useWebHaptics } from "web-haptics/react";
import z from "zod"; import z from "zod";
import clickSmallSound from "../assets/sounds/clickSmall.wav"; import clickSmallSound from "../assets/sounds/clickSmall.wav";
@@ -8,6 +9,8 @@ import uploadSuccessSound from "../assets/sounds/uploadSuccess.wav";
export const InterfaceSounds = z.enum(["clickSmall", "hover", "uploadSuccess"]); export const InterfaceSounds = z.enum(["clickSmall", "hover", "uploadSuccess"]);
export default function useInterfaceSound() { export default function useInterfaceSound() {
const { trigger } = useWebHaptics();
const [playHover] = useSound(hoverSound); const [playHover] = useSound(hoverSound);
const [playClickSmall] = useSound(clickSmallSound); const [playClickSmall] = useSound(clickSmallSound);
@@ -15,6 +18,7 @@ export default function useInterfaceSound() {
const [playUploadSuccess] = useSound(uploadSuccessSound); const [playUploadSuccess] = useSound(uploadSuccessSound);
const play = ({ id }: { id: z.output<typeof InterfaceSounds> }) => { const play = ({ id }: { id: z.output<typeof InterfaceSounds> }) => {
trigger();
switch (id) { switch (id) {
case "clickSmall": case "clickSmall":
playClickSmall(); playClickSmall();