From 009759f6f54bd0011a583c76d62c4bbd17694a42 Mon Sep 17 00:00:00 2001
From: Simon Jornet <jornetsimon@gmail.com>
Date: Fri, 26 Jun 2020 19:33:28 +0200
Subject: [PATCH] Documentation and demo for multiline

---
 README.md                                |  1 +
 package.json                             |  2 +-
 projects/demo/src/app/app.component.css  |  1 +
 projects/demo/src/app/app.component.html | 18 ++++++++++++++++++
 projects/ng-rough-notation/README.md     |  1 +
 projects/ng-rough-notation/package.json  |  2 +-
 6 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index c177e2a..3488b04 100644
--- a/README.md
+++ b/README.md
@@ -59,6 +59,7 @@ The config object should represent a partial [RoughAnnotationConfigBase](https:
 | color             | `string`                                                     | See [Automatic colors](#automatic-colors) |
 | strokeWidth       | `number`                                                     | `1`                                       |
 | padding           | `number`,  `[number, number]`, `[number, number, number, number]` | `5`                                       |
+| multiline         | `boolean`                                                    | `false`                                   |
 | iterations        | `number`                                                     | `2`                                       |
 | brackets          | `'left'`, `'right'`, `'top'`, `'bottom'`,  [...`'left'`, `'right'`, `'top'`, `'bottom'`] | `'right'`                                 |
 
diff --git a/package.json b/package.json
index 471ad7f..345dbb5 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ng-rough-notation-workspace",
-  "version": "1.0.5",
+  "version": "1.1.0",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
diff --git a/projects/demo/src/app/app.component.css b/projects/demo/src/app/app.component.css
index 45c3b9b..5c782b3 100644
--- a/projects/demo/src/app/app.component.css
+++ b/projects/demo/src/app/app.component.css
@@ -11,6 +11,7 @@
 }
 .section > div {
 	display: flex;
+	align-items: center;
 	font-size: 24px;
 }
 .section > div:not(:last-child) {
diff --git a/projects/demo/src/app/app.component.html b/projects/demo/src/app/app.component.html
index cd65e7f..7b740a1 100644
--- a/projects/demo/src/app/app.component.html
+++ b/projects/demo/src/app/app.component.html
@@ -44,6 +44,24 @@ <h2>Types</h2>
 		</span>
 		<button (click)="bracket.toggle()">Toggle</button>
 	</div>
+	<div>
+		<p style="max-width: 700px;">
+			<strong>Multiline</strong>
+			<br />
+			Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam neque ante, tristique
+			eget sem eu, faucibus porta ex. Mauris in feugiat justo, vel aliquam nulla.
+			<span
+				[roughNotation]="{ type: 'highlight', multiline: true }"
+				#multiline="roughNotation"
+				>Nullam iaculis, massa dignissim ultrices tincidunt, urna mi varius mi, eget
+				consequat sapien arcu et mi. Praesent mauris arcu, imperdiet sit amet ultricies in,
+				posuere ut nisl.
+			</span>
+			Suspendisse faucibus mauris at arcu ullamcorper posuere. Morbi eget arcu quis lectus
+			feugiat vulputate. Sed nec pulvinar sem, ut posuere lacus.
+		</p>
+		<button (click)="multiline.toggle()">Toggle</button>
+	</div>
 </div>
 
 <h2>
diff --git a/projects/ng-rough-notation/README.md b/projects/ng-rough-notation/README.md
index c177e2a..3488b04 100644
--- a/projects/ng-rough-notation/README.md
+++ b/projects/ng-rough-notation/README.md
@@ -59,6 +59,7 @@ The config object should represent a partial [RoughAnnotationConfigBase](https:
 | color             | `string`                                                     | See [Automatic colors](#automatic-colors) |
 | strokeWidth       | `number`                                                     | `1`                                       |
 | padding           | `number`,  `[number, number]`, `[number, number, number, number]` | `5`                                       |
+| multiline         | `boolean`                                                    | `false`                                   |
 | iterations        | `number`                                                     | `2`                                       |
 | brackets          | `'left'`, `'right'`, `'top'`, `'bottom'`,  [...`'left'`, `'right'`, `'top'`, `'bottom'`] | `'right'`                                 |
 
diff --git a/projects/ng-rough-notation/package.json b/projects/ng-rough-notation/package.json
index 9b68f7b..d3276ef 100644
--- a/projects/ng-rough-notation/package.json
+++ b/projects/ng-rough-notation/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "ng-rough-notation",
-	"version": "1.0.5",
+	"version": "1.1.0",
 	"description": "Angular directive wrapper for rough-notation",
 	"author": "Simon Jornet",
 	"keywords": [