a11y: add DOCX metadata, image placeholders, table headers
This commit is contained in:
@@ -224,7 +224,8 @@ export const Preview: React.FC<PreviewProps> = ({
|
|||||||
palette: template.typography?.colors,
|
palette: template.typography?.colors,
|
||||||
id: template.id,
|
id: template.id,
|
||||||
page: template.page,
|
page: template.page,
|
||||||
useTableHeaders
|
useTableHeaders,
|
||||||
|
inputFileName
|
||||||
});
|
});
|
||||||
|
|
||||||
const arrayBuffer = await blob.arrayBuffer();
|
const arrayBuffer = await blob.arrayBuffer();
|
||||||
|
|||||||
@@ -48,6 +48,7 @@ export interface ConversionOptions {
|
|||||||
id?: string;
|
id?: string;
|
||||||
page?: any;
|
page?: any;
|
||||||
useTableHeaders?: boolean;
|
useTableHeaders?: boolean;
|
||||||
|
inputFileName?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Transform text to all caps if needed
|
// Transform text to all caps if needed
|
||||||
@@ -622,6 +623,12 @@ export const generateDocxDocument = async (
|
|||||||
// Create paragraph for table cell
|
// Create paragraph for table cell
|
||||||
const paragraph = new Paragraph({
|
const paragraph = new Paragraph({
|
||||||
children: runs.length > 0 ? runs : [new TextRun({ text: headerEl.textContent || '', font: headerFont, size: headerSize, color: headerColor, bold: true })],
|
children: runs.length > 0 ? runs : [new TextRun({ text: headerEl.textContent || '', font: headerFont, size: headerSize, color: headerColor, bold: true })],
|
||||||
|
heading: level === 1 ? HeadingLevel.HEADING_1 :
|
||||||
|
level === 2 ? HeadingLevel.HEADING_2 :
|
||||||
|
level === 3 ? HeadingLevel.HEADING_3 :
|
||||||
|
level === 4 ? HeadingLevel.HEADING_4 :
|
||||||
|
level === 5 ? HeadingLevel.HEADING_5 :
|
||||||
|
HeadingLevel.HEADING_6,
|
||||||
alignment: mapAlignment(cfg.align),
|
alignment: mapAlignment(cfg.align),
|
||||||
spacing: {
|
spacing: {
|
||||||
before: 0,
|
before: 0,
|
||||||
@@ -777,7 +784,8 @@ export const generateDocxDocument = async (
|
|||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
rows.push(new TableRow({ children: cells }));
|
const hasThCells = Array.from(rowEl.querySelectorAll('th')).length > 0;
|
||||||
|
rows.push(new TableRow({ children: cells, tableHeader: hasThCells }));
|
||||||
}
|
}
|
||||||
|
|
||||||
return new Table({
|
return new Table({
|
||||||
@@ -1195,6 +1203,23 @@ export const generateDocxDocument = async (
|
|||||||
return results;
|
return results;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Images - produce accessible placeholder text
|
||||||
|
if (tag === 'img') {
|
||||||
|
const alt = el.getAttribute('alt') || '';
|
||||||
|
const placeholderText = alt ? `[Image: ${alt}]` : '[Image]';
|
||||||
|
results.push(new Paragraph({
|
||||||
|
children: [new TextRun({
|
||||||
|
text: placeholderText,
|
||||||
|
font: body.font,
|
||||||
|
size: pt(body.size),
|
||||||
|
color: formatColor(resolveColorToHex(body.color) || '666666'),
|
||||||
|
italics: true,
|
||||||
|
})],
|
||||||
|
spacing: { before: 120, after: 120 },
|
||||||
|
}));
|
||||||
|
return results;
|
||||||
|
}
|
||||||
|
|
||||||
// HR
|
// HR
|
||||||
if (tag === 'hr') {
|
if (tag === 'hr') {
|
||||||
const hrConfig = elements?.hr;
|
const hrConfig = elements?.hr;
|
||||||
@@ -1229,6 +1254,9 @@ export const generateDocxDocument = async (
|
|||||||
|
|
||||||
// Build document options
|
// Build document options
|
||||||
const documentOptions: any = {
|
const documentOptions: any = {
|
||||||
|
title: options.inputFileName || 'Document',
|
||||||
|
description: 'Generated by TypoGenie',
|
||||||
|
creator: 'TypoGenie',
|
||||||
styles: {
|
styles: {
|
||||||
default: {
|
default: {
|
||||||
document: {
|
document: {
|
||||||
|
|||||||
Reference in New Issue
Block a user