Added Router and Flux snippets

Author: webbushka

README.md

@@ -1,7 +1,7 @@
 Atom React.js Snippets [![Build Status](https://travis-ci.org/webbushka/atom-react-snippets.svg?branch=master)](https://travis-ci.org/webbushka/atom-react-snippets)
 ====================================================================================================================================================================
 
-A React.js snippet library for [Atom](https://atom.io/). This library uses ES6 syntax, if you would prefer ES5 or Coffeescript snippets please use the [Atom React Package](https://atom.io/packages/react).
+An [Atom](https://atom.io/) snippet library for React, React Router and Flux. This library uses ES6 syntax, if you would prefer ES5 or Coffeescript snippets please use the [Atom React Package](https://atom.io/packages/react).
 
 Install
 -------
@@ -23,10 +23,6 @@ Features
 --------
 
 -	React Snippets
-
-TODO
-----
-
 -	React Router Snippets
 -	Flux Snippets
 

package.json

@@ -1,8 +1,8 @@
 {
 	"name": "react-snippets",
 	"version": "0.0.1",
-	"description": "React (JSX) snippets for Atom",
-	"main": "Gulpfile.js",
+	"description": "Atom Snippets for React, React Router and Flux",
+	"main": "./lib/react-snippets",
 	"scripts": {
 		"test": "gulp"
 	},
@@ -12,6 +12,8 @@
 	},
 	"keywords": [
 		"react",
+		"react router",
+		"flux",
 		"snippets",
 		"es6"
 	],

snippets/Flux.cson

@@ -0,0 +1,14 @@
+{
+".source.js":
+	"Flux Action":
+		prefix: "_fa"
+		body: "'use strict';\nimport ${1:AppDispatcher} from '../dispatcher/${1:AppDispatcher}';\nimport ${2:constants} from '../constants/${2:constants}';\nimport ${3:utils} from '../utils/${3:utils};'\n\nexport default {\n\t${4}\n};"
+
+	"Flux: AppDispatcher":
+		prefix: "_fd"
+		body: "'use strict';\nimport { Dispatcher } from 'flux';\n\nlet AppDispatcher = new Dispatcher();\n\nAppDispatcher.handleAction = function(action) {\n\tthis.dispatch({\n\t\tsource: 'VIEW_ACTION',\n\t\taction: action\n\t});};\n\nexport default AppDispatcher;"
+
+	"Flux: Store":
+		prefix: "_fs"
+		body: "'use strict';\nimport ${1:AppDispatcher} from '../dispatcher/${1:AppDispatcher}';\nimport ${2:appConstants} from '../constants/${2:appConstants}';\nimport { EventEmitter } from 'event';\nimport assign from 'react/lib/Object.assign';\n\nlet _state = {};\n\nlet ${3:store} = assign({}, EventEmitter.prototype, {\n\t${4}\n});\n\nAppDispatcher.register((payload) => {\n\tlet { action } = payload;\n\n\t switch(action.actionType) {\n\n\t\tdefault:\n\t\t\treturn true;\n\t}\n});\n\nexport default ${3:store};"
+}

snippets/React (JSX).cson

@@ -1,78 +1,78 @@
 {
 ".source.js":
 	"React: componentDidMount() { ... }":
-		prefix: "cdm"
+		prefix: "_cdm"
 		body: "componentDidMount() {\n\t${1}\n},"
 
 	"React: componentDidUpdate(pp, ps) { ... }":
-		prefix: "cdup"
+		prefix: "_cdup"
 		body: "componentDidUpdate(prevProps, prevState) {\n\t${1}\n},"
 
 	"React: componentWillMount() { ... }":
-		prefix: "cwm"
+		prefix: "_cwm"
 		body: "componentWillMount() {\n\t${1}\n},"
 
 	"React: componentWillReceiveProps(np) { ... }":
-		prefix: "cwr"
+		prefix: "_cwr"
 		body: "componentWillReceiveProps(nextProps) {\n\t${1}\n},"
 
 	"React: componentWillUnmount() { ... }":
-		prefix: "cwun"
+		prefix: "_cwun"
 		body: "componentWillUnmount() {\n\t${1}\n},"
 
 	"React: componentWillUpdate(np, ns) { ... }":
-		prefix: "cwu"
+		prefix: "_cwu"
 		body: "componentWillUpdate(nextProps, nextState) {\n\t${1}\n},"
 
 	"React: cx({ ... })":
-		prefix: "cx"
+		prefix: "_cx"
 		body: "cx({\n\t$1: $2\n});"
 
 	"React: forceUpdate(...)":
-		prefix: "fup"
+		prefix: "_fup"
 		body: "forceUpdate(${1:callback});"
 
 	"React: getDefaultProps() { return {...} } ":
-		prefix: "gdp"
+		prefix: "_gdp"
 		body: "getDefaultProps() {\n\treturn {\n\t\t${1}\n\t};\n},"
 
 	"React: getInitialState() { return {...} } ":
-		prefix: "gis"
+		prefix: "_gis"
 		body: "getInitialState() {\n\treturn {\n\t\t${1}: ${2}\n\t};\n},"
 
 	"React: isMounted()":
-		prefix: "ism"
+		prefix: "_ism"
 		body: "isMounted()"
 
 	"React: propTypes { ... }":
-		prefix: "pt"
+		prefix: "_pt"
 		body: "propTypes: {\n\t${1}: React.PropTypes.${2:string}\n},"
 
 	"React: component skeleton":
-		prefix: "rcc"
-		body: "var React = require('react');\n\nvar ${1} = React.createClass({\n\n\trender() {\n\t\treturn (\n\t\t\t${0:<div />}\n\t\t);\n\t}\n\n});\n\nmodule.exports = ${1};"
+		prefix: "_rcc"
+		body: "import React from 'react';\n\nexport default React.createClass({\n\n\trender() {\n\t\treturn (\n\t\t\t${1:<div />}\n\t\t);\n\t}\n\n});"
 
 	"React: render() { return ... }":
-		prefix: "ren"
+		prefix: "_ren"
 		body: "render() {\n\treturn (\n\t\t${1:<div />}\n\t);\n}"
 
 	"React: setState({ ... })":
-		prefix: "sst"
+		prefix: "_sst"
 		body: "setState({\n\t${1}: ${2}\n});"
 
 	"React: shouldComponentUpdate(np, ns) { ... }":
-		prefix: "scu"
+		prefix: "_scu"
 		body: "shouldComponentUpdate(nextProps, nextState) {\n\t${1}\n},"
 
 	"React: this.props.":
-		prefix: "props"
+		prefix: "_props"
 		body: "this.props.${1}"
 
 	"React: this.state.":
-		prefix: "state"
+		prefix: "_state"
 		body: "this.state.${1}"
 
 	"React: render(component, container, [callback])":
-		prefix: "rrc"
+		prefix: "_rrc"
 		body: "React.render(${1:<$2 />}, ${3:document.body}${4:, ${5:callback}});"
 }

snippets/React Router.cson

@@ -0,0 +1,58 @@
+{
+".source.js":
+	"Router: router skeleton":
+		prefix: "_rr"
+		body: "'use strict';\nimport React from 'react';\nimport Router from 'react-router';\nlet { Route, DefaultRoute, NotFoundRoute } = Router;\n\n// -- Import components\nimport ${1:App} from '${2}';\n\nexport default (\n\t<Route handler={${1:App}} path='/'>\n\t\t${3}\n\t</Route>\n);"
+
+	"Router: Router.run( ... )":
+		prefix: "_run"
+		body: "Router.run(${1:routes},${2: Router.HistoryLocaion}, (Handler) => {\n\tReact.render(<Handler />, document.${3:getElementById('${4:app}')});\n});"
+
+	"Router: Router.create({ ... })":
+		prefix: "_rc"
+		body: "var router = Router.create({\n\troutes: ${1:routes},\n\tlocation: Router.HistoryLocatio\n});\nrouter.run((Handler) => {\n\tReact.render(<Handler />, document.${3:getElementById('${4:app}')});\n});"
+
+	"Router: <Route />":
+		prefix: "_rt"
+		body: "<Route name='${1}' handler={${2}} ${3:path='${4}'} />"
+
+	"Router: Nested <Route></Route>":
+		prefix: "_nrt"
+		body: "<Route name='${1}' handler={${2}} ${3:path='${4}'}>\n\t${5}\n</Route>"
+
+	"Router: <Redirect />":
+		prefix: "_rrt"
+		body: "<Redirect from='${1}' to=${2} />"
+
+	"Router: <NotFoundRoute />":
+		prefix: "_nfrt"
+		body: "<NotFoundRoute handler={${1}}/>"
+
+	"Router: <DefaultRoute />":
+		prefix: "_drt"
+		body: "<DefaultRoute handler={${1}} />"
+
+	"Router: <Link />":
+		prefix: "_ln"
+		body: "<Link to={${1}} params={${2}} ${3:query={${4}}}/>"
+
+	"Router: willTransitionTo(t, p) { ... }":
+		prefix: "_wtt"
+		body: "willTransitionTo(transition, params) {\n\t${1}\n},"
+
+	"Router: willTransitionFrom(t, c) { ... }":
+		prefix: "_wtf"
+		body: "willTransitionFrom(transition, component) {\n\t${1}\n},"
+
+	"Router: transition.abort()":
+		prefix: "_ta"
+		body: "transition.abort();"
+
+	"Router: transition.retry()":
+		prefix: "_tr"
+		body: "transition.retry();"
+
+	"Router: transition.redirect()":
+		prefix: "_trd"
+		body: "transition.redirect(${1:to}, ${2:params}, ${3:query});"
+}