tree: fix regex for edge cases #1067

docs/content/shortcodes/tree.en.md

@@ -65,11 +65,11 @@ Codefence syntax is widely available in other Markdown parsers like GitHub and t
 
 ### Item Syntax
 
-`<TEXT> [ :: <ICON> [ :: <COLOR> ] ]`
+`<NAME> [ :: <ICON> [ :: <COLOR> ] ]`
 
-Text can be followed by optional double colons (`::`) to define an icon and another optional double colons to define the icon's color.
+The **NAME** can be followed by optional double colons (`::`) to define an **ICON** and further optional double colons to define the icon's **COLOR**.
 
-- **ICON**: [Font Awesome icon name](shortcodes/icon#finding-an-icon) set to the left of the text. If you give a single string, it is selected from Font Awesome's [solid](https://fontawesome.com/icons?d=gallery&s=solid&m=free) icons. If you want to use a different set, you have to give the complete styles after the double colons. See above example for the `home.php`.
+- **ICON**: [Font Awesome icon name](shortcodes/icon#finding-an-icon) set to the left of the **NAME**. If you give a single string, it is selected from Font Awesome's [solid](https://fontawesome.com/icons?d=gallery&s=solid&m=free) icons. If you want to use a different set, you have to give the complete styles after the double colons. See above example for the `home.php`.
 
 - **COLOR**: The [CSS color value](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value) to be used. If not set, the primary color will be used.
 
@@ -82,3 +82,49 @@ Text can be followed by optional double colons (`::`) to define an icon and anot
   - you can also [define your own styles](#defining-own-styles).
 
   If a **style** and a named HTML color have the same name, the HTML color will be used.
+
+## Examples
+
+### Bigger example
+
+Every possible combination
+
+````md
+```tree
+- just name
+  - Documents
+  - My Documents
+- simple icons::folder
+  - Documents::folder
+  - My Documents::folder
+- not so simple icons::file-alt::secondary
+  - a.png::file-alt
+  - a with border.png::file-alt
+- mindblowing icons::fa-fw fab fa-markdown::accent
+  - text.md::fa-fw fab fa-markdown
+  - alternative text.md::fa-fw fab fa-markdown
+- and now with color::fa-fw fab fa-php
+  - script.php::fa-fw fab fa-markdown::purple
+  - alt script.php::fa-fw fab fa-markdown::#888cc4
+  - magic.php::fa-fw fab fa-markdown::magic
+```
+````
+
+````tree
+- name-only
+  - Documents
+  - My Documents
+- simple icons::folder
+  - Documents::folder
+  - My Documents::folder
+- not so simple icons::file-alt::secondary
+  - a.png::file-alt
+  - a with border.png::file-alt
+- mindblowing icons::fa-fw fab fa-markdown::accent
+  - text.md::fa-fw fab fa-markdown
+  - alternative text.md::fa-fw fab fa-markdown
+- and now with color::fa-fw fab fa-php
+  - script.php::fa-fw fab fa-php::purple
+  - alt script.php::fa-fw fab fa-php::#888cc4
+  - magic.php::fa-fw fab fa-php::magic
+````

layouts/partials/shortcodes/tree.html

@@ -2,7 +2,7 @@
 <div class="list-tree">
 {{- $content = (replaceRE `<li>([^<>:]+)::([\w-]+)::([^<>\n\r\t ]+)` `<li><i class="fa-fw fas fa-$2 cstyle $3" style="color: $3;"></i><span>$1</span>` $content) }}
 {{- $content = (replaceRE `<li>([^<>:]+)::([^<>:]+)::([^<>\n\r\t ]+)` `<li><i class="$2 cstyle $3" style="color: $3;"></i><span>$1</span>` $content) }}
-{{- $content = (replaceRE `<li>([^<>:]+)::([\w-]+)([<\n\r\t ]+<)` `<li><i class="fa-fw fas fa-$2"></i><span>$1</span>$3` $content) }}
-{{- $content = (replaceRE `<li>([^<>:]+)::([^<>]+)` `<li><i class="$2"></i><span>$1</span>` $content) }}
+{{- $content = (replaceRE `<li>([^<>:]+)::([\w-]+)([\n\r\t ]*<)` `<li><i class="fa-fw fas fa-$2"></i><span>$1</span>$3` $content) }}
+{{- $content = (replaceRE `<li>([^<>:]+)::([^<>\n\r\t]+)` `<li><i class="$2"></i><span>$1</span>` $content) }}
 {{- $content | safeHTML -}}
 </div>

layouts/partials/version.txt

@@ -1 +1 @@
-7.5.0+e41aad9f9804e84ecd357d56dfa279a4aade3f67
+7.5.0+9b85f89f21224e47b2355fda27888cbfc2e32ad0