dom partial reconcile on edit

dom/edit/edit.view.css

@@ -2,6 +2,7 @@
 	flex-direction: column;
 	border-radius: var(--mol_gap_round);
 	flex: 1;
+	white-space: pre-wrap;
 }
 
 [hyoo_crus_dom_edit][contenteditable="true"] {

dom/edit/edit.view.tree

@@ -5,6 +5,7 @@ $hyoo_crus_dom_edit $mol_view
 	enabled true
 	hint \
 	auto /
+		<= setup null
 		<= selection_load null
 		<= selection_sync null
 	plugins /

dom/edit/edit.view.tsx

@@ -11,6 +11,11 @@ namespace $.$$ {
 			return this.enabled() ? 'true' : 'false'
 		}
 
+		@ $mol_mem
+		setup() {
+			// $mol_dom.document.execCommand( 'defaultParagraphSeparator', false, 'p' )
+		}
+
 		@ $mol_mem
 		sub() {
 			console.log('render')
@@ -25,9 +30,20 @@ namespace $.$$ {
 		}
 
 		save() {
-			let nodes = [ ... this.dom_node().childNodes ]
-			nodes = this.$.$mol_dom_safe( nodes )
-			this.node().dom( nodes as Element[] )
+
+			const sel = $mol_dom_range.from_selection()
+			const root = this.dom_node()
+			if( !$mol_dom_range.inside( root ).range_contains( sel ) ) return
+
+			let container = sel.container() as Element
+			while( [ 'SPAN', '#text' ].includes( container.nodeName ) ) {
+				container = container.parentElement!
+			}
+
+			const dom = this.node().land().Node( $hyoo_crus_dom ).Item( container.id )
+			let nodes = [ ... container.childNodes ]
+			nodes = this.$.$mol_dom_safe( nodes as Element[] )
+			dom.dom( nodes as Element[] )
 			this.selection_save()
 		}