Atom / React Snippets

snippets.cson

'.source.js':
  'constructor':
    'prefix': 'construct'
    'body': '''
      constructor(props) {
        super(props);
        $1
      }
    '''

  'render':
    'prefix': 'render'
    'body': '''
      render() {
        return (
          <$1>
            $2
          </$1>
        );
      }
    '''

  'componentDidMount':
    'prefix': 'cdm'
    'body': '''
      componentDidMount() {
        $1
      }
    '''

  'componentWillMount':
    'prefix': 'cwm'
    'body': '''
      componentWillMount() {
        $1
      }
    '''

  'componentWillUnount':
    'prefix': 'cwum'
    'body': '''
      componentWillUnmount() {
        $1
      }
    '''

  'componentWillReceiveProps':
    'prefix': 'cwrp'
    'body': '''
      componentWillReceiveProps(nextProps) {
        $1
      }
    '''

  'shouldComponentUpdate':
    'prefix': 'scu'
    'body': '''
      shouldComponentUpdate() {
        $1
      }
    '''

  'componentDidUpdate':
    'prefix': 'cdu'
    'body': '''
      componentDidUpdate() {
        $1
      }
    '''

  'Empty State':
    'prefix': 'state'
    'body': '''
      this.state = {
        $1
      };
    '''

  'Const { x } = this.props':
    'prefix': 'props'
    'body': '''
      const { $1 } = this.props;
    '''

  'Create React Class':
    'prefix': 'class'
    'body': 'class $1 extends Component'

  'import Styled Components':
    'prefix': 'styled'
    'body': 'import styled from \'styled-components\';'

  'import React':
    'prefix': 'react'
    'body': 'import React from \'react\';'

  'import React, Component':
    'prefix': 'reactc'
    'body': 'import React, { Component } from \'react\';'

  'import PropTypes':
    'prefix': 'prop'
    'body': 'import PropTypes from \'prop-types\';'

  'set Component PropTypes':
    'prefix': 'propT'
    'body': '''
      $1.propTypes = {
      };
    '''

  'set Component defaultProps':
    'prefix': 'defa'
    'body': '''
      $1.defaultProps = {
      };
    '''

  'React Component':
    'prefix': 'comp'
    'body': '''
      import React, { Component } from 'react';
      import PropTypes from 'prop-types';
      class $1 extends Component {
        render() {
          return <div />;
        }
      }
      $1.defaultProps = {};
      $1.propTypes = {};
      export default $1;
    '''