'use client'; import { useEffect, useState } from 'react'; import { Search, MessageSquare } from 'lucide-react'; import { useSearchContext } from '@fumadocs/ui/contexts/search'; import { useI18n } from '@fumadocs/ui/contexts/i18n'; import type { DecimalAPI } from './decimal-widget'; function getDecimal() { return (window as typeof window & { Decimal?: DecimalAPI }).Decimal; } function isWidgetVisible(): boolean { const sidebar = document.querySelector('.decimal-widget-sidebar'); return sidebar?.classList.contains('open') ?? false; } export function toggleDecimalWidget() { const decimal = getDecimal(); if (!decimal) { setTimeout(() => { getDecimal()?.show(); }, 500); return; } isWidgetVisible() ? decimal.hide() : decimal.show(); } export function detectMac(): boolean { try { if ('userAgentData' in navigator) { const platform = (navigator as Navigator & { userAgentData?: { platform?: string } }).userAgentData?.platform; if (platform) { return platform === 'macOS'; } } return /mac/i.test(navigator.platform); } catch { return true; // default to Mac } } function useIsMac() { const [isMac, setIsMac] = useState(true); useEffect(() => { setIsMac(detectMac()); }, []); return isMac; } const handleKeyDown = (e: KeyboardEvent) => { if ((e.metaKey || e.ctrlKey) && e.key === 'i') { e.preventDefault(); toggleDecimalWidget(); } }; function useAskAIShortcut() { useEffect(() => { document.addEventListener('keydown', handleKeyDown); return () => document.removeEventListener('keydown', handleKeyDown); }, []); } /** Desktop: search bar + Ask AI button side by side */ export function SearchAndAskAI() { const { enabled, hotKey, setOpenSearch } = useSearchContext(); const { text } = useI18n(); useAskAIShortcut(); const isMac = useIsMac(); return ( <> {enabled && ( )} ); } /** Mobile: search icon + Ask AI icon, shown below lg breakpoint */ export function SearchAndAskAIMobile() { const { enabled, setOpenSearch } = useSearchContext(); return ( <> {enabled && ( )} ); }