sevenhill/QOffice
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Support full QWord heading hierarchy in DOCX

Browse Source
This commit is contained in:
Курнат Андрей
2026-06-02 06:43:36 +03:00
parent 1c03ec168c
commit c75efaa766
5 changed files with 52 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/features/qword/QWord.tsx
+3
View File
@@ -129,6 +129,9 @@ const styleGalleryOptions = [
{ value: "h1", label: "Заголовок 1" },
{ value: "h2", label: "Заголовок 2" },
{ value: "h3", label: "Заголовок 3" },
{ value: "h4", label: "Заголовок 4" },
{ value: "h5", label: "Заголовок 5" },
{ value: "h6", label: "Заголовок 6" },
{ value: "blockquote", label: "Цитата" }
];
src/io/wordOffice.test.ts
+11 -2
View File
@@ -11,6 +11,9 @@ describe("wordOffice helpers", () => {
<h1>План проекта</h1>
<h2>Задачи</h2>
<h3>Контроль качества</h3>
<h4>Сценарии</h4>
<h5>Шаги</h5>
<h6>Детали</h6>
<p>Первый абзац.</p>
<ul><li>Подготовить документ</li><li>Проверить таблицу</li></ul>
`);
@@ -19,6 +22,9 @@ describe("wordOffice helpers", () => {
{ type: "heading", level: 1, text: "План проекта", runs: [{ text: "План проекта" }] },
{ type: "heading", level: 2, text: "Задачи", runs: [{ text: "Задачи" }] },
{ type: "heading", level: 3, text: "Контроль качества", runs: [{ text: "Контроль качества" }] },
{ type: "heading", level: 4, text: "Сценарии", runs: [{ text: "Сценарии" }] },
{ type: "heading", level: 5, text: "Шаги", runs: [{ text: "Шаги" }] },
{ type: "heading", level: 6, text: "Детали", runs: [{ text: "Детали" }] },
{ type: "paragraph", text: "Первый абзац.", runs: [{ text: "Первый абзац." }] },
{
type: "list",
@@ -181,12 +187,15 @@ describe("wordOffice helpers", () => {
expect(documentXml).toMatch(/<w:t[^>]*>Line 1<\/w:t>[\s\S]*<w:br\/>[\s\S]*<w:t[^>]*>Line 2<\/w:t>/);
});
it("записывает h3 как стиль Heading3 в XML экспортированного DOCX", async () => {
const blob = await exportDocxBlob("Заголовок3.docx", "<h3>Подраздел</h3>");
it("записывает h3-h6 как стили Heading3-Heading6 в XML экспортированного DOCX", async () => {
const blob = await exportDocxBlob("Заголовки.docx", "<h3>Раздел</h3><h4>Подраздел</h4><h5>Сценарий</h5><h6>Деталь</h6>");
const zip = await JSZip.loadAsync(await blob.arrayBuffer());
const documentXml = await zip.file("word/document.xml")?.async("string");
expect(documentXml).toMatch(/<w:pStyle\b[^>]*w:val="Heading3"[^>]*\/>/);
expect(documentXml).toMatch(/<w:pStyle\b[^>]*w:val="Heading4"[^>]*\/>/);
expect(documentXml).toMatch(/<w:pStyle\b[^>]*w:val="Heading5"[^>]*\/>/);
expect(documentXml).toMatch(/<w:pStyle\b[^>]*w:val="Heading6"[^>]*\/>/);
});
it("записывает HTML-разрывы страниц как w:br w:type page в XML экспортированного DOCX", async () => {
src/io/wordOffice.ts
+25 -14
View File
@@ -39,8 +39,10 @@ export interface WordParagraphIndent {
hanging?: number;
}
export type WordHeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
export type WordBlock =
| { type: "heading"; level: 1 | 2 | 3; text: string; runs: WordInlineRun[]; alignment?: WordParagraphAlignment; indent?: WordParagraphIndent; bookmark?: string }
| { type: "heading"; level: WordHeadingLevel; text: string; runs: WordInlineRun[]; alignment?: WordParagraphAlignment; indent?: WordParagraphIndent; bookmark?: string }
| { type: "paragraph"; text: string; runs: WordInlineRun[]; alignment?: WordParagraphAlignment; indent?: WordParagraphIndent; bookmark?: string }
| { type: "list"; ordered: boolean; items: WordListItem[] }
| { type: "table"; rows: string[][] }
@@ -111,7 +113,10 @@ const mammothStyleMap = [
"p[style-name='Title'] => h1:fresh",
"p[style-name='Heading 1'] => h1:fresh",
"p[style-name='Heading 2'] => h2:fresh",
"p[style-name='Heading 3'] => h3:fresh"
"p[style-name='Heading 3'] => h3:fresh",
"p[style-name='Heading 4'] => h4:fresh",
"p[style-name='Heading 5'] => h5:fresh",
"p[style-name='Heading 6'] => h6:fresh"
];
const xmlParserOptions = {
ignoreAttributes: false,
@@ -239,7 +244,7 @@ export function htmlToWordBlocks(html: string): WordBlock[] {
return;
}
if (tagName === "h1" || tagName === "h2" || tagName === "h3") {
if (isHeadingTagName(tagName)) {
const runs = elementInlineRuns(node);
const text = inlineRunsText(runs);
const alignment = paragraphAlignmentFromElement(node);
@@ -382,20 +387,17 @@ export function wordInlineRunsToTextRunOptions(runs: WordInlineRun[]) {
return runs.map(wordInlineRunToTextRunOption);
}
function headingLevelFromTagName(tagName: string): 1 | 2 | 3 {
if (tagName === "h3") {
return 3;
}
return tagName === "h2" ? 2 : 1;
function isHeadingTagName(tagName: string): tagName is `h${WordHeadingLevel}` {
return /^h[1-6]$/.test(tagName);
}
function docxHeadingLevel(level: 1 | 2 | 3, docx: DocxModule) {
if (level === 3) {
return docx.HeadingLevel.HEADING_3 ?? docx.HeadingLevel.HEADING_2;
}
function headingLevelFromTagName(tagName: `h${WordHeadingLevel}`): WordHeadingLevel {
return Number.parseInt(tagName.slice(1), 10) as WordHeadingLevel;
}
return level === 1 ? docx.HeadingLevel.HEADING_1 : docx.HeadingLevel.HEADING_2;
function docxHeadingLevel(level: WordHeadingLevel, docx: DocxModule) {
const headingKey = `HEADING_${level}`;
return docx.HeadingLevel[headingKey] ?? docx.HeadingLevel.HEADING_2;
}
function wordInlineRunToTextRunOption(run: WordInlineRun) {
@@ -1025,6 +1027,15 @@ function docxParagraphTagName(properties: XmlRecord) {
if (["heading3", "heading 3"].includes(styleValue)) {
return "h3";
}
if (["heading4", "heading 4"].includes(styleValue)) {
return "h4";
}
if (["heading5", "heading 5"].includes(styleValue)) {
return "h5";
}
if (["heading6", "heading 6"].includes(styleValue)) {
return "h6";
}
return "p";
}
src/io/wordOfficeImport.test.ts
+12 -4
View File
@@ -5,13 +5,21 @@ const tinyPngBase64 = "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42
const tinyPngDataUri = `data:image/png;base64,${tinyPngBase64}`;
describe("wordOffice DOCX import", () => {
it("imports DOCX Heading 3 as h3", async () => {
const blob = await exportDocxBlob("Heading3.docx", "<h3>Quality gate</h3>");
const file = new File([blob], "Heading3.docx", { type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document" });
it("imports DOCX Heading 3-6 as h3-h6", async () => {
const blob = await exportDocxBlob("Headings.docx", "<h3>Quality gate</h3><h4>Scenario</h4><h5>Step</h5><h6>Detail</h6>");
const file = new File([blob], "Headings.docx", { type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document" });
const imported = await importDocxFile(file);
expect(imported.html).toContain("<h3>Quality gate</h3>");
expect(htmlToWordBlocks(imported.html)).toEqual([{ type: "heading", level: 3, text: "Quality gate", runs: [{ text: "Quality gate" }] }]);
expect(imported.html).toContain("<h4>Scenario</h4>");
expect(imported.html).toContain("<h5>Step</h5>");
expect(imported.html).toContain("<h6>Detail</h6>");
expect(htmlToWordBlocks(imported.html)).toEqual([
{ type: "heading", level: 3, text: "Quality gate", runs: [{ text: "Quality gate" }] },
{ type: "heading", level: 4, text: "Scenario", runs: [{ text: "Scenario" }] },
{ type: "heading", level: 5, text: "Step", runs: [{ text: "Step" }] },
{ type: "heading", level: 6, text: "Detail", runs: [{ text: "Detail" }] }
]);
});
it("imports DOCX text color and highlight from OOXML", async () => {