Version bump

adds textDirection to table cells

.travis.yml

@@ -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

README.md

@@ -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://codepen.io/dolanmiu/pen/RwNeObg
-*   https://jsfiddle.net/3xhezb5w/2
+*   https://jsfiddle.net/dolanmiu/kqxrj35u/1/
 
 Here is an example of `docx` working in `Angular`:
 
@@ -75,6 +75,8 @@ Read the contribution guidelines [here](https://docx.js.org/#/contribution-guide
 [<img src="https://i.imgur.com/dHMg0wF.gif" alt="drawing" height="50"/>](http://www.madisoncres.com/)
 [<img src="https://i.imgur.com/QEZXU5b.png" alt="drawing" height="50"/>](https://www.beekast.com/)
 [<img src="https://imgur.com/XVU6aoi.png" alt="drawing" height="50"/>](https://herraizsoto.com/)
+[<img src="https://i.imgur.com/fn1xccG.png" alt="drawing" height="50"/>](http://www.ativer.com.br/)
+
 
 ...and many more!
 

demo/31-tables.ts

@@ -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,
+                }),
             ],
         }),
     ],

demo/35-hyperlinks.ts

@@ -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")],
+        }),
     ],
 });
 

demo/51-character-styles.ts

@@ -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);
+});

demo/52-japanese.ts

@@ -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);
+});

docs/index.html

@@ -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>

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "docx",
-  "version": "5.0.0-rc7",
+  "version": "5.0.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -3573,9 +3573,9 @@
       "dev": true
     },
     "handlebars": {
-      "version": "4.1.2",
+      "version": "4.5.3",
-      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.1.2.tgz",
+      "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.5.3.tgz",
-      "integrity": "sha512-nvfrjqvt9xQ8Z/w0ijewdD/vvWDTOweBUm96NTr66Wfvo1mJenBLwcYmPs3TIBP5ruzYGD7Hx/DaM9RmhroGPw==",
+      "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
     },

package.json

@@ -1,6 +1,6 @@
 {
   "name": "docx",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "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": {

src/file/numbering/numbering.ts

@@ -147,6 +147,17 @@ export class Numbering extends XmlComponent {
                     },
                 },
             },
+            {
+                level: 9,
+                format: "bullet",
+                text: "\u2726",
+                alignment: AlignmentType.LEFT,
+                style: {
+                    paragraph: {
+                        indent: { left: 720, hanging: 360 },
+                    },
+                },
+            },
         ]);
 
         this.createConcreteNumbering(abstractNumbering);

src/file/styles/style-options.ts

@@ -38,3 +38,9 @@ export interface IParagraphStyleOptions2 {
     readonly keepLines?: boolean;
     readonly outlineLevel?: number;
 }
+
+// Needed because of: https://github.com/s-panferov/awesome-typescript-loader/issues/432
+/**
+ * @ignore
+ */
+export const WORKAROUND4 = "";

src/file/table/table-cell/table-cell-components.ts

@@ -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",

src/file/table/table-cell/table-cell-properties.ts

@@ -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;
+    }
 }

src/file/table/table-cell/table-cell.spec.ts

@@ -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: [],

src/file/table/table-cell/table-cell.ts

@@ -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);
         }