smartyellow/docx-js
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Multiple tab stops

Browse Source
This commit is contained in:
Dolan
2019-10-09 20:56:31 +01:00
parent 0d4c7a5fc0
commit 40d1a3a7c2
8 changed files with 92 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
demo/10-my-cv.ts
View File

@ -1,7 +1,7 @@
// Generate a CV // Generate a CV
// Import from 'docx' rather than '../build' if you install from npm // Import from 'docx' rather than '../build' if you install from npm
import * as fs from "fs"; import * as fs from "fs";
import { AlignmentType, Document, HeadingLevel, Packer, Paragraph, TabStopPosition, TextRun } from "../build"; import { AlignmentType, Document, HeadingLevel, Packer, Paragraph, TabStopPosition, TabStopType, TextRun } from "../build";
// tslint:disable:no-shadowed-variable // tslint:disable:no-shadowed-variable
@ -226,11 +226,12 @@ class DocumentCreator {
public createInstitutionHeader(institutionName: string, dateText: string): Paragraph { public createInstitutionHeader(institutionName: string, dateText: string): Paragraph {
return new Paragraph({ return new Paragraph({
tabStop: { tabStops: [
right: { {
type: TabStopType.RIGHT,
position: TabStopPosition.MAX, position: TabStopPosition.MAX,
}, },
}, ],
children: [ children: [
new TextRun({ new TextRun({
text: institutionName, text: institutionName,

63
docs/usage/tab-stops.md
View File

@ -13,11 +13,12 @@ Simply call the relevant methods on the paragraph listed below. Then just add a
```ts ```ts
const paragraph = new Paragraph({ const paragraph = new Paragraph({
children: [new TextRun("Hey everyone").bold(), new TextRun("11th November 1999").tab()], children: [new TextRun("Hey everyone").bold(), new TextRun("11th November 1999").tab()],
tabStop: { tabStops: [
right: { {
type: TabStopType.RIGHT,
position: TabStopPosition.MAX, position: TabStopPosition.MAX,
}, },
}, ],
}); });
``` ```
@ -26,28 +27,49 @@ The example above will create a left aligned text, and a right aligned text on t
```ts ```ts
const paragraph = new Paragraph({ const paragraph = new Paragraph({
children: [new TextRun("Second tab stop here I come!").tab().tab()], children: [new TextRun("Second tab stop here I come!").tab().tab()],
tabStop: { tabStops: [
right: { {
type: TabStopType.RIGHT,
position: TabStopPosition.MAX, position: TabStopPosition.MAX,
}, },
left: { {
type: TabStopType.LEFT,
position: 1000, position: 1000,
}, },
}, ],
}); });
``` ```
The above shows the use of two tab stops, and how to select/use it. The above shows the use of two tab stops, and how to select/use it.
You can add multiple tab stops of the same `type` too.
```ts
const paragraph = new Paragraph({
children: [new TextRun("Multiple tab stops!").tab().tab()],
tabStops: [
{
type: TabStopType.RIGHT,
position: TabStopPosition.MAX,
},
{
type: TabStopType.RIGHT,
position: 1000,
},
],
});
```
## Left Tab Stop ## Left Tab Stop
```ts ```ts
const paragraph = new Paragraph({ const paragraph = new Paragraph({
tabStop: { tabStops: [
left: { {
type: TabStopType.LEFT,
position: 2268, position: 2268,
}, },
}, ],
}); });
``` ```
@ -57,11 +79,12 @@ const paragraph = new Paragraph({
```ts ```ts
const paragraph = new Paragraph({ const paragraph = new Paragraph({
tabStop: { tabStops: [
center: { {
type: TabStopType.CENTER,
position: 2268, position: 2268,
}, },
}, ],
}); });
``` ```
@ -71,11 +94,12 @@ const paragraph = new Paragraph({
```ts ```ts
const paragraph = new Paragraph({ const paragraph = new Paragraph({
tabStop: { tabStops: [
right: { {
type: TabStopType.RIGHT,
position: 2268, position: 2268,
}, },
}, ],
}); });
``` ```
@ -85,11 +109,12 @@ const paragraph = new Paragraph({
```ts ```ts
const paragraph = new Paragraph({ const paragraph = new Paragraph({
tabStop: { tabStops: [
right: { {
type: TabStopType.RIGHT,
position: TabStopPosition.MAX, position: TabStopPosition.MAX,
}, },
}, ],
}); });
``` ```

8
src/file/numbering/level.ts
View File

@ -7,9 +7,9 @@ import {
ISpacingProperties, ISpacingProperties,
KeepLines, KeepLines,
KeepNext, KeepNext,
LeftTabStop,
RightTabStop,
Spacing, Spacing,
TabStop,
TabStopType,
ThematicBreak, ThematicBreak,
} from "../paragraph/formatting"; } from "../paragraph/formatting";
import { ParagraphProperties } from "../paragraph/properties"; import { ParagraphProperties } from "../paragraph/properties";
@ -237,11 +237,11 @@ export class LevelBase extends XmlComponent {
} }
public rightTabStop(position: number): Level { public rightTabStop(position: number): Level {
return this.addParagraphProperty(new RightTabStop(position)); return this.addParagraphProperty(new TabStop(TabStopType.RIGHT, position));
} }
public leftTabStop(position: number): Level { public leftTabStop(position: number): Level {
this.addParagraphProperty(new LeftTabStop(position)); this.addParagraphProperty(new TabStop(TabStopType.LEFT, position));
return this; return this;
} }

10
src/file/paragraph/formatting/tab-stop.spec.ts
View File

@ -2,13 +2,13 @@ import { assert } from "chai";
import { Utility } from "tests/utility"; import { Utility } from "tests/utility";
import { LeaderType, LeftTabStop, RightTabStop } from "./tab-stop"; import { LeaderType, TabStop, TabStopType } from "./tab-stop";
describe("LeftTabStop", () => { describe("LeftTabStop", () => {
let tabStop: LeftTabStop; let tabStop: TabStop;
beforeEach(() => { beforeEach(() => {
tabStop = new LeftTabStop(100); tabStop = new TabStop(TabStopType.LEFT, 100);
}); });
describe("#constructor()", () => { describe("#constructor()", () => {
@ -29,10 +29,10 @@ describe("LeftTabStop", () => {
}); });
describe("RightTabStop", () => { describe("RightTabStop", () => {
let tabStop: RightTabStop; let tabStop: TabStop;
beforeEach(() => { beforeEach(() => {
tabStop = new RightTabStop(100, LeaderType.DOT); tabStop = new TabStop(TabStopType.RIGHT, 100, LeaderType.DOT);
}); });
describe("#constructor()", () => { describe("#constructor()", () => {

28
src/file/paragraph/formatting/tab-stop.ts
View File

@ -2,13 +2,13 @@
import { XmlAttributeComponent, XmlComponent } from "file/xml-components"; import { XmlAttributeComponent, XmlComponent } from "file/xml-components";
export class TabStop extends XmlComponent { export class TabStop extends XmlComponent {
constructor(tab: TabStopItem) { constructor(type: TabStopType, position: number, leader?: LeaderType) {
super("w:tabs"); super("w:tabs");
this.root.push(tab); this.root.push(new TabStopItem(type, position, leader));
} }
} }
export enum TabValue { export enum TabStopType {
LEFT = "left", LEFT = "left",
RIGHT = "right", RIGHT = "right",
CENTER = "center", CENTER = "center",
@ -33,7 +33,7 @@ export enum TabStopPosition {
} }
export class TabAttributes extends XmlAttributeComponent<{ export class TabAttributes extends XmlAttributeComponent<{
readonly val: TabValue; readonly val: TabStopType;
readonly pos: string | number; readonly pos: string | number;
readonly leader?: LeaderType; readonly leader?: LeaderType;
}> { }> {
@ -41,7 +41,7 @@ export class TabAttributes extends XmlAttributeComponent<{
} }
export class TabStopItem extends XmlComponent { export class TabStopItem extends XmlComponent {
constructor(value: TabValue, position: string | number, leader?: LeaderType) { constructor(value: TabStopType, position: string | number, leader?: LeaderType) {
super("w:tab"); super("w:tab");
this.root.push( this.root.push(
new TabAttributes({ new TabAttributes({
@ -52,21 +52,3 @@ export class TabStopItem extends XmlComponent {
); );
} }
} }
export class LeftTabStop extends TabStop {
constructor(position: number, leader?: LeaderType) {
super(new TabStopItem(TabValue.LEFT, position, leader));
}
}
export class RightTabStop extends TabStop {
constructor(position: number, leader?: LeaderType) {
super(new TabStopItem(TabValue.RIGHT, position, leader));
}
}
export class CenterTabStop extends TabStop {
constructor(position: number, leader?: LeaderType) {
super(new TabStopItem(TabValue.CENTER, position, leader));
}
}

30
src/file/paragraph/paragraph.spec.ts
View File

@ -4,7 +4,7 @@ import { Formatter } from "export/formatter";
import { EMPTY_OBJECT } from "file/xml-components"; import { EMPTY_OBJECT } from "file/xml-components";
import { Numbering } from "../numbering"; import { Numbering } from "../numbering";
import { AlignmentType, HeadingLevel, LeaderType, PageBreak, TabStopPosition } from "./formatting"; import { AlignmentType, HeadingLevel, LeaderType, PageBreak, TabStopPosition, TabStopType } from "./formatting";
import { Paragraph } from "./paragraph"; import { Paragraph } from "./paragraph";
describe("Paragraph", () => { describe("Paragraph", () => {
@ -256,11 +256,12 @@ describe("Paragraph", () => {
describe("#maxRightTabStop()", () => { describe("#maxRightTabStop()", () => {
it("should add right tab stop to JSON", () => { it("should add right tab stop to JSON", () => {
const paragraph = new Paragraph({ const paragraph = new Paragraph({
tabStop: { tabStops: [
right: { {
type: TabStopType.RIGHT,
position: TabStopPosition.MAX, position: TabStopPosition.MAX,
}, },
}, ],
}); });
const tree = new Formatter().format(paragraph); const tree = new Formatter().format(paragraph);
expect(tree).to.deep.equal({ expect(tree).to.deep.equal({
@ -289,12 +290,13 @@ describe("Paragraph", () => {
describe("#leftTabStop()", () => { describe("#leftTabStop()", () => {
it("should add leftTabStop to JSON", () => { it("should add leftTabStop to JSON", () => {
const paragraph = new Paragraph({ const paragraph = new Paragraph({
tabStop: { tabStops: [
left: { {
type: TabStopType.LEFT,
position: 100, position: 100,
leader: LeaderType.HYPHEN, leader: LeaderType.HYPHEN,
}, },
}, ],
}); });
const tree = new Formatter().format(paragraph); const tree = new Formatter().format(paragraph);
expect(tree).to.deep.equal({ expect(tree).to.deep.equal({
@ -324,12 +326,13 @@ describe("Paragraph", () => {
describe("#rightTabStop()", () => { describe("#rightTabStop()", () => {
it("should add rightTabStop to JSON", () => { it("should add rightTabStop to JSON", () => {
const paragraph = new Paragraph({ const paragraph = new Paragraph({
tabStop: { tabStops: [
right: { {
type: TabStopType.RIGHT,
position: 100, position: 100,
leader: LeaderType.DOT, leader: LeaderType.DOT,
}, },
}, ],
}); });
const tree = new Formatter().format(paragraph); const tree = new Formatter().format(paragraph);
expect(tree).to.deep.equal({ expect(tree).to.deep.equal({
@ -359,12 +362,13 @@ describe("Paragraph", () => {
describe("#centerTabStop()", () => { describe("#centerTabStop()", () => {
it("should add centerTabStop to JSON", () => { it("should add centerTabStop to JSON", () => {
const paragraph = new Paragraph({ const paragraph = new Paragraph({
tabStop: { tabStops: [
center: { {
type: TabStopType.CENTER,
position: 100, position: 100,
leader: LeaderType.MIDDLE_DOT, leader: LeaderType.MIDDLE_DOT,
}, },
}, ],
}); });
const tree = new Formatter().format(paragraph); const tree = new Formatter().format(paragraph);
expect(tree).to.deep.equal({ expect(tree).to.deep.equal({

31
src/file/paragraph/paragraph.ts
View File

@ -11,17 +11,12 @@ import { KeepLines, KeepNext } from "./formatting/keep";
import { PageBreak, PageBreakBefore } from "./formatting/page-break"; import { PageBreak, PageBreakBefore } from "./formatting/page-break";
import { ContextualSpacing, ISpacingProperties, Spacing } from "./formatting/spacing"; import { ContextualSpacing, ISpacingProperties, Spacing } from "./formatting/spacing";
import { HeadingLevel, Style } from "./formatting/style"; import { HeadingLevel, Style } from "./formatting/style";
import { CenterTabStop, LeaderType, LeftTabStop, RightTabStop, TabStopPosition } from "./formatting/tab-stop"; import { LeaderType, TabStop, TabStopPosition, TabStopType } from "./formatting/tab-stop";
import { NumberProperties } from "./formatting/unordered-list"; import { NumberProperties } from "./formatting/unordered-list";
import { Bookmark, Hyperlink, OutlineLevel } from "./links"; import { Bookmark, Hyperlink, OutlineLevel } from "./links";
import { ParagraphProperties } from "./properties"; import { ParagraphProperties } from "./properties";
import { PictureRun, Run, SequentialIdentifier, SymbolRun, TextRun } from "./run"; import { PictureRun, Run, SequentialIdentifier, SymbolRun, TextRun } from "./run";
interface ITabStopOptions {
readonly position: number | TabStopPosition;
readonly leader?: LeaderType;
}
export interface IParagraphOptions { export interface IParagraphOptions {
readonly text?: string; readonly text?: string;
readonly border?: IBorderOptions; readonly border?: IBorderOptions;
@ -36,11 +31,11 @@ export interface IParagraphOptions {
readonly indent?: IIndentAttributesProperties; readonly indent?: IIndentAttributesProperties;
readonly keepLines?: boolean; readonly keepLines?: boolean;
readonly keepNext?: boolean; readonly keepNext?: boolean;
readonly tabStop?: { readonly tabStops?: Array<{
readonly left?: ITabStopOptions; readonly position: number | TabStopPosition;
readonly right?: ITabStopOptions; readonly type: TabStopType;
readonly center?: ITabStopOptions; readonly leader?: LeaderType;
}; }>;
readonly style?: string; readonly style?: string;
readonly bullet?: { readonly bullet?: {
readonly level: number; readonly level: number;
@ -127,17 +122,9 @@ export class Paragraph extends XmlComponent {
this.properties.push(new KeepNext()); this.properties.push(new KeepNext());
} }
if (options.tabStop) { if (options.tabStops) {
if (options.tabStop.left) { for (const tabStop of options.tabStops) {
this.properties.push(new LeftTabStop(options.tabStop.left.position, options.tabStop.left.leader)); this.properties.push(new TabStop(tabStop.type, tabStop.position, tabStop.leader));
}
if (options.tabStop.right) {
this.properties.push(new RightTabStop(options.tabStop.right.position, options.tabStop.right.leader));
}
if (options.tabStop.center) {
this.properties.push(new CenterTabStop(options.tabStop.center.position, options.tabStop.center.leader));
} }
} }

7
src/file/styles/style/paragraph-style.ts
View File

@ -5,13 +5,12 @@ import {
ISpacingProperties, ISpacingProperties,
KeepLines, KeepLines,
KeepNext, KeepNext,
LeftTabStop,
OutlineLevel, OutlineLevel,
ParagraphProperties, ParagraphProperties,
Spacing, Spacing,
ThematicBreak, ThematicBreak,
} from "file/paragraph"; } from "file/paragraph";
import { IIndentAttributesProperties, RightTabStop } from "file/paragraph/formatting"; import { IIndentAttributesProperties, TabStop, TabStopType } from "file/paragraph/formatting";
import * as formatting from "file/paragraph/run/formatting"; import * as formatting from "file/paragraph/run/formatting";
import { RunProperties } from "file/paragraph/run/properties"; import { RunProperties } from "file/paragraph/run/properties";
import { UnderlineType } from "file/paragraph/run/underline"; import { UnderlineType } from "file/paragraph/run/underline";
@ -181,11 +180,11 @@ export class ParagraphStyle extends Style {
} }
if (options.paragraph.rightTabStop) { if (options.paragraph.rightTabStop) {
this.paragraphProperties.push(new RightTabStop(options.paragraph.rightTabStop)); this.paragraphProperties.push(new TabStop(TabStopType.RIGHT, options.paragraph.rightTabStop));
} }
if (options.paragraph.leftTabStop) { if (options.paragraph.leftTabStop) {
this.paragraphProperties.push(new LeftTabStop(options.paragraph.leftTabStop)); this.paragraphProperties.push(new TabStop(TabStopType.LEFT, options.paragraph.leftTabStop));
} }
if (options.paragraph.indent) { if (options.paragraph.indent) {