diff --git a/apps/mobile/src/components/ui.tsx b/apps/mobile/src/components/ui.tsx index d194a25..03a8d79 100644 --- a/apps/mobile/src/components/ui.tsx +++ b/apps/mobile/src/components/ui.tsx @@ -17,6 +17,15 @@ import { import { SafeAreaView } from "react-native-safe-area-context"; import { colors, radius, spacing, typography } from "@/lib/theme"; import { t } from "@/lib/i18n"; +import * as Haptics from "expo-haptics"; + +/** Lätt haptik + handlern — gör tryck taktila i hela appen. */ +function withHaptic(fn: () => void): () => void { + return () => { + Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light).catch(() => {}); + fn(); + }; +} export function Screen({ children, @@ -85,9 +94,8 @@ export function Card({ if (onPress) { return ( [styles.card, style, pressed && { opacity: 0.9, transform: [{ scale: 0.97 }] }]} - > + onPress={withHaptic(onPress)} + style={({ pressed }) => [styles.card, style, pressed && { opacity: 0.85, transform: [{ scale: 0.98 }] }]}> {children} ); @@ -120,11 +128,11 @@ export function Button({ variant === "primary" ? "#fff" : variant === "danger" ? colors.danger : colors.primaryDark; return ( [ styles.button, - { backgroundColor: bg, opacity: disabled ? 0.5 : pressed ? 0.85 : 1 }, + { backgroundColor: bg, opacity: disabled ? 0.5 : pressed ? 0.85 : 1, transform: [{ scale: pressed ? 0.97 : 1 }] }, variant === "ghost" && { borderWidth: 1, borderColor: colors.border }, ]} >