From b9465b2a2030c69a79f96aa03dc0e39563dd58b4 Mon Sep 17 00:00:00 2001
From: Dolan Miu <dolan_miu@hotmail.com>
Date: Mon, 31 Dec 2018 01:55:15 +0000
Subject: [PATCH] Add more changes to table API and documentation

---
 demo/demo20.ts                          |  2 +-
 demo/demo31.ts                          |  2 +-
 docs/usage/tables.md                    | 28 ++++++++++++++++---------
 src/file/table/table-cell/table-cell.ts | 17 +++++++++++++--
 src/file/table/table-row/table-row.ts   |  2 +-
 5 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/demo/demo20.ts b/demo/demo20.ts
index 6cbd40da2c..c0158d8dce 100644
--- a/demo/demo20.ts
+++ b/demo/demo20.ts
@@ -9,7 +9,7 @@ const table = doc.createTable(4, 4);
 table
     .getCell(2, 2)
     .addParagraph(new Paragraph("Hello"))
-    .Properties.Borders.addTopBorder(BorderStyle.DASH_DOT_STROKED, 3, "red")
+    .Borders.addTopBorder(BorderStyle.DASH_DOT_STROKED, 3, "red")
     .addBottomBorder(BorderStyle.DOUBLE, 3, "blue")
     .addStartBorder(BorderStyle.DOT_DOT_DASH, 3, "green")
     .addEndBorder(BorderStyle.DOT_DOT_DASH, 3, "#ff8000");
diff --git a/demo/demo31.ts b/demo/demo31.ts
index 59fe9009b0..349dd7e393 100644
--- a/demo/demo31.ts
+++ b/demo/demo31.ts
@@ -9,7 +9,7 @@ const table = doc.createTable(2, 2);
 table
     .getCell(1, 1)
     .addParagraph(new Paragraph("This text should be in the middle of the cell"))
-    .Properties.setVerticalAlign(VerticalAlign.CENTER);
+    .setVerticalAlign(VerticalAlign.CENTER);
 
 table
     .getCell(1, 0)
diff --git a/docs/usage/tables.md b/docs/usage/tables.md
index 0f7bd18857..895f3b8851 100644
--- a/docs/usage/tables.md
+++ b/docs/usage/tables.md
@@ -40,14 +40,6 @@ const cell = table.getCell([ROW INDEX], [COLUMN INDEX]);
 const cell = table.getCell(0, 2);
 ```
 
-### Cell Properties & Styling
-
-With the cell's `Properties`, you csn change it's borders, set it's vertical alignment
-
-```ts
-cell.Properties;
-```
-
 ## Borders
 
 BorderStyle can be imported from `docx`. Size determines the thickness. HTML color can be a hex code or alias such as `red`.
@@ -80,16 +72,32 @@ cell.Borders.addStartBorder(BorderStyle.DOT_DOT_DASH, 3, "#ff8000");
 ## Set Width
 
 ```ts
-table.setWidth([WIDTH], [OPTIONAL WidthType]);
+import { WidthType } from "docx";
+
+table.setWidth([WIDTH], [OPTIONAL WidthType. Defaults to DXA]);
 ```
 
+For example:
+
 ```ts
 table.setWidth(4535, WidthType.DXA);
 ```
 
 ## Vertical Align
 
-## Borders
+Sets the vertical alignment of the contents of the cell
+
+```ts
+import { VerticalAlign } from "docx";
+
+cell.setVerticalAlign([VerticalAlign TYPE]);
+```
+
+For example, to center align a cell:
+
+```ts
+cell.setVerticalAlign(VerticalAlign.CENTER);
+```
 
 ## Rows
 
diff --git a/src/file/table/table-cell/table-cell.ts b/src/file/table/table-cell/table-cell.ts
index 3ac246dde8..3526e788bd 100644
--- a/src/file/table/table-cell/table-cell.ts
+++ b/src/file/table/table-cell/table-cell.ts
@@ -3,6 +3,7 @@ import { Paragraph } from "file/paragraph";
 import { IXmlableObject, XmlComponent } from "file/xml-components";
 
 import { Table } from "../table";
+import { TableCellBorders, VerticalAlign } from "./table-cell-components";
 import { TableCellProperties } from "./table-cell-properties";
 
 export class TableCell extends XmlComponent {
@@ -45,7 +46,19 @@ export class TableCell extends XmlComponent {
         return para;
     }
 
-    public get Properties(): TableCellProperties {
-        return this.properties;
+    public setVerticalAlign(type: VerticalAlign): TableCell {
+        this.properties.setVerticalAlign(type);
+
+        return this;
+    }
+
+    public addGridSpan(cellSpan: number): TableCell {
+        this.properties.addGridSpan(cellSpan);
+
+        return this;
+    }
+
+    public get Borders(): TableCellBorders {
+        return this.properties.Borders;
     }
 }
diff --git a/src/file/table/table-row/table-row.ts b/src/file/table/table-row/table-row.ts
index 6cc62819a4..3a08197cf7 100644
--- a/src/file/table/table-row/table-row.ts
+++ b/src/file/table/table-row/table-row.ts
@@ -25,7 +25,7 @@ export class TableRow extends XmlComponent {
 
     public addGridSpan(index: number, cellSpan: number): TableCell {
         const remainCell = this.cells[index];
-        remainCell.Properties.addGridSpan(cellSpan);
+        remainCell.addGridSpan(cellSpan);
         this.cells.splice(index + 1, cellSpan - 1);
         this.root.splice(index + 2, cellSpan - 1);