feat: Improve create Emotion component snippets

Author: mskelton

snippets/js.json

@@ -1,10 +1,15 @@
 {
-  "Create Emotion Component": {
+  "Create Emotion component": {
     "prefix": "cec",
     "body": [
-      "/** @jsx jsx **/",
-      "import { jsx } from '@emotion/core'\n",
-      "function ${1:Component}(props) {\n\t$2\n}\n"
+      "/** @jsx jsx */",
+      "import { jsx } from '@emotion/core';",
+      "",
+      "function ${TM_FILENAME_BASE/(^|-)([A-z0-9])/${2:/upcase}/g}({ $1 }) {",
+      "  return (",
+      "    $0",
+      "  )",
+      "}"
     ],
     "description": "Create Emotion component"
   }

snippets/ts.json

@@ -1,11 +1,19 @@
 {
-  "Create Emotion Component": {
+  "Create Emotion component": {
     "prefix": "cec",
     "body": [
-      "/** @jsx jsx **/",
-      "import { jsx } from '@emotion/core';\n",
-      "interface Props {\n\n}\n",
-      "function ${1:Component}({}: Props) {\n\t$2\n}\n"
+      "/** @jsx jsx */",
+      "import { jsx } from '@emotion/core';",
+      "",
+      "type Props = {",
+      "  ",
+      "}",
+      "",
+      "function ${TM_FILENAME_BASE/(^|-)([A-z0-9])/${2:/upcase}/g}({ $1 }: Props) {",
+      "  return (",
+      "    $0",
+      "  )",
+      "}"
     ],
     "description": "Create Emotion component"
   }