Merge branch 'master' of http://git.onarbooks.com/klapi/TrapiLib

App.js

@@ -7,19 +7,14 @@ import CoreSystem from './lib/systems/CoreSystem.js';
 /*********** Custom View Tree ****/
 import { Tree } from './lib/helpers/tree';
 
+import FormComp from './modules/Form';
+
 import  TextComp  from './modules/Text';
-import ViewComp from './modules/View';
 import RootComp from './modules/RootComp';
 import ImageComp from './modules/Image';
 import ButtonComp from './modules/Button';
 
 
-let NodeB = new ViewNode("B","ViewComp", {text: "ASD LOOK AT ME LOOK OO O.O (O.O)"});
-let NodeC = new ViewNode("C","ViewComp",{text:"Manipulationg the dom"});
-let NodeD = new ViewNode("D","ViewComp",{text:"Manipulationg the dom"});
-let NodeE = new ViewNode("E","ViewComp",{text:"Manipulationg the dom"});
-let NodeM = new ViewNode("M","ViewComp",{text:"Manipulationg the dom"});
-let NodeK = new ViewNode("K","ViewComp",{text:"Manipulationg the dom"});
 const CustomStyle = StyleSheet.create({
   container:{
     flex:1,
@@ -42,7 +37,7 @@ const RootStyle = StyleSheet.create({
 let RootNode = new ViewNode("A","RootComp",{text:"This is the   asd asd asd asd asd asd sda asdaasdasd asd  asdasd asd asd  dasasdasd asd  adsasd asd asd  asdasd asd asd asd asd asd asd asd asd sda asdaasdasd asd  asdasd asd asd  dasasdasd asd  adsasd asd asd  asdasd asd asd asd asd asd asd asd asd sda asdaasdasd asd  asdasd asd asd  dasasdasd asd  adsasd asd asd  asdasd asd asd asd asd asd asd asd asd sda asdStarting point!!!Try add on me ",style:RootStyle});
 
 let TestNode = new ViewNode("H","Text",{style:CustomStyle,text:"Edited  Text Node Will be here"})
-let EditNode = new ViewNode("N","ViewComp",{text:"Manipulationg the dom sdadwad"});
+
 let ImageNode = new ViewNode("asdasd","Image");
 
 // let Row1 = new RowNode("RootRow");
@@ -177,15 +172,16 @@ export default function App() {
       {React.createElement(ButtonComp)}
          <Text>Open up App.js to start working on your app!</Text>
 
-
+        <Text>here i s</Text>
       {React.createElement(TextComp)}
       <Text>sdadada</Text>
-      {React.createElement(ViewComp)}
       {React.createElement(RootComp)}
       <Div style={{width: 200, height:400}}>
         {React.createElement(ImageComp)}
       </Div>
-
+      <Div style={{width: 200, height:400}}>
+      {React.createElement(FormComp)}
+      </Div>
       <Text>Open up App.js to start working on your app!</Text>
       
       <Div style={{width:500, height:600}}>

dist/modules/BaseContainer.js

@@ -1 +1 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=BaseContainer;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _Types=_interopRequireDefault(require("../lib/Types"));var _jsxFileName="C:\\Users\\Karteri\\Desktop\\Development\\TrapiLib\\modules\\BaseContainer.js";function BaseContainer(props){var selected=props.selected,width=props.width,height=props.height,restProps=(0,_objectWithoutProperties2["default"])(props,["selected","width","height"]);if(!width)width=BaseContainer.Inputs.width["default"];if(!height)height=BaseContainer.Inputs.height["default"];return _react["default"].createElement(_reactNative.View,(0,_extends2["default"])({},restProps,{style:{width:width,height:height},__source:{fileName:_jsxFileName,lineNumber:16}}));}BaseContainer.Inputs={width:new _Types["default"].Integer().require()["default"](50),height:new _Types["default"].Integer().require()["default"](50)};
+"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=BaseContainer;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _Types=_interopRequireDefault(require("../lib/Types"));var _jsxFileName="/Users/konstantinosschoinas/Desktop/modular/TrapiLib/modules/BaseContainer.js";function BaseContainer(props){var selected=props.selected,width=props.width,height=props.height,restProps=(0,_objectWithoutProperties2["default"])(props,["selected","width","height"]);if(!width)width=BaseContainer.Inputs.width["default"];if(!height)height=BaseContainer.Inputs.height["default"];return _react["default"].createElement(_reactNative.View,(0,_extends2["default"])({},restProps,{style:{width:width,height:height},__source:{fileName:_jsxFileName,lineNumber:16}}));}BaseContainer.Inputs={width:new _Types["default"].Integer().require()["default"](50),height:new _Types["default"].Integer().require()["default"](50)};

dist/modules/RootComp.js

@@ -1 +1 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireDefault(require("react"));var _Types=_interopRequireDefault(require("../lib/Types"));var _Module2=_interopRequireDefault(require("../lib/Module"));var _reactNative=require("react-native");var _jsxFileName="C:\\Users\\Karteri\\Desktop\\Development\\TrapiLib\\modules\\RootComp.js";var RootComp=function(_Module){(0,_inherits2["default"])(RootComp,_Module);function RootComp(props){(0,_classCallCheck2["default"])(this,RootComp);return(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(RootComp).call(this,props));}(0,_createClass2["default"])(RootComp,[{key:"display",value:function display(){return _react["default"].createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:13}},_react["default"].createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:14}},this.props.text||""," - ",this.props.second),this.props.children);}}]);return RootComp;}(_Module2["default"]);exports["default"]=RootComp;RootComp.Inputs={text:new _Types["default"].Text().require()["default"]("Sample Text"),second:new _Types["default"].Integer().require()["default"](5)};
+"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireDefault(require("react"));var _Types=_interopRequireDefault(require("../lib/Types"));var _Module2=_interopRequireDefault(require("../lib/Module"));var _reactNative=require("react-native");var _jsxFileName="/Users/konstantinosschoinas/Desktop/modular/TrapiLib/modules/RootComp.js";var RootComp=function(_Module){(0,_inherits2["default"])(RootComp,_Module);function RootComp(props){(0,_classCallCheck2["default"])(this,RootComp);return(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(RootComp).call(this,props));}(0,_createClass2["default"])(RootComp,[{key:"display",value:function display(){return _react["default"].createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:13}},_react["default"].createElement(_reactNative.Text,{__source:{fileName:_jsxFileName,lineNumber:14}},this.props.text||""," - ",this.props.second),this.props.children);}}]);return RootComp;}(_Module2["default"]);exports["default"]=RootComp;RootComp.Inputs={text:new _Types["default"].Text().require()["default"]("Sample Text"),second:new _Types["default"].Integer().require()["default"](5)};

dist/modules/Text.js

@@ -1 +1 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireDefault(require("react"));var _Module2=_interopRequireDefault(require("../lib/Module"));var _reactNative=require("react-native");var _Types=_interopRequireDefault(require("../lib/Types"));var _jsxFileName="C:\\Users\\Karteri\\Desktop\\Development\\TrapiLib\\modules\\Text.js";var TextComp=function(_Module){(0,_inherits2["default"])(TextComp,_Module);function TextComp(props){var _this;(0,_classCallCheck2["default"])(this,TextComp);_this=(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(TextComp).call(this,props));_this.state={text:props.text||""};return _this;}(0,_createClass2["default"])(TextComp,[{key:"display",value:function display(){var _this$props=this.props,text=_this$props.text,color=_this$props.color,fontSize=_this$props.fontSize;return _react["default"].createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:21}},_react["default"].createElement(_reactNative.Text,{style:{color:color,fontSize:fontSize},__source:{fileName:_jsxFileName,lineNumber:22}},text),this.props.children);}}]);return TextComp;}(_Module2["default"]);exports["default"]=TextComp;TextComp.Inputs={text:new _Types["default"].Text()["default"]("Enter Text"),color:new _Types["default"].Text(),fontSize:new _Types["default"].Integer()["default"](22)};
+"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireDefault(require("react"));var _Module2=_interopRequireDefault(require("../lib/Module"));var _reactNative=require("react-native");var _Types=_interopRequireDefault(require("../lib/Types"));var _jsxFileName="/Users/konstantinosschoinas/Desktop/modular/TrapiLib/modules/Text.js";var TextComp=function(_Module){(0,_inherits2["default"])(TextComp,_Module);function TextComp(props){var _this;(0,_classCallCheck2["default"])(this,TextComp);_this=(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(TextComp).call(this,props));_this.state={text:props.text||""};return _this;}(0,_createClass2["default"])(TextComp,[{key:"display",value:function display(){var _this$props=this.props,text=_this$props.text,color=_this$props.color,fontSize=_this$props.fontSize;return _react["default"].createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:21}},_react["default"].createElement(_reactNative.Text,{style:{color:color,fontSize:fontSize},__source:{fileName:_jsxFileName,lineNumber:22}},text),this.props.children);}}]);return TextComp;}(_Module2["default"]);exports["default"]=TextComp;TextComp.Inputs={text:new _Types["default"].Text()["default"]("Enter Text"),color:new _Types["default"].Text(),fontSize:new _Types["default"].Integer()["default"](22)};

dist/modules/View.js

@@ -1 +1 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireDefault(require("react"));var _Module2=_interopRequireDefault(require("../lib/Module"));var _reactNative=require("react-native");var _jsxFileName="C:\\Users\\Karteri\\Desktop\\Development\\TrapiLib\\modules\\View.js";var ViewComp=function(_Module){(0,_inherits2["default"])(ViewComp,_Module);function ViewComp(props){(0,_classCallCheck2["default"])(this,ViewComp);return(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(ViewComp).call(this,props));}(0,_createClass2["default"])(ViewComp,[{key:"display",value:function display(){return _react["default"].createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:11}},this.props.children);}}]);return ViewComp;}(_Module2["default"]);exports["default"]=ViewComp;
+"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireDefault(require("react"));var _Module2=_interopRequireDefault(require("../lib/Module"));var _reactNative=require("react-native");var _jsxFileName="/Users/konstantinosschoinas/Desktop/modular/TrapiLib/modules/View.js";var ViewComp=function(_Module){(0,_inherits2["default"])(ViewComp,_Module);function ViewComp(props){(0,_classCallCheck2["default"])(this,ViewComp);return(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(ViewComp).call(this,props));}(0,_createClass2["default"])(ViewComp,[{key:"display",value:function display(){return _react["default"].createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:11}},this.props.children);}}]);return ViewComp;}(_Module2["default"]);exports["default"]=ViewComp;

dist/modules/ViewComp.js

@@ -1 +1 @@
-"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireDefault(require("react"));var _Module2=_interopRequireDefault(require("../lib/Module"));var _reactNative=require("react-native");var _jsxFileName="C:\\Users\\Karteri\\Desktop\\Development\\TrapiLib\\modules\\ViewComp.js";var ViewComp=function(_Module){(0,_inherits2["default"])(ViewComp,_Module);function ViewComp(props){(0,_classCallCheck2["default"])(this,ViewComp);return(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(ViewComp).call(this,props));}(0,_createClass2["default"])(ViewComp,[{key:"display",value:function display(){return _react["default"].createElement(_reactNative.View,{key:Math.random(),__source:{fileName:_jsxFileName,lineNumber:16}});}}]);return ViewComp;}(_Module2["default"]);exports["default"]=ViewComp;
+"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _react=_interopRequireDefault(require("react"));var _Module2=_interopRequireDefault(require("../lib/Module"));var _reactNative=require("react-native");var _jsxFileName="/Users/konstantinosschoinas/Desktop/modular/TrapiLib/modules/ViewComp.js";var ViewComp=function(_Module){(0,_inherits2["default"])(ViewComp,_Module);function ViewComp(props){(0,_classCallCheck2["default"])(this,ViewComp);return(0,_possibleConstructorReturn2["default"])(this,(0,_getPrototypeOf2["default"])(ViewComp).call(this,props));}(0,_createClass2["default"])(ViewComp,[{key:"display",value:function display(){return _react["default"].createElement(_reactNative.View,{key:Math.random(),__source:{fileName:_jsxFileName,lineNumber:16}});}}]);return ViewComp;}(_Module2["default"]);exports["default"]=ViewComp;

dist/modules/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _default=["Text","RootComp","Image","Button","View","ViewComp","BaseContainer"].reduce(function(acc,item){acc[item]=require('./'+item)["default"];return acc;},{});exports["default"]=_default;
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _default=["Text","RootComp","Image","Button","Form","ViewComp","BaseContainer"].reduce(function(acc,item){acc[item]=require('./'+item)["default"];return acc;},{});exports["default"]=_default;

modules/Button.js

@@ -18,7 +18,7 @@ export default class ButtonComp extends Module {
 				<View key={Math.random()} style={container || defaultButton.container }>
 					<Button
 					  onPress = {this.props.press || this.press}
-					  title={this.props.title || "Press me"}
+					  title={this.props.title || "Submit"}
 					  color={this.props.color ||  "#03DAC6"}
 					  accessibilityLabel="Learn more about this purple button"
 					/>
@@ -28,7 +28,7 @@ export default class ButtonComp extends Module {
 }
 
 ButtonComp.Inputs = {
-	title: new Types.Text().require().default('Press me'),
+	title: new Types.Text().require().default('Submit'),
 	color: new Types.Text().require().color().default('#03DAC6')
 }
 

modules/Form.js

@@ -0,0 +1,63 @@
+import React from 'react';
+import Module from '../lib/Module';
+import {StyleSheet ,TextInput, View, Button } from 'react-native';
+
+import Types from '../lib/Types';
+
+
+
+export default class FormComp extends Module {
+	constructor(props) {
+		super(props);
+		this.state = {
+		}
+		this.submit = this.submit.bind(this)
+	}
+	submit(e){
+		e.preventDefault()
+		return this.state
+	}	
+	display() {
+		let {
+			inputsNum,
+			ButtonText,
+			ButtonColor,
+			container
+		} = this.props
+		if(!inputsNum) inputsNum = 2;
+		let Inputs = [];
+		for(let i = 0; i<inputsNum; i++){
+			let key = i+1;
+			let state = {};
+			let input =  <TextInput key={i}
+				        style={{height: 20, borderColor: 'gray', borderWidth: 1 , marginBottom:5}}
+				        onChangeText={(text) => {
+				        	state[key] = text;
+				        	this.setState(state)}}
+				        value={this.state.key}
+				        placeholder={'placeholder'}
+				      />
+			Inputs.push(input);
+		}
+		let fn = this.props.submit || this.submit
+		return 	(
+				<View style={{backgroundColor:"#f7e6ff",width:250,height:100,padding:10}}>
+					{Inputs}
+			        <Button
+				    onPress = {(e) => fn(e)}
+				    title={this.props.title || "Submit"}
+				    color={this.props.ButtonColor ||  "#008CBA"}
+					accessibilityLabel="Learn more about this purple button"
+					/>
+				</View>)
+	}
+}
+
+
+
+FormComp.Inputs = {
+	inputsNum: new Types.Integer().require().default(2),
+	ButtonText:new Types.Text().require().default('Submit'),
+	ButtonColor: new Types.Text().require().color().default('#008CBA')
+}
+

modules/Image.js

@@ -16,9 +16,9 @@ export default class ImageComp extends Module {
 			resizeMode,
 			source
 		} = this.props;
-		if(!width) width = ImageComp.Inputs.width.default;
-		if(!height) height = ImageComp.Inputs.height.default;
-		if(!resizeMode) resizeMode = ImageComp.Inputs.resizeMode.default;
+		if(!width) width = 100;
+		if(!height) height = 100;
+		if(!resizeMode) resizeMode = 'cover';
 		return 	<Image
 			          style={{width, height}}
 			          resizeMode={resizeMode}

modules/View.js

@@ -1,15 +0,0 @@
-import React from 'react';
-import Module from '../lib/Module';
-import { View } from 'react-native';
-
-export default class ViewComp extends Module {
-	constructor(props) {
-		super(props);
-	}
-
-	display() {
-		return 	<View>
-					{this.props.children}
-				</View>;
-	}
-}

modules/index.js

@@ -3,7 +3,7 @@ export default [
 	"RootComp",
 	"Image",
 	"Button",
-	"View",
+	"Form",
 	"ViewComp",
 	"BaseContainer"