From 10b09237afd1a0919d909372702488b5f68d0e58 Mon Sep 17 00:00:00 2001
From: moh1434 <moh1434.ma@gmail.com>
Date: Wed, 22 Feb 2023 21:01:36 +0300
Subject: [PATCH 1/2] style:just add whitespace

---
 README.md | 32 ++++++++++++++++----------------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/README.md b/README.md
index f440a8f..9109f1e 100644
--- a/README.md
+++ b/README.md
@@ -32,22 +32,22 @@ You can enable tab completion (recommended) by opening `Code > Preferences > Set
 
 ### Vue
 
-| Snippet            | Purpose                                                      |
-| ------------------ | ------------------------------------------------------------ |
-| `vbase`            | Single file component base with SCSS                         |
-| `vbase-3`          | Single File component Composition API with SCSS              |
-| `vbase-3-setup`    | Single File component setup Composition API with SCSS        |
-| `vbase-3-reactive` | Single File component Composition API with Reactive and SCSS |
-| `vbase-css`        | Single file component base with CSS                          |
-| `vbase-pcss`       | Single file component base with PostCSS                      |
-| `vbase-styl`       | Single file component base with Stylus                       |
-| `vbase-ts`         | Single file component base with Typescript                   |
-| `vbase-ts-class`   | Single file component base with Typescript Class Format      |
-| `vbase-3-ts`       | Single File component Composition API with Typescript        |
-| `vbase-3-ts-setup` | Single File component setup Composition API with Typescript  |
-| `vbase-ns`         | Single file component with no styles                         |
-| `vbase-sass`       | Single file component base with SASS                         |
-| `vbase-less`       | Single file component base with LESS                         |
+| Snippet                        | Purpose                                                                       |
+| ------------------------------ | ----------------------------------------------------------------------------- |
+| `vbase`                        | Single file component base with SCSS                                          |
+| `vbase-3`                      | Single File component Composition API with SCSS                               |
+| `vbase-3-setup`                | Single File component setup Composition API with SCSS                         |
+| `vbase-3-reactive`             | Single File component Composition API with Reactive and SCSS                  |
+| `vbase-css`                    | Single file component base with CSS                                           |
+| `vbase-pcss`                   | Single file component base with PostCSS                                       |
+| `vbase-styl`                   | Single file component base with Stylus                                        |
+| `vbase-ts`                     | Single file component base with Typescript                                    |
+| `vbase-ts-class`               | Single file component base with Typescript Class Format                       |
+| `vbase-3-ts`                   | Single File component Composition API with Typescript                         |
+| `vbase-3-ts-setup`             | Single File component setup Composition API with Typescript                   |
+| `vbase-ns`                     | Single file component with no styles                                          |
+| `vbase-sass`                   | Single file component base with SASS                                          |
+| `vbase-less`                   | Single file component base with LESS                                          |
 
 ### Template
 

From 374d6c62839391ac6850f464c6754553fe8a0b98 Mon Sep 17 00:00:00 2001
From: moh1434 <moh1434.ma@gmail.com>
Date: Wed, 22 Feb 2023 21:02:14 +0300
Subject: [PATCH 2/2] feat: add vbase-3-ts-setup-props-emits

---
 README.md         |  1 +
 snippets/vue.json | 37 ++++++++++++++++++++++++++++++++++++-
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 9109f1e..77a5bd2 100644
--- a/README.md
+++ b/README.md
@@ -45,6 +45,7 @@ You can enable tab completion (recommended) by opening `Code > Preferences > Set
 | `vbase-ts-class`               | Single file component base with Typescript Class Format                       |
 | `vbase-3-ts`                   | Single File component Composition API with Typescript                         |
 | `vbase-3-ts-setup`             | Single File component setup Composition API with Typescript                   |
+| `vbase-3-ts-setup-props-emits` | Single File Component Setup Composition API with Typescript, props, and emits |
 | `vbase-ns`                     | Single file component with no styles                                          |
 | `vbase-sass`                   | Single file component base with SASS                                          |
 | `vbase-less`                   | Single file component base with LESS                                          |
diff --git a/snippets/vue.json b/snippets/vue.json
index 578866c..798caf9 100644
--- a/snippets/vue.json
+++ b/snippets/vue.json
@@ -285,6 +285,41 @@
     ],
     "description": "Base for Vue File Setup Composition API - Typescript"
   },
+  "Vue Single File Component Setup Composition API with Typescript, props, and emits": {
+    "prefix": "vbase-3-ts-setup-props-emits",
+    "body": [
+      "<template>",
+      "\t<div>",
+      "",
+      "\t</div>",
+      "</template>",
+      "",
+      "<script setup lang=\"ts\">",
+      "export interface Props {",
+      "\tuser?: string",
+      "}",
+      "const props = withDefaults(defineProps<Props>(), {",
+      "\tuser: 'foo'",
+      "})",
+      "",
+      "const emits = defineEmits<{",
+      "\t(e: 'update:user', newValue: string): void",
+      "}>()",
+      "const onClick = () => emits('update:user', 'bar');",
+      "",
+      "//in parent component:",
+      "//\tv-model:user=\"userParentVariable\"",
+      "//OR:",
+      "//\t:user=\"userParentVariable\" @update:user=\"userParentVariable = $event\"",
+      "",
+      "</script>",
+      "",
+      "<style scoped>",
+      "",
+      "</style>"
+    ],
+    "description": "Base for Vue File Setup Composition API - Typescript with defineProps & defineEmits"
+  },
   "Vue Single File Component with Class based Typescript format": {
     "prefix": "vbase-ts-class",
     "body": [
@@ -309,4 +344,4 @@
     ],
     "description": "Base for Vue File with Class based Typescript format"
   }
-}
+}
\ No newline at end of file