feat(dev): Added path.noop/path.insop example

markdown/dev/reference/api/path/insop/en.md

@@ -6,6 +6,33 @@ title: insop()
 Path path.insop(string id, Path path)
 ```
 
-Injects a Path into the [`noop` operation](#noop) with id `id`.
+Injects a Path into the [`noop` operation](/reference/api/path/noop) with id `id`.
 
-<Fixme>Add example</Fixme>
+<Tip compact>This is often used to insert darts into a path</Tip>
+
+<Example part="path_noop">
+Example of the Path.noop() method
+</Example>
+
+```js
+points.left = new Point(10,10)
+points.dartLeft = new Point(40, 10)
+points.dartTip = new Point(50, 50)
+points.dartRight = new Point(60, 10)
+points.right = new Point(90, 10)
+
+paths.withoutDart = new Path()
+  .move(points.left)
+  .line(points.dartLeft)
+  .noop('dart')
+  .line(points.right)
+
+paths.withDart = paths.without
+  .insop(
+    'dart',
+    new Path()
+      .line(points.dartTip)
+      .line(points.dartRight)
+  )
+  .attr('style', 'stroke-width: 2px; stroke-opacity: 0.5; stroke: orange;')
+```

markdown/dev/reference/api/path/noop/en.md

@@ -6,7 +6,36 @@ title: noop()
 Path path.noop(string id)
 ```
 
-Adds a placeholder path opertion.\
+Adds a placeholder path operation.
-A `noop` operation does nothing, but is intended to be replaced later with [`Path.insop()`](#insop).
 
-<Fixme>Add example</Fixme>
+A `noop` operation does nothing, but is intended to be replaced later 
+with [`Path.insop()`](/reference/api/path/insop).
+
+<Tip compact>This is often used to insert darts into a path</Tip>
+
+<Example part="path_noop">
+Example of the Path.noop() method
+</Example>
+
+```js
+points.left = new Point(10,10)
+points.dartLeft = new Point(40, 10)
+points.dartTip = new Point(50, 50)
+points.dartRight = new Point(60, 10)
+points.right = new Point(90, 10)
+
+paths.withoutDart = new Path()
+  .move(points.left)
+  .line(points.dartLeft)
+  .noop('dart')
+  .line(points.right)
+
+paths.withDart = paths.without
+  .insop(
+    'dart',
+    new Path()
+      .line(points.dartTip)
+      .line(points.dartRight)
+  )
+  .attr('style', 'stroke-width: 2px; stroke-opacity: 0.5; stroke: orange;')
+```

packages/examples/config/index.js

@@ -35,6 +35,7 @@ export default {
     'path_intersectsy',
     'path_join',
     'path_length',
+    'path_noop',
     'path_offset',
     'path_reverse',
     'path_shiftalong',

packages/examples/src/index.js

@@ -21,6 +21,7 @@ import draftPath_intersectsx from './path_intersectsx'
 import draftPath_intersectsy from './path_intersectsy'
 import draftPath_join from './path_join'
 import draftPath_length from './path_length'
+import draftPath_noop from './path_noop'
 import draftPath_offset from './path_offset'
 import draftPath_reverse from './path_reverse'
 import draftPath_shiftalong from './path_shiftalong'
@@ -120,6 +121,7 @@ let methods = {
   draftPath_intersectsy,
   draftPath_join,
   draftPath_length,
+  draftPath_noop,
   draftPath_offset,
   draftPath_reverse,
   draftPath_shiftalong,

packages/examples/src/path_noop.js

@@ -0,0 +1,26 @@
+export default (part) => {
+  let { Point, points, Path, paths, Snippet, snippets } = part.shorthand()
+
+  points.left = new Point(10,10)
+  points.dartLeft = new Point(40, 10)
+  points.dartTip = new Point(50, 50)
+  points.dartRight = new Point(60, 10)
+  points.right = new Point(90, 10)
+
+  paths.without = new Path()
+    .move(points.left)
+    .line(points.dartLeft)
+    .noop('dart')
+    .line(points.right)
+
+  paths.withDart = paths.without
+    .insop(
+      'dart',
+      new Path()
+        .line(points.dartTip)
+        .line(points.dartRight)
+    )
+    .attr('style', 'stroke-width: 2px; stroke-opacity: 0.5; stroke: orange;')
+
+  return part
+}