Merge pull request #133 from dolanmiu/feat/readme-update
Add table cell margin
This commit is contained in:
@ -2,7 +2,8 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<script src="../build/index.web.js"></script>
|
||||
<script src="../build/index.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@ -13,7 +14,23 @@
|
||||
|
||||
<script>
|
||||
function generate() {
|
||||
console.log('g');
|
||||
const doc = new Document();
|
||||
|
||||
const paragraph = new Paragraph("Hello World");
|
||||
const institutionText = new TextRun("Foo Bar").bold();
|
||||
const dateText = new TextRun("Github is the best").tab().bold();
|
||||
paragraph.addRun(institutionText);
|
||||
paragraph.addRun(dateText);
|
||||
|
||||
doc.addParagraph(paragraph);
|
||||
|
||||
const packer = new Packer();
|
||||
|
||||
packer.toBlob(doc).then(blob => {
|
||||
console.log(blob);
|
||||
saveAs(blob, "example.docx");
|
||||
console.log("Document created successfully");
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -1,33 +0,0 @@
|
||||
var prompt = require('prompt');
|
||||
var shelljs = require('shelljs');
|
||||
var fs = require('fs');
|
||||
|
||||
console.log('What demo do you wish to run? (Enter a number)');
|
||||
|
||||
var schema = {
|
||||
properties: {
|
||||
number: {
|
||||
pattern: /^[0-9]+$/,
|
||||
message: 'Please enter a number.',
|
||||
required: true
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
prompt.start();
|
||||
|
||||
prompt.get(schema, function (err, result) {
|
||||
var demoNumber = result.number;
|
||||
var filePath = `./demo/demo${demoNumber}.ts`;
|
||||
|
||||
if (!fs.existsSync(filePath)) {
|
||||
console.error(`demo${demoNumber} does not exist: ${filePath}`);
|
||||
return;
|
||||
}
|
||||
console.log(`Running demo ${demoNumber}`);
|
||||
if (shelljs.exec(`npm run ts-node -- ${filePath}`).code === 0) {
|
||||
console.log("Document created successfully");
|
||||
} else {
|
||||
console.error('Something went wrong with the demo');
|
||||
}
|
||||
});
|
34
demo/index.ts
Normal file
34
demo/index.ts
Normal file
@ -0,0 +1,34 @@
|
||||
// tslint:disable:no-console
|
||||
import * as fs from "fs";
|
||||
import * as prompt from "prompt";
|
||||
import * as shelljs from "shelljs";
|
||||
|
||||
console.log("What demo do you wish to run? (Enter a number)");
|
||||
|
||||
const schema = {
|
||||
properties: {
|
||||
number: {
|
||||
pattern: /^[0-9]+$/,
|
||||
message: "Please enter a number.",
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
prompt.start();
|
||||
|
||||
prompt.get(schema, (_, result) => {
|
||||
const demoNumber = result.number;
|
||||
const filePath = `./demo/demo${demoNumber}.ts`;
|
||||
|
||||
if (!fs.existsSync(filePath)) {
|
||||
console.error(`demo${demoNumber} does not exist: ${filePath}`);
|
||||
return;
|
||||
}
|
||||
console.log(`Running demo ${demoNumber}`);
|
||||
if (shelljs.exec(`npm run ts-node -- ${filePath}`).code === 0) {
|
||||
console.log("Document created successfully");
|
||||
} else {
|
||||
console.error("Something went wrong with the demo");
|
||||
}
|
||||
});
|
@ -13,7 +13,7 @@
|
||||
"tsc": "rimraf ./build && tsc -p .",
|
||||
"webpack": "rimraf ./build && webpack",
|
||||
"build.web": "webpack --config webpack.web.config.js",
|
||||
"demo": "npm run build && node ./demo",
|
||||
"demo": "npm run build && npm run ts-node ./demo",
|
||||
"typedoc": "typedoc src/index.ts",
|
||||
"style": "prettier -l \"src/**/*.ts\"",
|
||||
"style.fix": "prettier \"src/**/*.ts\" --write",
|
||||
|
@ -2,6 +2,7 @@ import { expect } from "chai";
|
||||
|
||||
import { Formatter } from "../../export/formatter";
|
||||
import { TableProperties } from "./properties";
|
||||
import { WidthType } from "./table-cell";
|
||||
|
||||
describe("TableProperties", () => {
|
||||
describe("#constructor", () => {
|
||||
@ -14,7 +15,7 @@ describe("TableProperties", () => {
|
||||
|
||||
describe("#setWidth", () => {
|
||||
it("adds a table width property", () => {
|
||||
const tp = new TableProperties().setWidth("dxa", 1234);
|
||||
const tp = new TableProperties().setWidth(WidthType.DXA, 1234);
|
||||
const tree = new Formatter().format(tp);
|
||||
expect(tree).to.deep.equal({
|
||||
"w:tblPr": [{ "w:tblW": [{ _attr: { "w:type": "dxa", "w:w": 1234 } }] }],
|
||||
@ -31,4 +32,15 @@ describe("TableProperties", () => {
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe("#cellMargin", () => {
|
||||
it("adds a table cell top margin", () => {
|
||||
const tp = new TableProperties();
|
||||
tp.CellMargin.addTopMargin(1234, WidthType.DXA);
|
||||
const tree = new Formatter().format(tp);
|
||||
expect(tree).to.deep.equal({
|
||||
"w:tblPr": [{ "w:tblCellMar": [{ "w:top": [{ _attr: { "w:sz": "dxa", "w:w": 1234 } }] }] }],
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
@ -1,13 +1,18 @@
|
||||
import { XmlAttributeComponent, XmlComponent } from "file/xml-components";
|
||||
|
||||
export type WidthTypes = "dxa" | "pct" | "nil" | "auto";
|
||||
import { WidthType } from "./table-cell";
|
||||
import { TableCellMargin } from "./table-cell-margin";
|
||||
|
||||
export class TableProperties extends XmlComponent {
|
||||
private readonly cellMargain: TableCellMargin;
|
||||
|
||||
constructor() {
|
||||
super("w:tblPr");
|
||||
|
||||
this.cellMargain = new TableCellMargin();
|
||||
this.root.push(this.cellMargain);
|
||||
}
|
||||
|
||||
public setWidth(type: WidthTypes, w: number | string): TableProperties {
|
||||
public setWidth(type: WidthType, w: number | string): TableProperties {
|
||||
this.root.push(new PreferredTableWidth(type, w));
|
||||
return this;
|
||||
}
|
||||
@ -21,10 +26,14 @@ export class TableProperties extends XmlComponent {
|
||||
this.root.push(new TableBorders());
|
||||
return this;
|
||||
}
|
||||
|
||||
public get CellMargin(): TableCellMargin {
|
||||
return this.cellMargain;
|
||||
}
|
||||
}
|
||||
|
||||
interface ITableWidth {
|
||||
type: WidthTypes;
|
||||
type: WidthType;
|
||||
w: number | string;
|
||||
}
|
||||
|
||||
@ -33,7 +42,7 @@ class TableWidthAttributes extends XmlAttributeComponent<ITableWidth> {
|
||||
}
|
||||
|
||||
class PreferredTableWidth extends XmlComponent {
|
||||
constructor(type: WidthTypes, w: number | string) {
|
||||
constructor(type: WidthType, w: number | string) {
|
||||
super("w:tblW");
|
||||
this.root.push(new TableWidthAttributes({ type, w }));
|
||||
}
|
||||
|
55
src/file/table/table-cell-margin.ts
Normal file
55
src/file/table/table-cell-margin.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import { IXmlableObject, XmlAttributeComponent, XmlComponent } from "file/xml-components";
|
||||
import { WidthType } from "./table-cell";
|
||||
|
||||
class TableCellMarginAttributes extends XmlAttributeComponent<{ type: WidthType; value: number }> {
|
||||
protected xmlKeys = { value: "w:w", type: "w:sz" };
|
||||
}
|
||||
|
||||
class BaseTableCellMargin extends XmlComponent {
|
||||
public setProperties(value: number, type: WidthType = WidthType.DXA): void {
|
||||
this.root.push(
|
||||
new TableCellMarginAttributes({
|
||||
type: type,
|
||||
value: value,
|
||||
}),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export class TableCellMargin extends XmlComponent {
|
||||
constructor() {
|
||||
super("w:tblCellMar");
|
||||
}
|
||||
|
||||
public prepForXml(): IXmlableObject {
|
||||
return this.root.length > 0 ? super.prepForXml() : "";
|
||||
}
|
||||
|
||||
public addTopMargin(value: number, type: WidthType = WidthType.DXA): void {
|
||||
const top = new BaseTableCellMargin("w:top");
|
||||
|
||||
top.setProperties(value, type);
|
||||
this.root.push(top);
|
||||
}
|
||||
|
||||
public addLeftMargin(value: number, type: WidthType = WidthType.DXA): void {
|
||||
const left = new BaseTableCellMargin("w:left");
|
||||
|
||||
left.setProperties(value, type);
|
||||
this.root.push(left);
|
||||
}
|
||||
|
||||
public addBottomMargin(value: number, type: WidthType = WidthType.DXA): void {
|
||||
const bottom = new BaseTableCellMargin("w:bottom");
|
||||
|
||||
bottom.setProperties(value, type);
|
||||
this.root.push(bottom);
|
||||
}
|
||||
|
||||
public addRightMargin(value: number, type: WidthType = WidthType.DXA): void {
|
||||
const right = new BaseTableCellMargin("w:right");
|
||||
|
||||
right.setProperties(value, type);
|
||||
this.root.push(right);
|
||||
}
|
||||
}
|
@ -4,6 +4,7 @@ import { expect } from "chai";
|
||||
import { Formatter } from "../../export/formatter";
|
||||
import { Paragraph } from "../paragraph";
|
||||
import { Table } from "./";
|
||||
import { WidthType } from "./table-cell";
|
||||
|
||||
const DEFAULT_TABLE_PROPERTIES = {
|
||||
"w:tblBorders": [
|
||||
@ -174,7 +175,7 @@ describe("Table", () => {
|
||||
|
||||
describe("#setWidth", () => {
|
||||
it("sets the preferred width on the table", () => {
|
||||
const table = new Table(2, 2).setWidth("pct", 1000);
|
||||
const table = new Table(2, 2).setWidth(WidthType.PERCENTAGE, 1000);
|
||||
const tree = new Formatter().format(table);
|
||||
expect(tree)
|
||||
.to.have.property("w:tbl")
|
||||
|
@ -12,7 +12,7 @@ import {
|
||||
import { IXmlableObject, XmlComponent } from "file/xml-components";
|
||||
import { Paragraph } from "../paragraph";
|
||||
import { TableGrid } from "./grid";
|
||||
import { TableProperties, WidthTypes } from "./properties";
|
||||
import { TableProperties } from "./properties";
|
||||
|
||||
export class Table extends XmlComponent {
|
||||
private readonly properties: TableProperties;
|
||||
@ -67,7 +67,7 @@ export class Table extends XmlComponent {
|
||||
return this.getRow(row).getCell(col);
|
||||
}
|
||||
|
||||
public setWidth(type: WidthTypes, width: number | string): Table {
|
||||
public setWidth(type: WidthType, width: number | string): Table {
|
||||
this.properties.setWidth(type, width);
|
||||
return this;
|
||||
}
|
||||
|
Reference in New Issue
Block a user