Compare commits
21 Commits
Author | SHA1 | Date | |
---|---|---|---|
20e6b98770 | |||
5ae824358c | |||
2654799822 | |||
6245635b86 | |||
b4f1c4dd6a | |||
25a7ce3742 | |||
08bc069cbf | |||
0ebdcc30ed | |||
3eca81d3f5 | |||
faefbae3a1 | |||
370fb098ac | |||
c73019d84c | |||
250a1de71e | |||
012963e90a | |||
632f3cd19b | |||
1c8cd325d7 | |||
7bcdaab2f2 | |||
5b58e520f9 | |||
78f6ea6c44 | |||
b5172e73f9 | |||
49b7ac212d |
@ -10,7 +10,7 @@ script:
|
||||
- npm run style
|
||||
- npm run build
|
||||
- npm run ts-node -- ./demo/1-basic.ts
|
||||
- npm run e2e "My Document.docx"
|
||||
# - npm run e2e "My Document.docx"
|
||||
- npm run ts-node -- ./demo/2-declaritive-styles.ts
|
||||
- npm run ts-node -- ./demo/3-numbering-and-bullet-points.ts
|
||||
- npm run ts-node -- ./demo/4-basic-table.ts
|
||||
@ -20,7 +20,7 @@ script:
|
||||
- npm run ts-node -- ./demo/8-header-footer.ts
|
||||
- npm run ts-node -- ./demo/9-images-in-header-and-footer.ts
|
||||
- npm run ts-node -- ./demo/10-my-cv.ts
|
||||
- npm run e2e "My Document.docx"
|
||||
# - npm run e2e "My Document.docx"
|
||||
- npm run ts-node -- ./demo/11-declaritive-styles-2.ts
|
||||
- npm run ts-node -- ./demo/12-scaling-images.ts
|
||||
- npm run ts-node -- ./demo/13-xml-styles.ts
|
||||
|
@ -27,8 +27,8 @@
|
||||
|
||||
Here are examples of `docx` being used with basic `HTML/JS` in a browser environment:
|
||||
|
||||
* https://codepen.io/anon/pen/dqoVgQ
|
||||
* https://jsfiddle.net/3xhezb5w/2
|
||||
* https://codepen.io/dolanmiu/pen/RwNeObg
|
||||
* https://jsfiddle.net/dolanmiu/kqxrj35u/1/
|
||||
|
||||
Here is an example of `docx` working in `Angular`:
|
||||
|
||||
|
@ -1,7 +1,7 @@
|
||||
// Example of how you would create a table and add data to it
|
||||
// Import from 'docx' rather than '../build' if you install from npm
|
||||
import * as fs from "fs";
|
||||
import { Document, HeadingLevel, Packer, Paragraph, Table, TableCell, TableRow, VerticalAlign } from "../build";
|
||||
import { Document, HeadingLevel, Packer, Paragraph, Table, TableCell, TableRow, VerticalAlign, TextDirection } from "../build";
|
||||
|
||||
const doc = new Document();
|
||||
|
||||
@ -17,6 +17,14 @@ const table = new Table({
|
||||
children: [new Paragraph({}), new Paragraph({})],
|
||||
verticalAlign: VerticalAlign.CENTER,
|
||||
}),
|
||||
new TableCell({
|
||||
children: [new Paragraph({ text: "bottom to top" }), new Paragraph({})],
|
||||
textDirection: TextDirection.BOTTOM_TO_TOP_LEFT_TO_RIGHT,
|
||||
}),
|
||||
new TableCell({
|
||||
children: [new Paragraph({ text: "top to bottom" }), new Paragraph({})],
|
||||
textDirection: TextDirection.TOP_TO_BOTTOM_RIGHT_TO_LEFT,
|
||||
}),
|
||||
],
|
||||
}),
|
||||
new TableRow({
|
||||
@ -38,6 +46,22 @@ const table = new Table({
|
||||
],
|
||||
verticalAlign: VerticalAlign.CENTER,
|
||||
}),
|
||||
new TableCell({
|
||||
children: [
|
||||
new Paragraph({
|
||||
text: "Text above should be vertical from bottom to top",
|
||||
}),
|
||||
],
|
||||
verticalAlign: VerticalAlign.CENTER,
|
||||
}),
|
||||
new TableCell({
|
||||
children: [
|
||||
new Paragraph({
|
||||
text: "Text above should be vertical from top to bottom",
|
||||
}),
|
||||
],
|
||||
verticalAlign: VerticalAlign.CENTER,
|
||||
}),
|
||||
],
|
||||
}),
|
||||
],
|
||||
|
@ -1,7 +1,7 @@
|
||||
// Example on how to add hyperlinks to websites
|
||||
// Import from 'docx' rather than '../build' if you install from npm
|
||||
import * as fs from "fs";
|
||||
import { Document, HyperlinkRef, HyperlinkType, Packer, Paragraph } from "../build";
|
||||
import { Document, HyperlinkRef, HyperlinkType, Packer, Paragraph, Media } from "../build";
|
||||
|
||||
const doc = new Document({
|
||||
hyperlinks: {
|
||||
@ -10,14 +10,24 @@ const doc = new Document({
|
||||
text: "Hyperlink",
|
||||
type: HyperlinkType.EXTERNAL,
|
||||
},
|
||||
myOtherLink: {
|
||||
link: "http://www.google.com",
|
||||
text: "Google Link",
|
||||
type: HyperlinkType.EXTERNAL,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const image1 = Media.addImage(doc, fs.readFileSync("./demo/images/image1.jpeg"));
|
||||
|
||||
doc.addSection({
|
||||
children: [
|
||||
new Paragraph({
|
||||
children: [new HyperlinkRef("myCoolLink")],
|
||||
}),
|
||||
new Paragraph({
|
||||
children: [image1, new HyperlinkRef("myOtherLink")],
|
||||
}),
|
||||
],
|
||||
});
|
||||
|
||||
|
37
demo/51-character-styles.ts
Normal file
37
demo/51-character-styles.ts
Normal file
@ -0,0 +1,37 @@
|
||||
// Custom character styles using JavaScript configuration
|
||||
// Import from 'docx' rather than '../build' if you install from npm
|
||||
import * as fs from "fs";
|
||||
import { Document, Packer, Paragraph, TextRun } from "../build";
|
||||
|
||||
const doc = new Document({
|
||||
styles: {
|
||||
characterStyles: [
|
||||
{
|
||||
id: "myRedStyle",
|
||||
name: "My Wonky Style",
|
||||
basedOn: "Normal",
|
||||
run: {
|
||||
color: "990000",
|
||||
italics: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
});
|
||||
|
||||
doc.addSection({
|
||||
children: [
|
||||
new Paragraph({
|
||||
children: [
|
||||
new TextRun({
|
||||
text: "Foo bar",
|
||||
style: "myRedStyle",
|
||||
}),
|
||||
],
|
||||
}),
|
||||
],
|
||||
});
|
||||
|
||||
Packer.toBuffer(doc).then((buffer) => {
|
||||
fs.writeFileSync("My Document.docx", buffer);
|
||||
});
|
37
demo/52-japanese.ts
Normal file
37
demo/52-japanese.ts
Normal file
@ -0,0 +1,37 @@
|
||||
// Japanese text - Need to use a Japanese font
|
||||
// Import from 'docx' rather than '../build' if you install from npm
|
||||
import * as fs from "fs";
|
||||
import { Document, HeadingLevel, Packer, Paragraph } from "../build";
|
||||
|
||||
const doc = new Document({
|
||||
styles: {
|
||||
paragraphStyles: [
|
||||
{
|
||||
id: "Normal",
|
||||
name: "Normal",
|
||||
basedOn: "Normal",
|
||||
next: "Normal",
|
||||
quickFormat: true,
|
||||
run: {
|
||||
font: "MS Gothic",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
});
|
||||
|
||||
doc.addSection({
|
||||
children: [
|
||||
new Paragraph({
|
||||
text: "KFCを食べるのが好き",
|
||||
heading: HeadingLevel.HEADING_1,
|
||||
}),
|
||||
new Paragraph({
|
||||
text: "こんにちは",
|
||||
}),
|
||||
],
|
||||
});
|
||||
|
||||
Packer.toBuffer(doc).then((buffer) => {
|
||||
fs.writeFileSync("My Document.docx", buffer);
|
||||
});
|
@ -7,7 +7,12 @@
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<meta name="description" content="Generate .docx documents with JavaScript">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||||
<link rel="stylesheet" href="//unpkg.com/docsify/lib/themes/vue.css">
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="//cdn.jsdelivr.net/npm/docsify-darklight-theme@latest/dist/style.min.css"
|
||||
title="docsify-darklight-theme"
|
||||
type="text/css"
|
||||
/>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@ -26,6 +31,10 @@
|
||||
<script src="https://unpkg.com/docsify-copy-code@2"></script>
|
||||
<script src="//unpkg.com/docsify/lib/plugins/search.min.js"></script>
|
||||
<script src="//unpkg.com/prismjs/components/prism-typescript.min.js"></script>
|
||||
<script
|
||||
src="//cdn.jsdelivr.net/npm/docsify-darklight-theme@latest/dist/index.min.js"
|
||||
type="text/javascript">
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
10
package-lock.json
generated
10
package-lock.json
generated
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "docx",
|
||||
"version": "5.0.1",
|
||||
"version": "5.0.2",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
@ -3573,9 +3573,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"handlebars": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.1.2.tgz",
|
||||
"integrity": "sha512-nvfrjqvt9xQ8Z/w0ijewdD/vvWDTOweBUm96NTr66Wfvo1mJenBLwcYmPs3TIBP5ruzYGD7Hx/DaM9RmhroGPw==",
|
||||
"version": "4.5.3",
|
||||
"resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.5.3.tgz",
|
||||
"integrity": "sha512-3yPecJoJHK/4c6aZhSvxOyG4vJKDshV36VHp0iVCDVh7o9w2vwi3NSnL2MMPj3YdduqaBcu7cGbggJQM0br9xA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"neo-async": "^2.6.0",
|
||||
@ -4351,7 +4351,7 @@
|
||||
},
|
||||
"jsesc": {
|
||||
"version": "1.3.0",
|
||||
"resolved": "http://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
|
||||
"resolved": "https://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz",
|
||||
"integrity": "sha1-RsP+yMGJKxKwgz25vHYiF226s0s=",
|
||||
"dev": true
|
||||
},
|
||||
|
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "docx",
|
||||
"version": "5.0.2",
|
||||
"version": "5.1.1",
|
||||
"description": "Easily generate .docx files with JS/TS with a nice declarative API. Works for Node and on the Browser.",
|
||||
"main": "build/index.js",
|
||||
"scripts": {
|
||||
|
@ -158,6 +158,31 @@ export class VAlign extends XmlComponent {
|
||||
}
|
||||
}
|
||||
|
||||
export enum TextDirection {
|
||||
BOTTOM_TO_TOP_LEFT_TO_RIGHT = "btLr",
|
||||
LEFT_TO_RIGHT_TOP_TO_BOTTOM = "lrTb",
|
||||
TOP_TO_BOTTOM_RIGHT_TO_LEFT = "tbRl",
|
||||
}
|
||||
|
||||
class TDirectionAttributes extends XmlAttributeComponent<{ readonly val: TextDirection }> {
|
||||
protected readonly xmlKeys = { val: "w:val" };
|
||||
}
|
||||
|
||||
/**
|
||||
* Text Direction within a table cell
|
||||
*/
|
||||
export class TDirection extends XmlComponent {
|
||||
constructor(value: TextDirection) {
|
||||
super("w:textDirection");
|
||||
|
||||
this.root.push(
|
||||
new TDirectionAttributes({
|
||||
val: value,
|
||||
}),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export enum WidthType {
|
||||
/** Auto. */
|
||||
AUTO = "auto",
|
||||
|
@ -6,6 +6,8 @@ import {
|
||||
GridSpan,
|
||||
TableCellBorders,
|
||||
TableCellWidth,
|
||||
TDirection,
|
||||
TextDirection,
|
||||
VAlign,
|
||||
VerticalAlign,
|
||||
VerticalMerge,
|
||||
@ -61,4 +63,10 @@ export class TableCellProperties extends IgnoreIfEmptyXmlComponent {
|
||||
|
||||
return this;
|
||||
}
|
||||
|
||||
public setTextDirection(type: TextDirection): TableCellProperties {
|
||||
this.root.push(new TDirection(type));
|
||||
|
||||
return this;
|
||||
}
|
||||
}
|
||||
|
@ -5,7 +5,7 @@ import { BorderStyle } from "file/styles";
|
||||
|
||||
import { ShadingType } from "../shading";
|
||||
import { TableCell } from "./table-cell";
|
||||
import { TableCellBorders, TableCellWidth, VerticalAlign, VerticalMergeType, WidthType } from "./table-cell-components";
|
||||
import { TableCellBorders, TableCellWidth, TextDirection, VerticalAlign, VerticalMergeType, WidthType } from "./table-cell-components";
|
||||
|
||||
describe("TableCellBorders", () => {
|
||||
describe("#prepForXml", () => {
|
||||
@ -271,6 +271,34 @@ describe("TableCell", () => {
|
||||
});
|
||||
});
|
||||
|
||||
it("should create with text direction", () => {
|
||||
const cell = new TableCell({
|
||||
children: [],
|
||||
textDirection: TextDirection.BOTTOM_TO_TOP_LEFT_TO_RIGHT,
|
||||
});
|
||||
|
||||
const tree = new Formatter().format(cell);
|
||||
|
||||
expect(tree).to.deep.equal({
|
||||
"w:tc": [
|
||||
{
|
||||
"w:tcPr": [
|
||||
{
|
||||
"w:textDirection": {
|
||||
_attr: {
|
||||
"w:val": "btLr",
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
"w:p": {},
|
||||
},
|
||||
],
|
||||
});
|
||||
});
|
||||
|
||||
it("should create with vertical merge", () => {
|
||||
const cell = new TableCell({
|
||||
children: [],
|
||||
|
@ -7,13 +7,14 @@ import { File } from "../../file";
|
||||
import { ITableShadingAttributesProperties } from "../shading";
|
||||
import { Table } from "../table";
|
||||
import { ITableCellMarginOptions } from "./cell-margin/table-cell-margins";
|
||||
import { VerticalAlign, VerticalMergeType, WidthType } from "./table-cell-components";
|
||||
import { TextDirection, VerticalAlign, VerticalMergeType, WidthType } from "./table-cell-components";
|
||||
import { TableCellProperties } from "./table-cell-properties";
|
||||
|
||||
export interface ITableCellOptions {
|
||||
readonly shading?: ITableShadingAttributesProperties;
|
||||
readonly margins?: ITableCellMarginOptions;
|
||||
readonly verticalAlign?: VerticalAlign;
|
||||
readonly textDirection?: TextDirection;
|
||||
readonly verticalMerge?: VerticalMergeType;
|
||||
readonly width?: {
|
||||
readonly size: number | string;
|
||||
@ -63,6 +64,10 @@ export class TableCell extends XmlComponent {
|
||||
this.properties.setVerticalAlign(options.verticalAlign);
|
||||
}
|
||||
|
||||
if (options.textDirection) {
|
||||
this.properties.setTextDirection(options.textDirection);
|
||||
}
|
||||
|
||||
if (options.verticalMerge) {
|
||||
this.properties.addVerticalMerge(options.verticalMerge);
|
||||
}
|
||||
|
Reference in New Issue
Block a user