JavaScript ES6, 119 bytes
==============

<!-- language: lang-js -->

 F=s=>(C=o=>--a.length?C(a.reduce((p,c,i)=>c+p.slice((a[i-1]=p.slice(0,c.length)).length)))+`
 `+o:o)(a=(s+`
 `).split`
 `)

Here it is ungolfed and in ES5 with comments explaining how it works:

<!-- begin snippet: js hide: false -->

<!-- language: lang-js -->

 function F(s) {
 var arr = (s+'\n').split('\n'); // Create an array of words and append an empty member
 return (function C(output) {
 return --arr.length ? // Remove the last item from the array
 C(arr.reduce(function(p,c,i) { // If the array still has length reduce it to a string and recurse
 var intersection = (arr[i-1] = p.slice(0, c.length)) // Overwrite the previous word with the part that intersects the current word
 return c + p.slice(intersection.length) // Add the part of the previous word that doesn't intersect to the current value
 })) + '\n' + output : output // Add the last level of recursions output on to the end of this
 })(arr);
 }

 input.addEventListener('input', updateOutput, false);

 function updateOutput() {
 var oldLength = input.value.length;
 var start = this.selectionStart;
 var end = this.selectionEnd;
 input.value = input.value.split(/ +/).join('\n');
 var newLength = input.value.length;
 input.setSelectionRange(start, end + (newLength - oldLength));
 output.value = F(input.value).trim();
 }

 updateOutput();

<!-- language: lang-css -->

 textarea {
 width: 50%;
 box-sizing: border-box;
 resize: none;
 float: left;
 height: 10em;
 }

 label {
 width: 50%;
 float: left;
 }

<!-- language: lang-html -->

 <p>Type in the input box below, spaces are automatically converted to newlines and the output updates as you type</p>
 <label for="input">Input</label>
 <label for="output">Output</label>
 <textarea id="input">
 Type inside me :)
 </textarea>
 <textarea id="output" disabled>
 </textarea>

<!-- end snippet -->