Editor/Tools/select.js

import Tool from '../Systems/Tool';
import {View , Text , Button,StyleSheet} from 'react-native';
import React from 'react';
import { Icon } from 'react-native-elements'

import Library from 'trapilib/dist/lib';

let {
	CoreSystem,
	ViewSystem,
	ViewNode
} = Library; 


const styles = StyleSheet.create({
  container: {
    flex: 1,
    borderRadius: 4,
    borderWidth: 1,
    borderColor: '#d6d7da',
    backgroundColor: 'red',
    alignItems: 'center',
    justifyContent: 'center',
  },
  text:{
  	flex:1,
  	backgroundColor:'red'
  }
});

const mStyle = StyleSheet.create({
	container:{
		flex:1,
		flexDirection:'row'
	}
})


export default class Select extends Tool{
	constructor(props){
		super(props)
		this.selectedNode = null;
	}

	editViewNode(CS,node){
		if(!node) return;
		
		if( this.selectedNode ) {
			this.selectedNode.props.selected = false;
			this.selectedNodeParent.props.selected = false;
		}

		node.props = {
			...node.props,
			selected: true
		}
		this.selectedNode = node;
		let view = CS.Routing.getCurrentView();
		console.log(view, CS.ViewSystem);
		this.selectedNodeParent = CS.ViewSystem.views[view].getNode(CS.ViewSystem.views[view].getParent(node));
		console.log(this.selectedNodeParent)
		this.selectedNodeParent.props = {
			...this.selectedNodeParent.props,
			selected: true
		}
		//	let EditNode = new ViewNode(Math.random(),"ViewComp",{text:"Manipulationg the dom",style:styles})	
		//VS.views[View].addViewNode(EditNode,node)
		//VS.views[View].replace(node,EditNode);
		
		

		
	}

	render(){
		return(
			<View styles={mStyle.container}>
				<Button title={<Icon  name='sc-telegram'
	  				type='evilicon'
	  				color="#606060"/>}/>
			</View>
		)
	}
}

const UnSelectedCont = StyleSheet.create({
	container:{
		padding:0,
		borderWidth:1
	}
})