touchstack - npm Package Compare versions

Comparing version 0.3.5 to 0.3.6

package.json

		{
		"name": "touchstack",
		"version": "0.3.5",
		"version": "0.3.6",
		"description": "Awesome App Framework powered by React & Apache Cordova",
		@@ -5,0 +5,0 @@ "main": "build/index.js",

126

README.md

		@@ -5,130 +5,12 @@ # TouchStack

		Currently in dev/planning
		Currently in dev/planning =)

		## Documentation
		[Click here](https://github.com/hubstack/touchstack/wiki/Getting Started)
		### Documentation
		https://github.com/hubstack/touchstack/wiki/Getting%20Started

		## Examples
		### Examples
		Complete Project: https://github.com/hubstack/touchstack-example

		### Sample App
		```
		import React from 'react'
		import ReactDOM from 'react-dom'
		import {
		Application,
		StatusBar,
		View,
		ViewsManager,
		Label,
		Link
		} from 'touchstack'

		var App = React.createClass({
		render () {
		return (
		<Application>
		<StatusBar />
		<ViewsManager defaultView="homeView">
		<View name="homeView">
		<Label>Hello World!</Label>
		<Link to="secondView" transition="showFromRight">Go to second view!</Link>
		</View>
		<View name="secondView">
		<Link to="homeView" transition="revealFromRight">Go back</Link>
		</View>
		</ViewsManager>
		</Application>
		);
		}
		});

		function initApplication () {
		ReactDOM.render(<App />, document.getElementById('application'));
		}

		if (!window.cordova) {
		initApplication();
		} else {
		document.addEventListener('deviceready', initApplication, false);
		}
		```

		### Core Components

		##### ViewsManager Example
		```
		<ViewsManager defaultView="homeView">
		<View name="homeView">
		<Label>Home View</Label>
		</View>
		<View name="anotherView">
		<Label>Another View</Label>
		</View>
		</ViewsManager>
		```

		##### View Example
		```
		<View>
		<Label text="Hello World" />
		</View>
		```

		##### Panel Example
		```
		<Panel>
		<Label text="UhOh" />
		</Panel>
		```
		Scrollable area:
		```
		<Panel type="scrollable" onScroll={event...}>
		<Label text="UhOh" />
		</Panel>
		```
		This use flex display mode for grids:
		```
		<Panel type="row">
		<Label text="UhOh" />
		</Panel>
		```

		##### StatusBar Example
		```
		<StatusBar />
		```
		Light text color:
		```
		<StatusBar type="light" />
		```

		### UI Components

		##### NavigationBar Example
		```
		<NavigationBar title="Title" />
		```

		##### SearchBar Example
		```
		<SearchBar placeholder="Search here" value={value...}
		onChange={event...}
		onCancel={event...}
		onSubmit={event...}
		/>
		```

		##### Label Example
		```
		<Label>Text</Label>
		```

		##### Icon Example
		```
		<Icon icon="ion-ios-search" />
		```

		[npm-image]: https://img.shields.io/npm/v/touchstack.svg?style=flat
		[npm-url]: https://www.npmjs.org/package/touchstack
		[downloads-image]: https://img.shields.io/npm/dm/touchstack.svg?style=flat

touchstack - npm Package Compare versions

Worsened metrics