import { useEffect, useRef, useState } from 'react' import { api, type ExportFormat } from '../../api/client' // ExportMenu is the "get your writing out of Petal" dropdown. File formats are // plain links to the server's export endpoint (which sets the // Content-Disposition filename, CJK and all). "Print / Save as PDF" calls the // browser print dialog against the print stylesheet, so PDF stays CJK-safe with // no server-side font embedding. Bilingual zh·en labels match Petal's chrome. interface FormatOption { format: ExportFormat emoji: string zh: string en: string } const FORMATS: FormatOption[] = [ { format: 'docx', emoji: '📄', zh: 'Word 文档', en: 'Word (.docx)' }, { format: 'md', emoji: '📝', zh: 'Markdown', en: 'Markdown (.md)' }, { format: 'html', emoji: '🌐', zh: '网页', en: 'Web page (.html)' }, { format: 'txt', emoji: '🧾', zh: '纯文本', en: 'Plain text (.txt)' }, ] interface Props { docId: string } export function ExportMenu({ docId }: Props) { const [open, setOpen] = useState(false) const ref = useRef(null) useEffect(() => { if (!open) return const onDown = (e: MouseEvent) => { if (!ref.current?.contains(e.target as Node)) setOpen(false) } document.addEventListener('mousedown', onDown) return () => document.removeEventListener('mousedown', onDown) }, [open]) return (

{open && ( ) }