diff --git a/packages/component/src/components/affine-watermark/index.css.ts b/packages/component/src/components/affine-watermark/index.css.ts index 820a8342b3..cc71ae1624 100644 --- a/packages/component/src/components/affine-watermark/index.css.ts +++ b/packages/component/src/components/affine-watermark/index.css.ts @@ -4,7 +4,7 @@ export const waterMarkStyle = style({ display: 'none', '@media': { print: { - position: 'absolute', + position: 'fixed', bottom: '0', right: '20px', zIndex: 100, diff --git a/packages/component/src/components/page-list/operation-menu-items/export.tsx b/packages/component/src/components/page-list/operation-menu-items/export.tsx index 11c8b5ec62..b827cf16b6 100644 --- a/packages/component/src/components/page-list/operation-menu-items/export.tsx +++ b/packages/component/src/components/page-list/operation-menu-items/export.tsx @@ -1,22 +1,138 @@ import { useAFFiNEI18N } from '@affine/i18n/hooks'; +import type { PageBlockModel } from '@blocksuite/blocks'; import { ContentParser } from '@blocksuite/blocks/content-parser'; import { ArrowRightSmallIcon, ExportIcon, ExportToHtmlIcon, ExportToMarkdownIcon, + ExportToPdfIcon, } from '@blocksuite/icons'; import { useRef } from 'react'; import { Menu, MenuItem } from '../../..'; import type { CommonMenuItemProps } from './types'; -export const Export = ({ +const ExportToPdfMenuItem = ({ onSelect, +}: CommonMenuItemProps<{ type: 'pdf' }>) => { + const t = useAFFiNEI18N(); + const contentParserRef = useRef(); + return ( + <> + {globalThis.currentEditor!.mode === 'page' && ( + { + if (!contentParserRef.current) { + contentParserRef.current = new ContentParser( + globalThis.currentEditor!.page + ); + } + const result = await window.apis?.export.savePDFFileAs( + ( + globalThis.currentEditor!.page.root as PageBlockModel + ).title.toString() + ); + if (result !== undefined) { + return; + } + contentParserRef.current.exportPdf(); + onSelect?.({ type: 'pdf' }); + }} + icon={} + > + {t['Export to PDF']()} + + )} + + ); +}; + +const ExportToHtmlMenuItem = ({ + onSelect, +}: CommonMenuItemProps<{ type: 'html' }>) => { + const t = useAFFiNEI18N(); + const contentParserRef = useRef(); + return ( + <> + { + if (!contentParserRef.current) { + contentParserRef.current = new ContentParser( + globalThis.currentEditor!.page + ); + } + contentParserRef.current.exportHtml(); + onSelect?.({ type: 'html' }); + }} + icon={} + > + {t['Export to HTML']()} + + + ); +}; + +// const ExportToPngMenuItem = ({ +// onSelect, +// }: CommonMenuItemProps<{ type: 'png' }>) => { +// const t = useAFFiNEI18N(); +// const contentParserRef = useRef(); +// return ( +// <> +// {globalThis.currentEditor!.mode === 'page' && ( +// { +// if (!contentParserRef.current) { +// contentParserRef.current = new ContentParser( +// globalThis.currentEditor!.page +// ); +// } +// contentParserRef.current.exportPng(); +// onSelect?.({ type: 'png' }); +// }} +// icon={} +// > +// {t['Export to PNG']()} +// +// )} +// +// ); +// }; + +const ExportToMarkdownMenuItem = ({ + onSelect, +}: CommonMenuItemProps<{ type: 'markdown' }>) => { + const t = useAFFiNEI18N(); + const contentParserRef = useRef(); + return ( + <> + { + if (!contentParserRef.current) { + contentParserRef.current = new ContentParser( + globalThis.currentEditor!.page + ); + } + contentParserRef.current.exportMarkdown(); + onSelect?.({ type: 'markdown' }); + }} + icon={} + > + {t['Export to Markdown']()} + + + ); +}; + +export const Export = ({ onItemClick, }: CommonMenuItemProps<{ type: 'markdown' | 'html' | 'pdf' | 'png' }>) => { const t = useAFFiNEI18N(); - const contentParserRef = useRef(); return ( - {/* { - if (!contentParserRef.current) { - contentParserRef.current = new ContentParser( - globalThis.currentEditor!.page - ); - } - const result = await window.apis?.export.savePDFFileAs( - ( - globalThis.currentEditor!.page.root as PageBlockModel - ).title.toString() - ); - if (result !== undefined) { - return; - } - contentParserRef.current.exportPdf(); - onSelect?.({ type: 'pdf' }); - }} - icon={} - > - {t['Export to PDF']()} - */} - { - if (!contentParserRef.current) { - contentParserRef.current = new ContentParser( - globalThis.currentEditor!.page - ); - } - contentParserRef.current.exportHtml(); - onSelect?.({ type: 'html' }); - }} - icon={} - > - {t['Export to HTML']()} - - {/* { - if (!contentParserRef.current) { - contentParserRef.current = new ContentParser( - globalThis.currentEditor!.page - ); - } - contentParserRef.current.exportPng(); - onSelect?.({ type: 'png' }); - }} - icon={} - > - {t['Export to PNG']()} - */} - { - if (!contentParserRef.current) { - contentParserRef.current = new ContentParser( - globalThis.currentEditor!.page - ); - } - contentParserRef.current.exportMarkdown(); - onSelect?.({ type: 'markdown' }); - }} - icon={} - > - {t['Export to Markdown']()} - + + + {/* */} + } > diff --git a/packages/component/src/components/workspace/index.css.ts b/packages/component/src/components/workspace/index.css.ts index 7456cbdb99..e4244a9c68 100644 --- a/packages/component/src/components/workspace/index.css.ts +++ b/packages/component/src/components/workspace/index.css.ts @@ -58,6 +58,11 @@ export const mainContainerStyle = style({ borderRadius: '8px', overflow: 'hidden', boxShadow: 'var(--affine-shadow-1)', + '@media': { + print: { + overflow: 'visible', + }, + }, }, }, });