Merge pull request #169 from omarluq/omarluq/turbo-stream-morph-actio…

…n-docs

add docs for turbo stream morph action

_source/handbook/05_streams.md

@@ -73,6 +73,22 @@ A Turbo Streams message is a fragment of HTML consisting of `<turbo-stream>` ele
   </template>
 </turbo-stream>
 
+<turbo-stream action="morph" target="current_step">
+  <template>
+    <!-- The contents of this template will replace the 
+    element with ID "current_step" via morph. -->
+    <li>New item</li>
+  </template>
+</turbo-stream>
+
+<turbo-stream action="morph" target="current_step" children-only>
+  <template>
+    <!-- The contents of this template will replace the 
+    children of the element with ID "current_step" via morph. -->
+    <li>New item</li>
+  </template>
+</turbo-stream>
+
 <turbo-stream action="refresh" request-id="abcd-1234"></turbo-stream>
 ```
 

_source/reference/streams.md

@@ -91,6 +91,28 @@ Inserts the content within the template tag after the element designated by the
 </turbo-stream>
 ```
 
+### Morph
+
+Replaces the element designated by the target dom id via morph.
+
+```html
+<turbo-stream action="morph" target="dom_id">
+  <template>
+    Content to replace the element.
+  </template>
+</turbo-stream>
+```
+
+The `children-only` attribute can be added to the `turbo-stream` element to morph only the children of the element designated by the target dom id.
+
+```html
+<turbo-stream action="morph" target="dom_id" children-only>
+  <template>
+    Content to replace the element.
+  </template>
+</turbo-stream>
+```
+
 ### Refresh
 
 Initiates a [Page Refresh](/handbook/page_refreshes) to render new content with