Implement text alignment support

src/index.js

@@ -8,7 +8,7 @@ const setTextStyles = require("./render/set-text-styles");
 const measureText = require("./render/measure-text");
 
 function getTextProperties(item) {
-	return objectPick(item, ["fontSize", "fontFamily", "fontStyle", "fontWeight", "fillColor", "strokeColor"]);
+	return objectPick(item, ["fontSize", "fontFamily", "fontStyle", "fontWeight", "fillColor", "strokeColor", "alignment"]);
 }
 
 module.exports = function createTextShape(options = {}) {
@@ -16,7 +16,7 @@ module.exports = function createTextShape(options = {}) {
 		_layout: null,
 		_lines: null,
 		type: "text",
-		cacheBustingProperties: ["fillColor", "strokeColor", "strokeWidth"],
+		cacheBustingProperties: ["fillColor", "strokeColor", "strokeWidth", "alignment"],
 		sizeBustingProperties: ["text", "fontSize", "fontFamily", "fontStyle", "fontWeight", "trimVerticalWhitespace", "renderDebugLines", "renderDebugArea", "lineHeight", "tags"],
 		fillColor: "black",
 		strokeColor: "red",
@@ -25,6 +25,7 @@ module.exports = function createTextShape(options = {}) {
 		fontSize: 16,
 		fontWeight: "normal",
 		lineHeight: 1.16,
+		alignment: "left",
 		tags: false,
 		text: "",
 		onRender: function onRender(context) {

src/layout/index.js

@@ -1,5 +1,7 @@
 'use strict';
 
+const defaultValue = require("default-value");
+
 const parser = require("../parser");
 const findAlignment = require("../parser/find-alignment");
 const generateStyle = require("../parser/generate-style");
@@ -52,7 +54,7 @@ module.exports = function layoutFormattedText(text, options) {
 		let height = max(processedItems.map(item => item.measurements.height));
 
 		return Object.assign(line, {
-			alignment: (line.items.length > 0) ? findAlignment(line.items[0]) : null,
+			alignment: defaultValue((line.items.length > 0) ? findAlignment(line.items[0]) : null, options.defaultStyle.alignment),
 			items: processedItems,
 			height: height,
 			adjustedHeight: height * options.lineHeight * 1.13,
@@ -72,14 +74,17 @@ module.exports = function layoutFormattedText(text, options) {
 		endHeightCorrection = 0;
 	}
 
+	let totalTextWidth = Math.ceil(max(lines.map(line => line.width)));
+
 	let {positionedItems, debugLines} = layoutItems(lines, {
-		initialY: startHeightCorrection
+		initialY: startHeightCorrection,
+		totalTextWidth: totalTextWidth
 	});
 
 	let combinedLineHeights = sum(lines.map(line => line.adjustedHeight));
 
 	return {
-		width: Math.ceil(max(lines.map(line => line.width))),
+		width: totalTextWidth,
 		height: Math.ceil(combinedLineHeights + startHeightCorrection + endHeightCorrection + last(lines).maxDescender),
 		items: positionedItems,
 		drawDebugLines: function drawDebugLines(context) {

src/layout/layout-items.js

@@ -11,8 +11,18 @@ module.exports = function layoutItems(lines, options = {}) {
 		debugLines.push({color: "green", y: currentYOffset, lineNumber: i});
 		debugLines.push({color: "orange", y: currentYOffset + line.adjustedHeight, lineNumber: i});
 
+		let alignmentOffset;
+
+		if (line.alignment === "center") {
+			alignmentOffset = (options.totalTextWidth - line.width) / 2;
+		} else if (line.alignment === "right") {
+			alignmentOffset = (options.totalTextWidth - line.width);
+		} else {
+			alignmentOffset = 0;
+		}
+
 		let newItems = items.concat(line.items.map((item) => {
-			let x = currentXOffset;
+			let x = currentXOffset + alignmentOffset;
 			let y = currentYOffset - (line.minAscender / 2) + (line.adjustedHeight / 2)
 
 			debugLines.push({color: "blue", y: y, x1: x, x2: x + item.measurements.width, lineNumber: i});