feat(markdown): Ported code howtos to v3

markdown/dev/howtos/code/text-whitespace/en.md

@@ -14,41 +14,59 @@ To add linebreaks to text, you merely have to include them in your text.
 When doing so, keep in mind that single-quoted strings in Javascript
 will **not** pick up linebreaks.
 
-```js
-points.example1.attr('data-text', 'this\nwill\nnot\nwork')
-points.example2.attr('data-text', "this\nwill\nwork")
-points.example2.attr('data-text', `this
-will
-also
-work`)
+<Example caption="An example of whitespace in text">
+```design/src/part.mjs
+function draftPart = ({ 
+  Point,
+  points,
+  Path,
+  paths,
+  part 
+}) {
+  points.demo1 = new Point(10,20)
+  // highlight-start
+    .addText('this\nwill\nwork')
+  // highlight-end
+  points.demo2 = new Point(40,20)
+  // highlight-start
+    .addText("this\nwill\nalso\nwork")
+  // highlight-end
+  points.demo3 = new Point(70,20)
+  // highlight-start
+    .addText(`And
+  this
+  will
+  also
+  work`).attr('data-text-lineheight', 7)
+  // highlight-end
+
+  // Prevent clipping
+  paths.diag = new Path()
+    .move(new Point(0,10))
+    .move(new Point(90, 70))
+
+  return part
+}
 ```
+</Example>
 
 <Tip>
-
-You can control the lineheight by setting the `data-text-lineheight` attribute:
-
-```js
-points.example2
-  .attr('data-text', "this\nwill\nwork")
-  .attr('data-text-lineheight', settings.scale * 8)
-```
-
+You can control the lineheight by setting the `data-text-lineheight` attribute.
 </Tip>
 
-## Adding spaces to text
+## Adding consecutive spaces to text
 
 Adding a single space between two words is not a problem.
 But what if you want to add a couple of spaces in a row?
 Both in HTML and SVG they will get collapsed into a single space.
 
-To get around that, use `&#160;` for space:
+To get around that, use `&#160;` for space.
 
-```js
-points.example.attr(
-  'data-text', 
-  "far &#160;&#160;&#160;&#160; apart"
-)
+```mjs
+ points.demo = new Point(0, 0) 
+  // highlight-start
+  .addText('far &#160;&#160;&#160;&#160; apart')
+  // highlight-end
+}
 ```
 
-Whether you're rendering to SVG or React, by using `&#160;` your spaces
-will be properly rendered in both environments.