// Telegram WebApp integration // Uses window.Telegram.WebApp directly for maximum compatibility // @telegram-apps/sdk-react provides typed wrappers but we keep a thin layer here export function initTelegram(): void { const tg = window.Telegram?.WebApp if (tg) { tg.ready() tg.expand() } } export function getInitData(): string { return window.Telegram?.WebApp?.initData || '' } export function getColorScheme(): 'light' | 'dark' { return window.Telegram?.WebApp?.colorScheme || 'dark' } export function getThemeParams(): Record { return window.Telegram?.WebApp?.themeParams || {} } export function hapticFeedback(type: 'light' | 'medium' | 'heavy' = 'medium'): void { window.Telegram?.WebApp?.HapticFeedback?.impactOccurred(type) } export function showMainButton(text: string, onClick: () => void): void { const btn = window.Telegram?.WebApp?.MainButton if (btn) { btn.setText(text) btn.show() btn.onClick(onClick) } } export function hideMainButton(): void { window.Telegram?.WebApp?.MainButton?.hide() } export function showBackButton(onClick: () => void): void { const btn = window.Telegram?.WebApp?.BackButton if (btn) { btn.show() btn.onClick(onClick) } } export function hideBackButton(): void { window.Telegram?.WebApp?.BackButton?.hide() } export function closeMiniApp(): void { window.Telegram?.WebApp?.close() } // Apply Telegram theme CSS variables export function applyTheme(): void { const params = getThemeParams() const root = document.documentElement Object.entries(params).forEach(([key, value]) => { if (typeof value === 'string') { root.style.setProperty(`--tg-${key.replaceAll('_', '-')}`, value) } }) const scheme = getColorScheme() root.dataset.theme = scheme } // Augment Window for TypeScript declare global { interface Window { Telegram?: { WebApp?: { ready: () => void expand: () => void close: () => void initData: string colorScheme: 'light' | 'dark' themeParams: Record HapticFeedback?: { impactOccurred: (type: 'light' | 'medium' | 'heavy') => void notificationOccurred: (type: 'error' | 'success' | 'warning') => void selectionChanged: () => void } MainButton?: { setText: (text: string) => void show: () => void hide: () => void onClick: (cb: () => void) => void offClick: (cb: () => void) => void } BackButton?: { show: () => void hide: () => void onClick: (cb: () => void) => void offClick: (cb: () => void) => void } } } } }