Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
{
"React Stateless Component": {
"prefix": "rsc",
"body": [
"// @flow",
"import React from 'react';",
"import injectSheet from 'react-jss';",
"import ${1:method} from '${2:moduleName}';",
"",
"// Styles",
"import Styles from './styles';",
"",
"// Types",
"type Props = {",
" sheet : Object,",
" classes : Object,",
"}",
"",
"function ${3:ComponentName} ({ sheet : { classes }, ${4:props} }: Props): ReactElement<any> {",
" return (",
" <${5:jsxElement} className={classes.${6:ruleName}}>",
" $0",
" </${5:jsxElement}>",
" );",
"}",
"export default injectSheet(Styles)(${3:ComponentName});",
""
],
"description": "Generate a stateless react component"
},
"React Class Component": {
"prefix": "rcc",
"body": [
"// @flow",
"import React, { Component } from 'react';",
"import { observer } from 'mobx-react';",
"import injectSheet from 'react-jss';",
"import ${1:method} from '${2:moduleName}';",
"",
"// Styles",
"import Styles from './styles';",
"",
"// Types",
"type Props = {",
" sheet : Object,",
" classes : Object,",
"}",
"",
"@injectSheet(Styles)",
"@observer",
"class ${3:ComponentName} extends Component {",
" render () {",
" const { sheet : { classes }, ${4:props} } = this.props;",
" return (",
" <${5:jsxElement} className={classes.${6:ruleName}}>",
" $7",
" </${5:jsxElement}>",
" );",
" }",
"",
" props : Props",
"",
"}",
"export default ${3:ComponentName};",
""
],
"description": "Generate a class react component"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.