{
    "exportType": {
        "body": ["export type ${1:first} = {${2:second}}"],
        "prefix": "exptp"
    },
    "exportInterface": {
        "prefix": "expint",
        "body": ["export interface ${1:first} {${2:second}}"]
    },
    "reactArrowFunctionComponent": {
        "prefix": "rafc",
        "body": [
            "export const ${1:${TM_FILENAME_BASE}} = () => {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "}",
            ""
        ],
        "description": "Creates a React Arrow Function Component with ES7 module system"
    },
    "reactArrowFunctionComponentWithPropTypes": {
        "prefix": "rafcp",
        "body": [
            "import PropTypes from 'prop-types'",
            "",
            "const ${1:${TM_FILENAME_BASE}} = props => {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "}",
            "",
            "${1:${TM_FILENAME_BASE}}.propTypes = {}",
            "",
            "export default ${1:${TM_FILENAME_BASE}}"
        ],
        "description": "Creates a React Arrow Function Component with ES7 module system with PropTypes"
    },
    "reactArrowFunctionExportComponent": {
        "prefix": "rafce",
        "body": [
            "const ${1:${TM_FILENAME_BASE}} = () => {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "}",
            "",
            "export default ${1:${TM_FILENAME_BASE}}"
        ],
        "description": "Creates a React Arrow Function Component with ES7 module system"
    },
    "reactClassComponent": {
        "prefix": "rcc",
        "body": [
            "import { Component } from 'react'",
            "",
            "export default class ${1:${TM_FILENAME_BASE}} extends Component {",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            ""
        ],
        "description": "Creates a React component class with ES7 module system"
    },
    "reactClassComponentPropTypes": {
        "prefix": "rccp",
        "body": [
            "import PropTypes from 'prop-types'",
            "import { Component } from 'react'",
            "",
            "export default class ${1:${TM_FILENAME_BASE}} extends Component {",
            "  static propTypes = {${2:second}: ${3:third}}",
            "",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            ""
        ],
        "description": "Creates a React component class with PropTypes and ES7 module system"
    },
    "reactClassComponentRedux": {
        "prefix": "rcredux",
        "body": [
            "import { Component } from 'react'",
            "import { connect } from 'react-redux'",
            "",
            "export class ${1:${TM_FILENAME_BASE}} extends Component {",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            "",
            "const mapStateToProps = (state) => ({})",
            "",
            "const mapDispatchToProps = {}",
            "",
            "export default connect(mapStateToProps, mapDispatchToProps)(${1:${TM_FILENAME_BASE}})"
        ],
        "description": "Creates a React component class with connected redux and ES7 module system"
    },
    "reactClassComponentReduxPropTypes": {
        "prefix": "rcreduxp",
        "body": [
            "import PropTypes from 'prop-types'",
            "import { Component } from 'react'",
            "import { connect } from 'react-redux'",
            "",
            "export class ${1:${TM_FILENAME_BASE}} extends Component {",
            "  static propTypes = {",
            "    ${2:second}: ${3:third}",
            "  }",
            "",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            "",
            "const mapStateToProps = (state) => ({})",
            "",
            "const mapDispatchToProps = {}",
            "",
            "export default connect(mapStateToProps, mapDispatchToProps)(${1:${TM_FILENAME_BASE}})"
        ],
        "description": "Creates a React component class with PropTypes with connected redux and ES7 module system"
    },
    "reactClassExportComponent": {
        "prefix": "rce",
        "body": [
            "import { Component } from 'react'",
            "",
            "export class ${1:${TM_FILENAME_BASE}} extends Component {",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            "",
            "export default ${1:${TM_FILENAME_BASE}}"
        ],
        "description": "Creates a React component class with ES7 module system"
    },
    "reactClassExportComponentWithPropTypes": {
        "prefix": "rcep",
        "body": [
            "import PropTypes from 'prop-types'",
            "import { Component } from 'react'",
            "",
            "export class ${1:${TM_FILENAME_BASE}} extends Component {",
            "  static propTypes = {}",
            "",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            "",
            "export default ${1:${TM_FILENAME_BASE}}"
        ],
        "description": "Creates a React component class with ES7 module system"
    },
    "reactClassExportPureComponent": {
        "prefix": "rpce",
        "body": [
            "import { PureComponent } from 'react'",
            "",
            "export class ${1:${TM_FILENAME_BASE}} extends PureComponent {",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            "",
            "export default ${1:${TM_FILENAME_BASE}}"
        ],
        "description": "Creates a React pure component class with ES7 module system export"
    },
    "reactClassPureComponent": {
        "prefix": "rpc",
        "body": [
            "import { PureComponent } from 'react'",
            "",
            "export default class ${1:${TM_FILENAME_BASE}} extends PureComponent {",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            ""
        ],
        "description": "Creates a React pure component class with ES7 module system"
    },
    "reactClassPureComponentWithPropTypes": {
        "prefix": "rpcp",
        "body": [
            "import PropTypes from 'prop-types'",
            "import { PureComponent } from 'react'",
            "",
            "export default class ${1:${TM_FILENAME_BASE}} extends PureComponent {",
            "  static propTypes = {}",
            "",
            "  render() {",
            "    return (",
            "      <div>${1:first}</div>",
            "    )",
            "  }",
            "}",
            ""
        ],
        "description": "Creates a React component class with ES7 module system"
    },
    "reactFunctionMemoComponent": {
        "prefix": "rmc",
        "body": [
            "import { memo } from 'react'",
            "",
            "const ${1:${TM_FILENAME_BASE}} = memo(() => {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "})",
            "",
            "export default ${1:${TM_FILENAME_BASE}}"
        ],
        "description": "Creates a React Memo Function Component with ES7 module system"
    },
    "reactFunctionMemoComponentWithPropTypes": {
        "prefix": "rmcp",
        "body": [
            "import PropTypes from 'prop-types'",
            "import { memo } from 'react'",
            "",
            "const ${1:${TM_FILENAME_BASE}} = memo((props) => {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "})",
            "",
            "${1:${TM_FILENAME_BASE}}.propTypes = {}",
            "",
            "export default ${1:${TM_FILENAME_BASE}}"
        ],
        "description": "Creates a React Memo Function Component with ES7 module system with PropTypes"
    },
    "reactFunctionalComponent": {
        "prefix": "rfc",
        "body": [
            "import React from 'react'",
            "",
            "export default function ${1:${TM_FILENAME_BASE}}() {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "}",
            ""
        ],
        "description": "Creates a React Functional Component with ES7 module system"
    },
    "reactFunctionalComponentRedux": {
        "prefix": "rfcredux",
        "body": [
            "import { connect } from 'react-redux'",
            "",
            "export const ${1:${TM_FILENAME_BASE}} = (props) => {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "}",
            "",
            "const mapStateToProps = (state) => ({})",
            "",
            "const mapDispatchToProps = {}",
            "",
            "export default connect(mapStateToProps, mapDispatchToProps)(${1:${TM_FILENAME_BASE}})"
        ],
        "description": "Creates a React functional component with connected redux and ES7 module system"
    },
    "reactFunctionalComponentReduxPropTypes": {
        "prefix": "rfcreduxp",
        "body": [
            "import PropTypes from 'prop-types'",
            "import { connect } from 'react-redux'",
            "",
            "export const ${1:${TM_FILENAME_BASE}} = (props) => {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "}",
            "",
            "${1:${TM_FILENAME_BASE}}.propTypes = {",
            "  ${2:second}: PropTypes.${3:third}",
            "}",
            "",
            "const mapStateToProps = (state) => ({})",
            "",
            "const mapDispatchToProps = {}",
            "",
            "export default connect(mapStateToProps, mapDispatchToProps)(${1:${TM_FILENAME_BASE}})"
        ],
        "description": "DEPRECATED: Creates a React functional component with PropTypes with connected redux and ES7 module system"
    },
    "reactFunctionalComponentWithPropTypes": {
        "prefix": "rfcp",
        "body": [
            "import PropTypes from 'prop-types'",
            "",
            "function ${1:${TM_FILENAME_BASE}}(props) {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "}",
            "",
            "${1:${TM_FILENAME_BASE}}.propTypes = {}",
            "",
            "export default ${1:${TM_FILENAME_BASE}}",
            ""
        ],
        "description": "Creates a React Functional Component with ES7 module system with PropTypes"
    },
    "reactFunctionalExportComponent": {
        "prefix": "rfce",
        "body": [
            "function ${1:${TM_FILENAME_BASE}}() {",
            "  return (",
            "    <div>${1:first}</div>",
            "  )",
            "}",
            "",
            "export default ${1:${TM_FILENAME_BASE}}"
        ],
        "description": "Creates a React Functional Component with ES7 module system"
    },
    "useCallback": {
        "prefix": "useCallbackSnippet",
        "body": [
            "useCallback(",
            "  () => {",
            "    ${1:first}",
            "  },",
            "  [${2:second}],",
            ")",
            ""
        ]
    },
    "useContext": {
        "prefix": "useContextSnippet",
        "body": ["const ${1:first} = useContext(${2:second})"]
    },
    "useEffect": {
        "prefix": "useEffectSnippet",
        "body": [
            "useEffect(() => {",
            "  ${1:first}",
            "",
            "  return () => {",
            "    ${2:second}",
            "  }",
            "}, [${3:third}])",
            ""
        ]
    },
    "useImperativeHandle": {
        "prefix": "useImperativeHandleSnippet",
        "body": [
            "useImperativeHandle(",
            "  ${1:first},",
            "  () => {",
            "    ${2:second}",
            "  },",
            "  [${3:third}],",
            ")"
        ]
    },
    "useLayoutEffect": {
        "prefix": "useLayoutEffectSnippet",
        "body": [
            "useLayoutEffect(() => {",
            "  ${1:first}",
            "",
            "  return () => {",
            "    ${2:second}",
            "  };",
            "}, [${3:third}])"
        ]
    },
    "useMemo": {
        "prefix": "useMemoSnippet",
        "body": ["useMemo(() => ${1:first}, [${2:second}])"]
    },
    "useReducer": {
        "prefix": "useReducerSnippet",
        "body": [
            "const [state, dispatch] = useReducer(${1:first}, ${2:second}, ${3:third})"
        ]
    },
    "useRef": {
        "prefix": "useRefSnippet",
        "body": ["const ${1:first} = useRef(${2:second})"]
    },
    "useState": {
        "prefix": "useStateSnippet",
        "body": [
            "const [${1:first}, set${1/(.*)/${1:/capitalize}/}] = useState(${2:second})"
        ]
    },
    "importPropTypes": {
        "prefix": "impt",
        "body": ["import PropTypes from 'prop-types'"]
    },
    "importReact": {
        "prefix": "imr",
        "body": ["import React from 'react'"]
    },
    "importReactDom": {
        "prefix": "imrd",
        "body": ["import ReactDOM from 'react-dom'"]
    },
    "importReactWithComponent": {
        "prefix": "imrc",
        "body": ["import React, { Component } from 'react'"]
    },
    "importReactWithComponentAndPropTypes": {
        "prefix": "imrcp",
        "body": [
            "import React, { Component } from 'react'",
            "import PropTypes from 'prop-types'",
            ""
        ]
    },
    "importReactWithMemo": {
        "prefix": "imrm",
        "body": ["import React, { memo } from 'react'"]
    },
    "importReactWithMemoAndPropTypes": {
        "prefix": "imrmp",
        "body": [
            "import React, { memo } from 'react'",
            "import PropTypes from 'prop-types'",
            ""
        ]
    },
    "importReactWithPureComponent": {
        "prefix": "imrpc",
        "body": ["import React, { PureComponent } from 'react'"]
    },
    "importReactWithPureComponentAndPropTypes": {
        "prefix": "imrpcp",
        "body": [
            "import React, { PureComponent } from 'react'",
            "import PropTypes from 'prop-types'",
            ""
        ]
    },
    "importRouterLink": {
        "prefix": "imbrl",
        "body": ["import { Link } from 'react-router-dom'"]
    },
    "importRouterNavLink": {
        "prefix": "imbrnl",
        "body": ["import { NavLink } from 'react-router-dom'"]
    },
    "importRouterSetup": {
        "prefix": "imbrc",
        "body": [
            "import { Route, Switch, NavLink, Link } from 'react-router-dom'"
        ]
    },
    "importRouterSwitch": {
        "prefix": "imbrs",
        "body": ["import { Switch } from 'react-router-dom'"]
    },
    "propTypeArray": {
        "prefix": "pta",
        "body": ["PropTypes.array"],
        "description": "Array prop type"
    },
    "propTypeArrayRequired": {
        "prefix": "ptar",
        "body": ["PropTypes.array.isRequired"],
        "description": "Array prop type required"
    },
    "propTypeBool": {
        "prefix": "ptb",
        "body": ["PropTypes.bool"],
        "description": "Bool prop type"
    },
    "propTypeBoolRequired": {
        "prefix": "ptbr",
        "body": ["PropTypes.bool.isRequired"],
        "description": "Bool prop type required"
    },
    "propTypeFunc": {
        "prefix": "ptf",
        "body": ["PropTypes.func"],
        "description": "Func prop type"
    },
    "propTypeFuncRequired": {
        "prefix": "ptfr",
        "body": ["PropTypes.func.isRequired"],
        "description": "Func prop type required"
    },
    "propTypeNumber": {
        "prefix": "ptn",
        "body": ["PropTypes.number"],
        "description": "Number prop type"
    },
    "propTypeNumberRequired": {
        "prefix": "ptnr",
        "body": ["PropTypes.number.isRequired"],
        "description": "Number prop type required"
    },
    "propTypeObject": {
        "prefix": "pto",
        "body": ["PropTypes.object"],
        "description": "Object prop type"
    },
    "propTypeObjectRequired": {
        "prefix": "ptor",
        "body": ["PropTypes.object.isRequired"],
        "description": "Object prop type required"
    },
    "propTypeString": {
        "prefix": "pts",
        "body": ["PropTypes.string"],
        "description": "String prop type"
    },
    "propTypeStringRequired": {
        "prefix": "ptsr",
        "body": ["PropTypes.string.isRequired"],
        "description": "String prop type required"
    },
    "propTypeNode": {
        "prefix": "ptnd",
        "body": ["PropTypes.node"],
        "description": "Anything that can be rendered: numbers, strings, elements or an array"
    },
    "propTypeNodeRequired": {
        "prefix": "ptndr",
        "body": ["PropTypes.node.isRequired"],
        "description": "Anything that can be rendered: numbers, strings, elements or an array required"
    },
    "propTypeElement": {
        "prefix": "ptel",
        "body": ["PropTypes.element"],
        "description": "React element prop type"
    },
    "propTypeElementRequired": {
        "prefix": "ptelr",
        "body": ["PropTypes.element.isRequired"],
        "description": "React element prop type required"
    },
    "propTypeInstanceOf": {
        "prefix": "pti",
        "body": ["PropTypes.instanceOf($0)"],
        "description": "Is an instance of a class prop type"
    },
    "propTypeInstanceOfRequired": {
        "prefix": "ptir",
        "body": ["PropTypes.instanceOf($0).isRequired"],
        "description": "Is an instance of a class prop type required"
    },
    "propTypeEnum": {
        "prefix": "pte",
        "body": ["PropTypes.oneOf(['$0'])"],
        "description": "Prop type limited to specific values by treating it as an enum"
    },
    "propTypeEnumRequired": {
        "prefix": "pter",
        "body": ["PropTypes.oneOf(['$0']).isRequired"],
        "description": "Prop type limited to specific values by treating it as an enum required"
    },
    "propTypeOneOfType": {
        "prefix": "ptet",
        "body": ["PropTypes.oneOfType([", "  $0", "])"],
        "description": "An object that could be one of many types"
    },
    "propTypeOneOfTypeRequired": {
        "prefix": "ptetr",
        "body": ["PropTypes.oneOfType([", "  $0", "]).isRequired"],
        "description": "An object that could be one of many types required"
    },
    "propTypeArrayOf": {
        "prefix": "ptao",
        "body": ["PropTypes.arrayOf($0)"],
        "description": "An array of a certain type"
    },
    "propTypeArrayOfRequired": {
        "prefix": "ptaor",
        "body": ["PropTypes.arrayOf($0).isRequired"],
        "description": "An array of a certain type required"
    },
    "propTypeObjectOf": {
        "prefix": "ptoo",
        "body": ["PropTypes.objectOf($0)"],
        "description": "An object with property values of a certain type"
    },
    "propTypeObjectOfRequired": {
        "prefix": "ptoor",
        "body": ["PropTypes.objectOf($0).isRequired"],
        "description": "An object with property values of a certain type required"
    },
    "propTypeShape": {
        "prefix": "ptsh",
        "body": ["PropTypes.shape({", "  $0", "})"],
        "description": "An object taking on a particular shape"
    },
    "propTypeShapeRequired": {
        "prefix": "ptshr",
        "body": ["PropTypes.shape({", "  $0", "}).isRequired"],
        "description": "An object taking on a particular shape required"
    },
    "propTypeExact": {
        "prefix": "ptex",
        "body": ["PropTypes.exact({", "  $0", "})"],
        "description": "An object with warnings on extra properties"
    },
    "propTypeExactRequired": {
        "prefix": "ptexr",
        "body": ["PropTypes.exact({", "  $0", "}).isRequired"],
        "description": "An object with warnings on extra properties required"
    },
    "propTypeAny": {
        "prefix": "ptany",
        "body": ["PropTypes.any"],
        "description": "Any prop type"
    },
    "destructProps": {
        "prefix": "cp",
        "body": ["const { ${1:first} } = this.props"],
        "description": "Creates and assigns a local variable using props destructing"
    },
    "destructState": {
        "prefix": "cs",
        "body": ["const { ${1:first} } = this.state"],
        "description": "Creates and assigns a local variable using state destructing"
    },
    "classConstructor": {
        "prefix": "rconst",
        "body": [
            "constructor(props) {",
            "  super(props)",
            "",
            "  this.state = {",
            "     ${1:first}",
            "  }",
            "}"
        ],
        "description": "Adds a default constructor for it('', () => {})the class that contains props as arguments"
    },
    "emptyState": {
        "prefix": "est",
        "body": ["state = { ${1:first} }"],
        "description": "Creates empty state object. To be used in a constructor."
    },
    "componentDidMount": {
        "prefix": "cdm",
        "body": ["componentDidMount() { ${1:first} }"],
        "description": "Invoked once, only on the client (not on the server), immediately after the initial rendering occurs."
    },
    "shouldComponentUpdate": {
        "prefix": "scu",
        "body": ["shouldComponentUpdate(nextProps, nextState) { ${1:first} }"],
        "description": "Invoked before rendering when new props or state are being received. "
    },
    "componentDidUpdate": {
        "prefix": "cdup",
        "body": ["componentDidUpdate(prevProps, prevState) { ${1:first}} "],
        "description": "Invoked immediately after the component's updates are flushed to the DOM."
    },
    "componentWillUnmount": {
        "prefix": "cwun",
        "body": ["componentWillUnmount() {${1:first} }"],
        "description": "Invoked immediately before a component is unmounted from the DOM."
    },
    "getDerivedStateFromProps": {
        "prefix": "gdsfp",
        "body": ["static getDerivedStateFromProps(props, state) {${1:first}}"],
        "description": "Invoked right before calling the render method, both on the initial mount and on subsequent updates."
    },
    "getSnapshotBeforeUpdate": {
        "prefix": "gsbu",
        "body": [
            "getSnapshotBeforeUpdate = (prevProps, prevState) => {${1:first}}"
        ],
        "description": "Called right before mutations are made (e.g. before the DOM is updated)"
    },
    "createContext": {
        "prefix": "rcontext",
        "body": ["const ${1:first} = React.createContext()"],
        "description": "Create React context"
    },
    "createRef": {
        "prefix": "cref",
        "body": ["this.${1:first}Ref = React.createRef()"],
        "description": "Create ref statement used inside constructor"
    },
    "componentSetStateObject": {
        "prefix": "sst",
        "body": ["this.setState({${1:first}})"],
        "description": "Performs a shallow merge of nextState into current state"
    },
    "componentSetStateFunc": {
        "prefix": "ssf",
        "body": ["this.setState((state, props) => { return { ${1:first} }})"],
        "description": "Performs a shallow merge of nextState into current state"
    },
    "componentProps": {
        "prefix": "props",
        "body": ["this.props.${1:first}"],
        "description": "Access component's props"
    },
    "componentState": {
        "prefix": "state",
        "body": ["this.state.${1:first}"]
    },
    "bindThis": {
        "prefix": "bnd",
        "body": ["this.${1:first} = this.${1:first}.bind(this)"],
        "description": "Binds this to a method"
    }
}