From dcfece71d131f4466fb51c15802b170c40dba164 Mon Sep 17 00:00:00 2001
From: Kalutka Zhenya <ykalytka@thingsboard.io>
Date: Mon, 3 Oct 2022 17:54:02 +0300
Subject: [PATCH] Add UI helper to Markdown/HTML pattern

---
 .../editor/widget_js_markdown_pattern.md      | 68 +++++++++++++++++++
 1 file changed, 68 insertions(+)
 create mode 100644 ui-ngx/src/assets/help/en_US/widget/editor/widget_js_markdown_pattern.md

diff --git a/ui-ngx/src/assets/help/en_US/widget/editor/widget_js_markdown_pattern.md b/ui-ngx/src/assets/help/en_US/widget/editor/widget_js_markdown_pattern.md
new file mode 100644
index 0000000000..68c0e43a70
--- /dev/null
+++ b/ui-ngx/src/assets/help/en_US/widget/editor/widget_js_markdown_pattern.md
@@ -0,0 +1,68 @@
+#### Markdown pattern
+
+<div class="divider"></div>
+<br/>
+
+The Markdown template gets keys only from the first entity in the entity alias.
+
+<div class="divider"></div>
+<br/>
+
+#### Examples
+
+Use # to create a Markdown header. The number of characters # specifies the type of header: # - h1, ## - h2, ### - h3, etc.
+
+```markdown
+    ###### Markdown/HTML card
+{:copy-code}
+```
+ ###### Markdown/HTML card
+ 
+<div class="divider"></div>
+<br/>
+
+Use - character to create list item. You can create nested lists separating them with tabs in the pattern:
+
+ ```markdown
+    - Element 1
+    - Element 2
+        - Element 2.1
+        - Element 2.2
+    -Element 3 
+{:copy-code}
+ ```
+- Element 1
+- Element 2
+    - Element 2.1
+    - Element 2.2
+- Element 3
+
+<div class="divider"></div>
+<br/>
+
+Use * character to choose style:
+ 
+ ```markdown
+   - *Element 1*
+   - **Element 2**
+   - ***Element 3***
+{:copy-code}
+ ```
+- *Element 1*
+- **Element 2**
+- ***Element 3***
+
+<div class="divider"></div>
+<br/>
+
+Use ${} to add some value from your key:
+ ```markdown
+    - **Element 1**: ${key1Name}
+    - **Element 1**: ${key2Name}
+    - **Element 1**: ${key3Name}
+{:copy-code}
+ ```
+ - **Element 1**: key1Value
+ - **Element 2**: key2Value
+ - **Element 3**: key3Value
+