makima/ios/Sources/Makima/Design/Components/JapaneseLongPressText.swift


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

import SwiftUI

/// Mobile-native equivalent of the web's `JapaneseHoverText`.
/// Shows the Japanese term; long-press (or tap) reveals the English gloss
/// via a brief animated flip.
struct JapaneseLongPressText: View {
    let japanese: String
    let english: String

    @State private var revealed = false

    var body: some View {
        HStack(spacing: 6) {
            Text(japanese)
                .font(Typography.japanese)
                .foregroundStyle(Palette.foreground)
                .padding(.vertical, 3)
                .padding(.horizontal, 6)
                .background(Palette.panel)
                .overlay(
                    Rectangle().strokeBorder(Palette.borderMuted, lineWidth: 1)
                )
                .contentShape(Rectangle())
                .onTapGesture { withAnimation(.easeInOut(duration: 0.2)) { revealed.toggle() } }
                .onLongPressGesture(minimumDuration: 0.15, pressing: { pressing in
                    withAnimation(.easeInOut(duration: 0.15)) { revealed = pressing }
                }, perform: {})

            Text(english)
                .font(Typography.navLabel)
                .foregroundStyle(revealed ? Palette.accent : Palette.foregroundMuted.opacity(0.4))
                .animation(.easeInOut(duration: 0.2), value: revealed)
        }
        .accessibilityElement(children: .combine)
        .accessibilityLabel("\(japanese), \(english)")
    }
}