diff --git a/packages/builder/src/components/automation/SetupPanel/GenericBindingPopover.svelte b/packages/builder/src/components/automation/SetupPanel/GenericBindingPopover.svelte
index 24b6042940..4c85d3865d 100644
--- a/packages/builder/src/components/automation/SetupPanel/GenericBindingPopover.svelte
+++ b/packages/builder/src/components/automation/SetupPanel/GenericBindingPopover.svelte
@@ -83,6 +83,7 @@
               <div class="binding__description">
                 {@html helper.description || ''}
               </div>
+              <pre>{helper.example || ''}</pre>
             </div>
           {/each}
         </div>
diff --git a/packages/builder/src/components/design/PropertiesPanel/BindingPanel.svelte b/packages/builder/src/components/design/PropertiesPanel/BindingPanel.svelte
index 47334267b6..941796d025 100644
--- a/packages/builder/src/components/design/PropertiesPanel/BindingPanel.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/BindingPanel.svelte
@@ -103,6 +103,7 @@
               <div class="description">
                 {@html helper.description}
               </div>
+              <pre>{helper.example || ''}</pre>
             </div>
           </li>
         {/each}
diff --git a/packages/builder/src/constants/completions.js b/packages/builder/src/constants/completions.js
index 69f6ec551b..32de934324 100644
--- a/packages/builder/src/constants/completions.js
+++ b/packages/builder/src/constants/completions.js
@@ -7,6 +7,7 @@ export function handlebarsCompletions() {
     Object.entries(manifest[key]).map(([helperName, helperConfig]) => ({
       text: helperName,
       path: helperName,
+      example: helperConfig.example,
       label: helperName,
       displayText: helperName,
       description: helperConfig.description,
diff --git a/packages/string-templates/manifest.json b/packages/string-templates/manifest.json
index 55a86eb22a..294eeeec5e 100644
--- a/packages/string-templates/manifest.json
+++ b/packages/string-templates/manifest.json
@@ -5,6 +5,7 @@
         "a"
       ],
       "numArgs": 1,
+      "example": "{{ abs 12012.1000 }} -> 12012.1",
       "description": "<p>Return the magnitude of <code>a</code>.</p>\n"
     },
     "add": {
@@ -13,6 +14,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ add 1 2 }} -> 3",
       "description": "<p>Return the sum of <code>a</code> plus <code>b</code>.</p>\n"
     },
     "avg": {
@@ -20,6 +22,7 @@
         "array"
       ],
       "numArgs": 1,
+      "example": "{{ avg [1,2,3,4,5] }} -> 3",
       "description": "<p>Returns the average of all numbers in the given array.</p>\n"
     },
     "ceil": {
@@ -27,6 +30,7 @@
         "value"
       ],
       "numArgs": 1,
+      "example": "{{ ceil 1.2 }} -> 2",
       "description": "<p>Get the <code>Math.ceil()</code> of the given value.</p>\n"
     },
     "divide": {
@@ -35,6 +39,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ divide 10 5 }} -> 2",
       "description": "<p>Divide <code>a</code> by <code>b</code></p>\n"
     },
     "floor": {
@@ -42,6 +47,7 @@
         "value"
       ],
       "numArgs": 1,
+      "example": "{{ floor 1.2 }} -> 1",
       "description": "<p>Get the <code>Math.floor()</code> of the given value.</p>\n"
     },
     "minus": {
@@ -50,6 +56,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ subtract 10 5 }} -> 5",
       "description": "<p>Return the product of <code>a</code> minus <code>b</code>.</p>\n"
     },
     "modulo": {
@@ -58,6 +65,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ modulo 10 5 }} -> 0",
       "description": "<p>Get the remainder of a division operation.</p>\n"
     },
     "multiply": {
@@ -66,6 +74,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ product 10 5 }} -> 50",
       "description": "<p>Return the product of <code>a</code> times <code>b</code>.</p>\n"
     },
     "plus": {
@@ -74,6 +83,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ plus 10 5 }} -> 15",
       "description": "<p>Add <code>a</code> by <code>b</code>.</p>\n"
     },
     "random": {
@@ -82,6 +92,7 @@
         "max"
       ],
       "numArgs": 2,
+      "example": "{{ random 0 20 }} -> 10",
       "description": "<p>Generate a random number between two values</p>\n"
     },
     "remainder": {
@@ -90,6 +101,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ remainder 10 6 }} -> 4",
       "description": "<p>Get the remainder when <code>a</code> is divided by <code>b</code>.</p>\n"
     },
     "round": {
@@ -97,6 +109,7 @@
         "number"
       ],
       "numArgs": 1,
+      "example": "{{ round 10.3 }} -> 10",
       "description": "<p>Round the given number.</p>\n"
     },
     "subtract": {
@@ -105,6 +118,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ subtract 10 5 }} -> 5",
       "description": "<p>Return the product of <code>a</code> minus <code>b</code>.</p>\n"
     },
     "sum": {
@@ -112,6 +126,7 @@
         "array"
       ],
       "numArgs": 1,
+      "example": "{{ sum [1, 2, 3] }} -> 6",
       "description": "<p>Returns the sum of all numbers in the given array.</p>\n"
     },
     "times": {
@@ -120,6 +135,7 @@
         "b"
       ],
       "numArgs": 2,
+      "example": "{{ times 10 5 }} -> 50",
       "description": "<p>Multiply number <code>a</code> by number <code>b</code>.</p>\n"
     }
   },
@@ -130,6 +146,7 @@
         "n"
       ],
       "numArgs": 2,
+      "example": "{{ after [1, 2, 3] 1}} -> [3]",
       "description": "<p>Returns all of the items in an array after the specified index. Opposite of <a href=\"#before\">before</a>.</p>\n"
     },
     "arrayify": {
@@ -137,6 +154,7 @@
         "value"
       ],
       "numArgs": 1,
+      "example": "{{ arrayify \"foo\" }} -> [\"foo\"]",
       "description": "<p>Cast the given <code>value</code> to an array.</p>\n"
     },
     "before": {
@@ -145,6 +163,7 @@
         "n"
       ],
       "numArgs": 2,
+      "example": "{{ before [1, 2, 3] 2}} -> [1, 2]",
       "description": "<p>Return all of the items in the collection before the specified count. Opposite of <a href=\"#after\">after</a>.</p>\n"
     },
     "eachIndex": {
@@ -153,6 +172,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{#eachIndex [1, 2, 3]}} {{item}} is {{index}} {{/eachIndex}}",
       "description": "<p>Iterates the array, listing an item and the index of it.</p>\n"
     },
     "filter": {
@@ -162,6 +182,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#filter [1, 2, 3] 2}}2 Found{{else}}2 not found{{/filter}}",
       "description": "<p>Block helper that filters the given array and renders the block for values that evaluate to <code>true</code>, otherwise the inverse block is returned.</p>\n"
     },
     "first": {
@@ -170,6 +191,7 @@
         "n"
       ],
       "numArgs": 2,
+      "example": "{{first [1, 2, 3, 4] 2}} -> [1, 2]",
       "description": "<p>Returns the first item, or first <code>n</code> items of an array.</p>\n"
     },
     "forEach": {
@@ -177,6 +199,7 @@
         "array"
       ],
       "numArgs": 1,
+      "example": "{{#forEach [{ 'name': 'John' }] }} {{ name }} {{/forEach}}",
       "description": "<p>Iterates over each item in an array and exposes the current item in the array as context to the inner block. In addition to the current array item, the helper exposes the following variables to the inner block: - <code>index</code> - <code>total</code> - <code>isFirst</code> - <code>isLast</code> Also, <code>@index</code> is exposed as a private variable, and additional private variables may be defined as hash arguments.</p>\n"
     },
     "inArray": {
@@ -186,6 +209,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#inArray [1, 2, 3] 2}} 2 exists {{else}} 2 does not exist {{/inArray}} -> 2 exists",
       "description": "<p>Block helper that renders the block if an array has the given <code>value</code>. Optionally specify an inverse block to render when the array does not have the given value.</p>\n"
     },
     "isArray": {
@@ -193,6 +217,7 @@
         "value"
       ],
       "numArgs": 1,
+      "example": "{{isArray [1, 2]}} -> true",
       "description": "<p>Returns true if <code>value</code> is an es5 array.</p>\n"
     },
     "itemAt": {
@@ -201,6 +226,7 @@
         "idx"
       ],
       "numArgs": 2,
+      "example": "{{itemAt [1, 2, 3] 1}} -> 2",
       "description": "<p>Returns the item from <code>array</code> at index <code>idx</code>.</p>\n"
     },
     "join": {
@@ -209,6 +235,7 @@
         "separator"
       ],
       "numArgs": 2,
+      "example": "{{join [1, 2, 3]}} -> '1, 2, 3'",
       "description": "<p>Join all elements of array into a string, optionally using a given separator.</p>\n"
     },
     "equalsLength": {
@@ -218,6 +245,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{equalsLength [1, 2, 3] 3}} -> true",
       "description": "<p>Returns true if the the length of the given <code>value</code> is equal to the given <code>length</code>. Can be used as a block or inline helper.</p>\n"
     },
     "last": {
@@ -226,6 +254,7 @@
         "n"
       ],
       "numArgs": 2,
+      "example": "{{last [1, 2, 3]}} -> 3",
       "description": "<p>Returns the last item, or last <code>n</code> items of an array or string. Opposite of <a href=\"#first\">first</a>.</p>\n"
     },
     "length": {
@@ -233,6 +262,7 @@
         "value"
       ],
       "numArgs": 1,
+      "example": "{{length [1, 2, 3]}} -> 3",
       "description": "<p>Returns the length of the given string or array.</p>\n"
     },
     "lengthEqual": {
@@ -242,6 +272,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{equalsLength [1, 2, 3] 3}} -> true",
       "description": "<p>Returns true if the the length of the given <code>value</code> is equal to the given <code>length</code>. Can be used as a block or inline helper.</p>\n"
     },
     "map": {
@@ -250,6 +281,7 @@
         "fn"
       ],
       "numArgs": 2,
+      "example": "{{map [1, 2, 3] double}} -> [2, 4, 6]",
       "description": "<p>Returns a new array, created by calling <code>function</code> on each element of the given <code>array</code>. For example,</p>\n"
     },
     "pluck": {
@@ -258,6 +290,7 @@
         "prop"
       ],
       "numArgs": 2,
+      "example": "{{pluck [{ 'name': 'Bob' }] \"name\" }} -> ['Bob']",
       "description": "<p>Map over the given object or array or objects and create an array of values from the given <code>prop</code>. Dot-notation may be used (as a string) to get nested properties.</p>\n"
     },
     "reverse": {
@@ -265,6 +298,7 @@
         "value"
       ],
       "numArgs": 1,
+      "example": "{{reverse [1, 2, 3]}} -> [3, 2, 1]",
       "description": "<p>Reverse the elements in an array, or the characters in a string.</p>\n"
     },
     "some": {
@@ -274,6 +308,7 @@
         "provided"
       ],
       "numArgs": 3,
+      "example": "{{#some [1, 'b', 3] isString}} string found {{else}} No string found {{/some}} -> string found",
       "description": "<p>Block helper that returns the block if the callback returns true for some value in the given array.</p>\n"
     },
     "sort": {
@@ -282,6 +317,7 @@
         "key"
       ],
       "numArgs": 2,
+      "example": "{{ sort ['b', 'a', 'c'] }} -> ['a', 'b', 'c']",
       "description": "<p>Sort the given <code>array</code>. If an array of objects is passed, you may optionally pass a <code>key</code> to sort on as the second argument. You may alternatively pass a sorting function as the second argument.</p>\n"
     },
     "sortBy": {
@@ -290,6 +326,7 @@
         "props"
       ],
       "numArgs": 2,
+      "example": "{{ sortBy [{a: 'zzz'}, {a: 'aaa'}] \"a\" }} -> [{\"a\":\"aaa\"}, {\"a\":\"zzz\"}]",
       "description": "<p>Sort an <code>array</code>. If an array of objects is passed, you may optionally pass a <code>key</code> to sort on as the second argument. You may alternatively pass a sorting function as the second argument.</p>\n"
     },
     "withAfter": {
@@ -299,6 +336,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{ withAfter [1, 2, 3] 1 }} {{this}} {{/withAfter}}",
       "description": "<p>Use the items in the array <em>after</em> the specified index as context inside a block. Opposite of <a href=\"#withBefore\">withBefore</a>.</p>\n"
     },
     "withBefore": {
@@ -308,6 +346,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{ withBefore [1, 2, 3] 2 }} {{this}} {{/withBefore}}",
       "description": "<p>Use the items in the array <em>before</em> the specified index as context inside a block. Opposite of <a href=\"#withAfter\">withAfter</a>.</p>\n"
     },
     "withFirst": {
@@ -317,6 +356,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{ withFirst [1, 2, 3] }} {{this}} {{/withFirst}}",
       "description": "<p>Use the first item in a collection inside a handlebars block expression. Opposite of <a href=\"#withLast\">withLast</a>.</p>\n"
     },
     "withGroup": {
@@ -326,6 +366,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#withGroup [1, 2, 3, 4] 2}} {{#each this}} {{.}} {{each}} <br> {{/withGroup}} -> 1,2<br> 3,4<br>",
       "description": "<p>Block helper that groups array elements by given group <code>size</code>.</p>\n"
     },
     "withLast": {
@@ -335,6 +376,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#withLast [1, 2, 3, 4]}} {{this}} {{/withLast}} -> 4",
       "description": "<p>Use the last item or <code>n</code> items in an array as context inside a block. Opposite of <a href=\"#withFirst\">withFirst</a>.</p>\n"
     },
     "withSort": {
@@ -344,6 +386,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#withSort ['b', 'a', 'c']}} {{this}} {{/withSort}} -> abc",
       "description": "<p>Block helper that sorts a collection and exposes the sorted collection as context inside the block.</p>\n"
     },
     "unique": {
@@ -352,6 +395,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{#each (unique ['a', 'a', 'c', 'b', 'e', 'e']) }} {{.}} {{/each}} -> acbe",
       "description": "<p>Block helper that return an array with all duplicate values removed. Best used along with a <a href=\"#each\">each</a> helper.</p>\n"
     }
   },
@@ -361,6 +405,7 @@
         "number"
       ],
       "numArgs": 1,
+      "example": "{{ bytes 1386 }} -> 1.4Kb",
       "description": "<p>Format a number to it&#39;s equivalent in bytes. If a string is passed, it&#39;s length will be formatted and returned. <strong>Examples:</strong> - <code>&#39;foo&#39; =&gt; 3 B</code> - <code>13661855 =&gt; 13.66 MB</code> - <code>825399 =&gt; 825.39 kB</code> - <code>1396 =&gt; 1.4 kB</code></p>\n"
     },
     "addCommas": {
@@ -368,6 +413,7 @@
         "num"
       ],
       "numArgs": 1,
+      "example": "{{ addCommas 1000000 }} -> 1,000,000",
       "description": "<p>Add commas to numbers</p>\n"
     },
     "phoneNumber": {
@@ -375,6 +421,7 @@
         "num"
       ],
       "numArgs": 1,
+      "example": "{{ phoneNumber 8005551212 }} -> (800) 555-1212",
       "description": "<p>Convert a string or number to a formatted phone number.</p>\n"
     },
     "toAbbr": {
@@ -383,6 +430,7 @@
         "precision"
       ],
       "numArgs": 2,
+      "example": "{{ toAbbr 10123 2 }} -> 10.12k",
       "description": "<p>Abbreviate numbers to the given number of <code>precision</code>. This for general numbers, not size in bytes.</p>\n"
     },
     "toExponential": {
@@ -391,6 +439,7 @@
         "fractionDigits"
       ],
       "numArgs": 2,
+      "example": "{{ toExponential 10123 2 }} -> 101e+4",
       "description": "<p>Returns a string representing the given number in exponential notation.</p>\n"
     },
     "toFixed": {
@@ -399,6 +448,7 @@
         "digits"
       ],
       "numArgs": 2,
+      "example": "{{ toFixed 1.1234 2 }} -> 1.12",
       "description": "<p>Formats the given number using fixed-point notation.</p>\n"
     },
     "toFloat": {
@@ -421,6 +471,7 @@
         "precision"
       ],
       "numArgs": 2,
+      "example": "{{toPrecision \"1.1234\" 2}}",
       "description": "<p>Returns a string representing the <code>Number</code> object to the specified precision.</p>\n"
     }
   },
@@ -430,6 +481,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{ encodeURI \"https://myurl?Hello There\" }} -> https://myurl?Hello%20There",
       "description": "<p>Encodes a Uniform Resource Identifier (URI) component by replacing each instance of certain characters by one, two, three, or four escape sequences representing the UTF-8 encoding of the character.</p>\n"
     },
     "escape": {
@@ -437,6 +489,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{ escape \"https://myurl?Hello+There\" }} -> https://myurl?Hello%20There",
       "description": "<p>Escape the given string by replacing characters with escape sequences. Useful for allowing the string to be used in a URL, etc.</p>\n"
     },
     "decodeURI": {
@@ -444,6 +497,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{ escape \"https://myurl?Hello%20There\" }} -> https://myurl?Hello+There",
       "description": "<p>Decode a Uniform Resource Identifier (URI) component.</p>\n"
     },
     "url_encode": {
@@ -462,6 +516,7 @@
         "href"
       ],
       "numArgs": 2,
+      "example": "{{ urlResolve \"https://myurl\" \"/api/test\" }} -> https://myurl/api/test",
       "description": "<p>Take a base URL, and a href URL, and resolve them as a browser would for an anchor tag.</p>\n"
     },
     "urlParse": {
@@ -469,6 +524,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{ urlParse \"https://myurl/api/test\" }}",
       "description": "<p>Parses a <code>url</code> string into an object.</p>\n"
     },
     "stripQuerystring": {
@@ -476,6 +532,7 @@
         "url"
       ],
       "numArgs": 1,
+      "example": "{{ stripQueryString \"https://myurl/api/test?foo=bar\" }} -> \"https://myurl/api/test\"",
       "description": "<p>Strip the query string from the given <code>url</code>.</p>\n"
     },
     "stripProtocol": {
@@ -483,6 +540,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{ stripProtocol \"https://myurl/api/test\" }} -> \"myurl/api/test\"",
       "description": "<p>Strip protocol from a <code>url</code>. Useful for displaying media that may have an &#39;http&#39; protocol on secure connections.</p>\n"
     }
   },
@@ -493,6 +551,7 @@
         "suffix"
       ],
       "numArgs": 2,
+      "example": "{{append \"index\" \".html\"}} -> index.html",
       "description": "<p>Append the specified <code>suffix</code> to the given string.</p>\n"
     },
     "camelcase": {
@@ -500,6 +559,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{camelcase \"foo bar baz\"}} ->  fooBarBaz",
       "description": "<p>camelCase the characters in the given <code>string</code>.</p>\n"
     },
     "capitalize": {
@@ -507,6 +567,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{capitalize \"foo bar baz\"}} ->  Foo bar baz",
       "description": "<p>Capitalize the first word in a sentence.</p>\n"
     },
     "capitalizeAll": {
@@ -514,6 +575,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{ capitalizeAll \"foo bar baz\"}} ->  Foo Bar Baz",
       "description": "<p>Capitalize all words in a string.</p>\n"
     },
     "center": {
@@ -522,6 +584,7 @@
         "spaces"
       ],
       "numArgs": 2,
+      "example": "{{ center \"test\" 1}} -> \" test \"",
       "description": "<p>Center a string using non-breaking spaces</p>\n"
     },
     "chop": {
@@ -529,6 +592,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{ chop \" ABC \"}} -> \"ABC\"",
       "description": "<p>Like trim, but removes both extraneous whitespace <strong>and non-word characters</strong> from the beginning and end of a string.</p>\n"
     },
     "dashcase": {
@@ -536,6 +600,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{dashcase \"a-b-c d_e\"}} -> a-b-c-d-e",
       "description": "<p>dash-case the characters in <code>string</code>. Replaces non-word characters and periods with hyphens.</p>\n"
     },
     "dotcase": {
@@ -543,6 +608,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{dotcase \"a-b-c d_e\"}} -> a.b.c.d.e",
       "description": "<p>dot.case the characters in <code>string</code>.</p>\n"
     },
     "downcase": {
@@ -550,6 +616,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{downcase \"aBcDeF\"}} -> abcdef",
       "description": "<p>Lowercase all of the characters in the given string. Alias for <a href=\"#lowercase\">lowercase</a>.</p>\n"
     },
     "ellipsis": {
@@ -558,6 +625,7 @@
         "length"
       ],
       "numArgs": 2,
+      "example": "{{ellipsis \"foo bar baz\", 7}} -> foo bar…",
       "description": "<p>Truncates a string to the specified <code>length</code>, and appends it with an elipsis, <code>…</code>.</p>\n"
     },
     "hyphenate": {
@@ -565,6 +633,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{hyphenate \"foo bar baz qux\"}} -> foo-bar-baz-qux",
       "description": "<p>Replace spaces in a string with hyphens.</p>\n"
     },
     "isString": {
@@ -572,6 +641,7 @@
         "value"
       ],
       "numArgs": 1,
+      "example": "{{isString \"foo\"}} -> true",
       "description": "<p>Return true if <code>value</code> is a string.</p>\n"
     },
     "lowercase": {
@@ -579,6 +649,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{lowercase \"Foo BAR baZ\"}} -> foo bar baz",
       "description": "<p>Lowercase all characters in the given string.</p>\n"
     },
     "occurrences": {
@@ -587,6 +658,7 @@
         "substring"
       ],
       "numArgs": 2,
+      "example": "{{occurrences \"foo bar foo bar baz\" \"foo\"}} -> 2",
       "description": "<p>Return the number of occurrences of <code>substring</code> within the given <code>string</code>.</p>\n"
     },
     "pascalcase": {
@@ -594,6 +666,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{pascalcase \"foo bar baz\"}} -> FooBarBaz",
       "description": "<p>PascalCase the characters in <code>string</code>.</p>\n"
     },
     "pathcase": {
@@ -601,6 +674,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{pathcase \"a-b-c d_e\"}} -> a/b/c/d/e",
       "description": "<p>path/case the characters in <code>string</code>.</p>\n"
     },
     "plusify": {
@@ -608,6 +682,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{plusify \"foo bar baz\"}} -> foo+bar+baz",
       "description": "<p>Replace spaces in the given string with pluses.</p>\n"
     },
     "prepend": {
@@ -616,6 +691,7 @@
         "prefix"
       ],
       "numArgs": 2,
+      "example": "{{prepend \"bar\" \"foo-\"}} -> foo-bar",
       "description": "<p>Prepends the given <code>string</code> with the specified <code>prefix</code>.</p>\n"
     },
     "raw": {
@@ -623,6 +699,7 @@
         "options"
       ],
       "numArgs": 1,
+      "example": "{{{{#raw}}}} {{foo}} {{{{/raw}}}} -> {{foo}}",
       "description": "<p>Render a block without processing mustache templates inside the block.</p>\n"
     },
     "remove": {
@@ -631,6 +708,7 @@
         "substring"
       ],
       "numArgs": 2,
+      "example": "{{remove \"a b a b a b\" \"a \"}} -> b b b",
       "description": "<p>Remove all occurrences of <code>substring</code> from the given <code>str</code>.</p>\n"
     },
     "removeFirst": {
@@ -639,6 +717,7 @@
         "substring"
       ],
       "numArgs": 2,
+      "example": "{{remove \"a b a b a b\" \"a\"}} ->  b a b a b",
       "description": "<p>Remove the first occurrence of <code>substring</code> from the given <code>str</code>.</p>\n"
     },
     "replace": {
@@ -648,6 +727,7 @@
         "b"
       ],
       "numArgs": 3,
+      "example": "{{replace \"a b a b a b\" \"a\" \"z\"}} -> z b z b z b",
       "description": "<p>Replace all occurrences of substring <code>a</code> with substring <code>b</code>.</p>\n"
     },
     "replaceFirst": {
@@ -657,6 +737,7 @@
         "b"
       ],
       "numArgs": 3,
+      "example": "{{replace \"a b a b a b\" \"a\" \"z\"}} -> z b a b a b",
       "description": "<p>Replace the first occurrence of substring <code>a</code> with substring <code>b</code>.</p>\n"
     },
     "sentence": {
@@ -664,6 +745,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{sentence \"hello world. goodbye world.\"}} -> Hello world. Goodbye world.",
       "description": "<p>Sentence case the given string</p>\n"
     },
     "snakecase": {
@@ -671,6 +753,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{snakecase \"a-b-c d_e\"}} -> a_b_c_d_e",
       "description": "<p>snake_case the characters in the given <code>string</code>.</p>\n"
     },
     "split": {
@@ -678,6 +761,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{split \"a,b,c\"}} -> ['a', 'b', 'c']",
       "description": "<p>Split <code>string</code> by the given <code>character</code>.</p>\n"
     },
     "startsWith": {
@@ -687,6 +771,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#startsWith \"Goodbye\" \"Hello, world!\"}} Yep {{else}} Nope {{/startsWith}} -> Nope",
       "description": "<p>Tests whether a string begins with the given prefix.</p>\n"
     },
     "titleize": {
@@ -694,6 +779,7 @@
         "str"
       ],
       "numArgs": 1,
+      "example": "{{#titleize \"this is title case\" }} -> This Is Title Case",
       "description": "<p>Title case the given string.</p>\n"
     },
     "trim": {
@@ -701,6 +787,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{trim \"  ABC  \" }} -> ABC",
       "description": "<p>Removes extraneous whitespace from the beginning and end of a string.</p>\n"
     },
     "trimLeft": {
@@ -708,6 +795,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{trimLeft \"  ABC \" }} -> \"ABC \"",
       "description": "<p>Removes extraneous whitespace from the beginning of a string.</p>\n"
     },
     "trimRight": {
@@ -715,6 +803,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{trimRight \"  ABC \" }} ->  \"  ABC \"",
       "description": "<p>Removes extraneous whitespace from the end of a string.</p>\n"
     },
     "truncate": {
@@ -724,6 +813,7 @@
         "suffix"
       ],
       "numArgs": 3,
+      "example": "{{truncate \"foo bar baz\" 7 }} -> foo bar",
       "description": "<p>Truncate a string to the specified <code>length</code>. Also see <a href=\"#ellipsis\">ellipsis</a>.</p>\n"
     },
     "truncateWords": {
@@ -733,6 +823,7 @@
         "suffix"
       ],
       "numArgs": 3,
+      "example": "{{truncateWords \"foo bar baz\" 1 }} -> foo",
       "description": "<p>Truncate a string to have the specified number of words. Also see <a href=\"#truncate\">truncate</a>.</p>\n"
     },
     "upcase": {
@@ -740,6 +831,7 @@
         "string"
       ],
       "numArgs": 1,
+      "example": "{{upcase \"aBcDef\"}} -> ABCDEF",
       "description": "<p>Uppercase all of the characters in the given string. Alias for <a href=\"#uppercase\">uppercase</a>.</p>\n"
     },
     "uppercase": {
@@ -748,6 +840,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{uppercase \"aBcDef\"}} -> ABCDEF",
       "description": "<p>Uppercase all of the characters in the given string. If used as a block helper it will uppercase the entire block. This helper does not support inverse blocks.</p>\n"
     }
   },
@@ -759,6 +852,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#and great magnificent}}both{{else}}no{{/and}}",
       "description": "<p>Helper that renders the block if <strong>both</strong> of the given values are truthy. If an inverse block is specified it will be rendered when falsy. Works as a block helper, inline helper or subexpression.</p>\n"
     },
     "compare": {
@@ -769,6 +863,7 @@
         "options"
       ],
       "numArgs": 4,
+      "example": "{{compare 10 \"<\" 5 }} -> true",
       "description": "<p>Render a block when a comparison of the first and third arguments returns true. The second argument is the [arithemetic operator][operators] to use. You may also optionally specify an inverse block to render when falsy.</p>\n"
     },
     "contains": {
@@ -779,6 +874,7 @@
         "options"
       ],
       "numArgs": 4,
+      "example": "{{#contains ['a', 'b', 'c'] \"d\"}} This will not be rendered. {{else}} This will be rendered. {{/contains}}",
       "description": "<p>Block helper that renders the block if <code>collection</code> has the given <code>value</code>, using strict equality (<code>===</code>) for comparison, otherwise the inverse block is rendered (if specified). If a <code>startIndex</code> is specified and is negative, it is used as the offset from the end of the collection.</p>\n"
     },
     "default": {
@@ -787,6 +883,7 @@
         "defaultValue"
       ],
       "numArgs": 2,
+      "example": "{{default null null \"default\"}} -> default",
       "description": "<p>Returns the first value that is not undefined, otherwise the &quot;default&quot; value is returned.</p>\n"
     },
     "eq": {
@@ -796,6 +893,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#eq 3 3}} equal{{else}} not equal{{/eq}} -> equal",
       "description": "<p>Block helper that renders a block if <code>a</code> is <strong>equal to</strong> <code>b</code>. If an inverse block is specified it will be rendered when falsy. You may optionally use the <code>compare=&quot;&quot;</code> hash argument for the second value.</p>\n"
     },
     "gt": {
@@ -805,6 +903,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#gt 4 3}} greater than{{else}} not greater than{{/gt}} -> greater than",
       "description": "<p>Block helper that renders a block if <code>a</code> is <strong>greater than</strong> <code>b</code>. If an inverse block is specified it will be rendered when falsy. You may optionally use the <code>compare=&quot;&quot;</code> hash argument for the second value.</p>\n"
     },
     "gte": {
@@ -814,6 +913,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#gte 4 3}} greater than or equal{{else}} not greater than{{/gte}} -> greater than or equal",
       "description": "<p>Block helper that renders a block if <code>a</code> is <strong>greater than or equal to</strong> <code>b</code>. If an inverse block is specified it will be rendered when falsy. You may optionally use the <code>compare=&quot;&quot;</code> hash argument for the second value.</p>\n"
     },
     "has": {
@@ -823,6 +923,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#has \"foobar\" \"foo\"}} has it{{else}} doesn't{{/has}} -> has it",
       "description": "<p>Block helper that renders a block if <code>value</code> has <code>pattern</code>. If an inverse block is specified it will be rendered when falsy.</p>\n"
     },
     "isFalsey": {
@@ -831,6 +932,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{isFalsey \"\" }} -> true",
       "description": "<p>Returns true if the given <code>value</code> is falsey. Uses the [falsey][] library for comparisons. Please see that library for more information or to report bugs with this helper.</p>\n"
     },
     "isTruthy": {
@@ -839,6 +941,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{isTruthy \"12\" }} -> true",
       "description": "<p>Returns true if the given <code>value</code> is truthy. Uses the [falsey][] library for comparisons. Please see that library for more information or to report bugs with this helper.</p>\n"
     },
     "ifEven": {
@@ -847,6 +950,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{#ifEven 2}} even {{else}} odd {{/ifEven}} -> even",
       "description": "<p>Return true if the given value is an even number.</p>\n"
     },
     "ifNth": {
@@ -856,6 +960,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#ifNth 10 2}} remainder {{else}} no remainder {{/ifNth}} -> remainder",
       "description": "<p>Conditionally renders a block if the remainder is zero when <code>a</code> operand is divided by <code>b</code>. If an inverse block is specified it will be rendered when the remainder is <strong>not zero</strong>.</p>\n"
     },
     "ifOdd": {
@@ -864,6 +969,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{#ifOdd 3}} odd {{else}} even {{/ifOdd}} -> odd",
       "description": "<p>Block helper that renders a block if <code>value</code> is <strong>an odd number</strong>. If an inverse block is specified it will be rendered when falsy.</p>\n"
     },
     "is": {
@@ -873,6 +979,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#is 3 3}} is {{else}} is not {{/is}} -> is",
       "description": "<p>Block helper that renders a block if <code>a</code> is <strong>equal to</strong> <code>b</code>. If an inverse block is specified it will be rendered when falsy. Similar to <a href=\"#eq\">eq</a> but does not do strict equality.</p>\n"
     },
     "isnt": {
@@ -882,6 +989,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#isnt 3 3}} isnt {{else}} is {{/isnt}} -> is",
       "description": "<p>Block helper that renders a block if <code>a</code> is <strong>not equal to</strong> <code>b</code>. If an inverse block is specified it will be rendered when falsy. Similar to <a href=\"#unlesseq\">unlessEq</a> but does not use strict equality for comparisons.</p>\n"
     },
     "lt": {
@@ -890,6 +998,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{#lt 2 3}} less than {{else}} more than or equal {{/lt}} -> less than",
       "description": "<p>Block helper that renders a block if <code>a</code> is <strong>less than</strong> <code>b</code>. If an inverse block is specified it will be rendered when falsy. You may optionally use the <code>compare=&quot;&quot;</code> hash argument for the second value.</p>\n"
     },
     "lte": {
@@ -899,6 +1008,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#lte 2 3}} less than or equal {{else}} more than {{/lte}} -> less than or equal",
       "description": "<p>Block helper that renders a block if <code>a</code> is <strong>less than or equal to</strong> <code>b</code>. If an inverse block is specified it will be rendered when falsy. You may optionally use the <code>compare=&quot;&quot;</code> hash argument for the second value.</p>\n"
     },
     "neither": {
@@ -908,6 +1018,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#neither null null}} both falsey {{else}} both not falsey {{/neither}} -> both falsey",
       "description": "<p>Block helper that renders a block if <strong>neither of</strong> the given values are truthy. If an inverse block is specified it will be rendered when falsy.</p>\n"
     },
     "not": {
@@ -916,6 +1027,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{#not undefined }} falsey {{else}} not falsey {{/not}} -> falsey",
       "description": "<p>Returns true if <code>val</code> is falsey. Works as a block or inline helper.</p>\n"
     },
     "or": {
@@ -924,6 +1036,7 @@
         "options"
       ],
       "numArgs": 2,
+      "example": "{{#or 1 2 undefined }} at least one truthy {{else}} all falsey {{/or}} -> at least one truthy",
       "description": "<p>Block helper that renders a block if <strong>any of</strong> the given values is truthy. If an inverse block is specified it will be rendered when falsy.</p>\n"
     },
     "unlessEq": {
@@ -933,6 +1046,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#unlessEq 2 1 }} not equal {{else}} equal {{/unlessEq}} -> not equal",
       "description": "<p>Block helper that always renders the inverse block <strong>unless <code>a</code> is equal to <code>b</code></strong>.</p>\n"
     },
     "unlessGt": {
@@ -942,6 +1056,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#unlessGt 20 1 }} not greater than {{else}} greater than {{/unlessGt}} -> greater than",
       "description": "<p>Block helper that always renders the inverse block <strong>unless <code>a</code> is greater than <code>b</code></strong>.</p>\n"
     },
     "unlessLt": {
@@ -951,6 +1066,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#unlessLt 20 1 }} greater than or equal {{else}} less than {{/unlessLt}} -> greater than or equal",
       "description": "<p>Block helper that always renders the inverse block <strong>unless <code>a</code> is less than <code>b</code></strong>.</p>\n"
     },
     "unlessGteq": {
@@ -960,6 +1076,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#unlessGteq 20 1 }} less than {{else}} greater than or equal to {{/unlessGteq}} -> greater than or equal to",
       "description": "<p>Block helper that always renders the inverse block <strong>unless <code>a</code> is greater than or equal to <code>b</code></strong>.</p>\n"
     },
     "unlessLteq": {
@@ -969,6 +1086,7 @@
         "options"
       ],
       "numArgs": 3,
+      "example": "{{#unlessLteq 20 1 }} greater than {{else}} less than or equal to {{/unlessLteq}} -> greater than",
       "description": "<p>Block helper that always renders the inverse block <strong>unless <code>a</code> is less than or equal to <code>b</code></strong>.</p>\n"
     }
   },
@@ -983,4 +1101,4 @@
       "description": "<p>Format a date using moment.js data formatting.</p>\n"
     }
   }
-}
+}
\ No newline at end of file
diff --git a/packages/string-templates/yarn.lock b/packages/string-templates/yarn.lock
index c31c74fc15..a3d5ac638d 100644
--- a/packages/string-templates/yarn.lock
+++ b/packages/string-templates/yarn.lock
@@ -4386,9 +4386,9 @@ source-map-support@^0.5.6, source-map-support@~0.5.19:
     source-map "^0.6.0"
 
 source-map-url@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
-  integrity sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM=
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.1.tgz#0af66605a745a5a2f91cf1bbf8a7afbc283dec56"
+  integrity sha512-cPiFOTLUKvJFIg4SKVScy4ilPPW6rFgMgfuZJPNoDuMs3nC1HbMUycBoJw77xFIp6z1UJQJOfx6C9GMH80DiTw==
 
 source-map@^0.5.0, source-map@^0.5.6:
   version "0.5.7"