Merge remote-tracking branch 'refs/remotes/origin/main'

Conflicts:
	.vitepress/theme/components/VueMasteryBanner.vue
	.vitepress/theme/index.ts

Author: pieer

.vitepress/config.ts

@@ -401,7 +401,7 @@ export const sidebar = {
       ]
     },
     {
-      text: 'Single File Component',
+      text: 'Single-File Component',
       items: [
         { text: 'Syntax Specification', link: '/api/sfc-spec' },
         { text: '<script setup>', link: '/api/sfc-script-setup' },

.vitepress/theme/components/VueMasteryBanner.vue

@@ -24,7 +24,7 @@ const isVisible = ref(false)
 
 onMounted(() => {
   const now = new Date()
-  const end = new Date('2022-07-24T00:00:00+02:00')
+  const end = new Date('2022-07-25T00:00:00+02:00')
   isVisible.value = !localStorage.getItem('VM_FW_22_OFFER') && (now < end)
   if (isVisible.value) document.body.classList.add('has-top-banner')
 })

.vitepress/theme/index.ts

@@ -3,14 +3,14 @@ import { h, App } from 'vue'
 import { VPTheme } from '@vue/theme'
 import PreferenceSwitch from './components/PreferenceSwitch.vue'
 import VueMasteryBanner from './components/VueMasteryBanner.vue'
-import VueSchoolLink from './components/VueSchoolLink.vue'
 import {
   preferComposition,
   preferSFC,
   filterHeadersByPreference
 } from './components/preferences'
 import SponsorsAside from './components/SponsorsAside.vue'
 import VueJobs from './components/VueJobs.vue'
+import VueSchoolLink from './components/VueSchoolLink.vue'
 
 export default Object.assign({}, VPTheme, {
   Layout: () => {

package.json

@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@vue/repl": "^1.2.4",
-    "@vue/theme": "^1.0.2",
+    "@vue/theme": "^1.0.4",
     "dynamics.js": "^1.1.5",
     "gsap": "^3.9.0",
     "vitepress": "^0.22.4",

pnpm-lock.yaml

@@ -1,6 +1,6 @@
 # \<script setup>
 
-`<script setup>` is a compile-time syntactic sugar for using Composition API inside Single File Components (SFCs). It is the recommended syntax if you are using both SFCs and Composition API. It provides a number of advantages over the normal `<script>` syntax:
+`<script setup>` is a compile-time syntactic sugar for using Composition API inside Single-File Components (SFCs). It is the recommended syntax if you are using both SFCs and Composition API. It provides a number of advantages over the normal `<script>` syntax:
 
 - More succinct code with less boilerplate
 - Ability to declare props and emitted events using pure TypeScript

src/api/sfc-script-setup.md

@@ -74,7 +74,7 @@ In addition, `v-model` can be used on inputs of different types, `<textarea>`, a
 
 <span id="vmodel-ime-tip"></span>
 ::: tip Note
-For languages that require an [IME](https://en.wikipedia.org/wiki/Input_method) (Chinese, Japanese, Korean etc.), you'll notice that `v-model` doesn't get updated during IME composition. If you want to respond to these updates as well, use an `input` event listener and `value` binding instead of using `v-model`.
+For languages that require an [IME](https://en.wikipedia.org/wiki/Input_method) (Chinese, Japanese, Korean etc.), you'll notice that `v-model` doesn't get updated during IME composition. If you want to respond to these updates as well, use your own `input` event listener and `value` binding instead of using `v-model`.
 :::
 
 ### Multiline text

src/guide/essentials/forms.md

@@ -317,7 +317,7 @@ Check out [this example of a simple todo list](https://sfc.vuejs.org/#eyJBcHAudn
 
 ### Mutation Methods
 
-Vue is able to detect when an reactive array's mutation methods are called and trigger necessary updates. These mutation methods are:
+Vue is able to detect when a reactive array's mutation methods are called and trigger necessary updates. These mutation methods are:
 
 - `push()`
 - `pop()`

src/guide/essentials/list.md

@@ -2,7 +2,7 @@
 
 <div class="sfc">
 
-What you see in the editor is a Vue Single File Component (SFC). An SFC is a reusable self-contained block of code that encapsulates HTML, CSS and JavaScript that belong together, written inside a `.vue` file.
+What you see in the editor is a Vue Single-File Component (SFC). An SFC is a reusable self-contained block of code that encapsulates HTML, CSS and JavaScript that belong together, written inside a `.vue` file.
 
 </div>