Function component

README.md

@@ -30,12 +30,13 @@ To set a key binding, go to "Preferences: Key Bindings - User" from the Command
 | -------: | ------- |
 | `rcc→`   | class component skeleton |
 | `rcc→`   | legacy component skeleton |
+| `rfc→`   | function component skeleton |
 | `cdm→`   | `componentDidMount() {…}` |
 | `cdup→`  | `componentDidUpdate(prevProps, prevState) {…}` |
-| `cwm→`   | `componentWillMount() {…}` |
-| `cwr→`   | `componentWillReceiveProps(nextProps) {…}` |
+| `cwm→`   | `UNSAFE_componentWillMount() {…}` |
+| `cwr→`   | `UNSAFE_componentWillReceiveProps(nextProps) {…}` |
 | `cwun→`  | `componentWillUnmount() {…}` |
-| `cwup→`  | `componentWillUpdate(nextProps, nextState) {…}` |
+| `cwup→`  | `UNSAFE_componentWillUpdate(nextProps, nextState) {…}` |
 | `fdn→`   | `React.findDOMNode(…)` |
 | `gdp→`   | `getDefaultProps() {…}` |
 | `gis→`   | `getInitialState() {…}` |

react_componentWillMount.sublime-snippet

@@ -1,6 +1,6 @@
 <snippet>
     <content><![CDATA[
-componentWillMount() {
+${1:UNSAFE_}componentWillMount() {
 	${0}
 },
 ]]></content>

react_componentWillMount_(class).sublime-snippet

@@ -1,6 +1,6 @@
 <snippet>
     <content><![CDATA[
-componentWillMount() {
+${1:UNSAFE_}componentWillMount() {
 	${0}
 }
 ]]></content>

react_componentWillReceiveProps.sublime-snippet

@@ -1,6 +1,6 @@
 <snippet>
     <content><![CDATA[
-componentWillReceiveProps(nextProps) {
+${1:UNSAFE_}componentWillReceiveProps(nextProps) {
 	${0}
 },
 ]]></content>

react_componentWillReceiveProps_(class).sublime-snippet

@@ -1,6 +1,6 @@
 <snippet>
     <content><![CDATA[
-componentWillReceiveProps(nextProps) {
+${1:UNSAFE_}componentWillReceiveProps(nextProps) {
 	${0}
 }
 ]]></content>

react_componentWillUpdate.sublime-snippet

@@ -1,6 +1,6 @@
 <snippet>
     <content><![CDATA[
-componentWillUpdate(nextProps, nextState) {
+${1:UNSAFE_}componentWillUpdate(nextProps, nextState) {
 	${0}
 },
 ]]></content>

react_componentWillUpdate_(class).sublime-snippet

@@ -1,6 +1,6 @@
 <snippet>
     <content><![CDATA[
-componentWillUpdate(nextProps, nextState) {
+${1:UNSAFE_}componentWillUpdate(nextProps, nextState) {
 	${0}
 }
 ]]></content>

react_component_function.sublime-snippet

@@ -0,0 +1,15 @@
+<snippet>
+    <content><![CDATA[
+import React from 'react';
+
+export default function ${1:${TM_FILENAME/(.+)\..+|.*/$1/:ComponentName}}(${2:props}) {
+  return (
+    ${3:<div>${0}</div>}
+  )
+}
+
+]]></content>
+    <tabTrigger>rfc</tabTrigger>
+    <scope>source.js -(meta)</scope>
+    <description>React: functional component</description>
+</snippet>