Contact Me :
dev.romikmakavana@gmail.com
by Romik Makavana
\", // Custom HTML content to display in the header left side\n marginTop: 20, // Top margin for pages\n marginBottom: 20, // Bottom margin for pages\n marginLeft: 50, // Left margin for pages\n marginRight: 50, // Right margin for pages\n contentMarginTop: 10, // Top margin for content within pages\n contentMarginBottom: 10, // Bottom margin for content within pages\n // Optional: Per-page header/footer customization\n customHeader: {\n 2: { headerLeft: \"Page 2 Header\", headerRight: \"Page {page}\" }\n },\n customFooter: {\n 3: { footerLeft: \"Page 3 Footer\", footerRight: \"Page {page}\" }\n },\n // Optional: Click callbacks\n onHeaderClick: ({ event, pageNumber }) => {\n console.log(`Header clicked on page ${pageNumber}`)\n },\n onFooterClick: ({ event, pageNumber }) => {\n console.log(`Footer clicked on page ${pageNumber}`)\n },\n }),\n ],\n})\n\n// Example: Using predefined page sizes\neditor.chain().focus().updatePageSize(PAGE_SIZES.A4).run()\n\n// Example: Dynamic updates\neditor.chain().focus()\n .updatePageHeight(1000)\n .updatePageWidth(600)\n .updateMargins({ top: 30, bottom: 30, left: 60, right: 60 })\n .updateHeaderContent('Document Title', 'Page {page}')\n .updateFooterContent('Confidential', 'Page {page} of {total}')\n .run()\n```\n\n### Per-Page Header/Footer Customization\n\nYou can define different headers and footers for specific pages:\n\n```typescript\nPaginationPlus.configure({\n // Default header/footer for all pages\n headerLeft: \"Default Header\",\n headerRight: \"Page {page}\",\n footerLeft: \"Default Footer\",\n footerRight: \"Page {page}\",\n \n // Custom header for page 2\n customHeader: {\n 2: {\n headerLeft: \"Chapter 2\",\n headerRight: \"Page {page}\"\n }\n },\n \n // Custom footer for page 3\n customFooter: {\n 3: {\n footerLeft: \"Special Footer\",\n footerRight: \"Page {page}\"\n }\n },\n \n // Handle header/footer clicks\n onHeaderClick: ({ event, pageNumber }) => {\n console.log(`Header clicked on page ${pageNumber}`)\n // Your custom logic here\n },\n onFooterClick: ({ event, pageNumber }) => {\n console.log(`Footer clicked on page ${pageNumber}`)\n // Your custom logic here\n }\n})\n```\n\n### Table Pagination\n\nKey points for table pagination:\n- Tables will automatically split across pages when they exceed the page height\n- To split table across pages, you have to use these extensions\n- List : TablePlus, TableRowPlus, TableCellPlus, TableHeaderPlus\n\n### Configuration Options\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `pageHeight` | number | 800 | Height of each page in pixels |\n| `pageWidth` | number | 789 | Width of each page in pixels |\n| `pageGap` | number | 50 | Gap between pages in pixels |\n| `pageGapBorderSize` | number | 1 | Border size for page gaps |\n| `pageGapBorderColor` | string | \"#e5e5e5\" | Border color for page gaps |\n| `pageBreakBackground` | string | \"#ffffff\" | Background color for page gaps |\n| `footerRight` | string | \"{page}\" | Custom HTML content to display in the footer right side (supports multiline and rich text) |\n| `footerLeft` | string | \"\" | Custom HTML content to display in the footer left side (supports multiline and rich text) |\n| `headerRight` | string | \"\" | Custom HTML content to display in the header right side (supports multiline and rich text) |\n| `headerLeft` | string | \"\" | Custom HTML content to display in the header left side (supports multiline and rich text) |\n| `marginTop` | number | 20 | Top margin for pages |\n| `marginBottom` | number | 20 | Bottom margin for pages |\n| `marginLeft` | number | 50 | Left margin for pages |\n| `marginRight` | number | 50 | Right margin for pages |\n| `contentMarginTop` | number | 10 | Top margin for content within pages |\n| `contentMarginBottom` | number | 10 | Bottom margin for content within pages |\n| `customHeader` | `Record