Merge branch 'upstream' into sync

.gitignore

@@ -15,7 +15,6 @@
 .Trashes
 .VolumeIcon.icns
 .com.apple.timemachine.donotpresent
-.idea
 
 # Directories potentially created on remote AFP share
 .AppleDB
@@ -112,5 +111,5 @@ src/examples/data.json
 src/tutorial/data.json
 draft.md
 
-# IDEs
+# folders created by IDE
 .idea

.npmrc

@@ -0,0 +1 @@
+package-manager-strict=false

.prettierignore

@@ -0,0 +1 @@
+*.vue

.vitepress/config.ts

@@ -45,6 +45,7 @@ const nav: ThemeConfig['nav'] = [
         text: '資源',
         items: [
           { text: '合作伙伴', link: '/partners/' },
+          { text: 'Developers', link: '/developers/' },
           { text: '主題', link: '/ecosystem/themes' },
           { text: 'UI 組件', link: 'https://ui-libs.vercel.app/' },
           {
@@ -125,9 +126,13 @@ const nav: ThemeConfig['nav'] = [
     link: '/sponsor/'
   },
   {
-    text: '合作伙伴',
-    link: '/partners/',
-    activeMatch: `^/partners/`
+    text: 'Experts',
+    badge: { text: 'NEW' },
+    activeMatch: `^/(partners|developers)/`,
+    items: [
+      { text: 'Partners', link: '/partners/' },
+      { text: 'Developers', link: '/developers/', badge: { text: 'NEW' } }
+    ]
   }
 ]
 
@@ -368,6 +373,10 @@ export const sidebar: ThemeConfig['sidebar'] = {
         {
           text: '依賴注入',
           link: '/api/composition-api-dependency-injection'
+        },
+        {
+          text: 'Helpers',
+          link: '/api/composition-api-helpers'
         }
       ]
     },
@@ -417,6 +426,7 @@ export const sidebar: ThemeConfig['sidebar'] = {
     {
       text: '進階 API',
       items: [
+        { text: 'Custom Elements', link: '/api/custom-elements' },
         { text: '渲染函數', link: '/api/render-function' },
         { text: '服務端渲染', link: '/api/ssr' },
         { text: 'TypeScript 工具類型', link: '/api/utility-types' },
@@ -593,7 +603,15 @@ const i18n: ThemeConfig['i18n'] = {
 export default defineConfigWithTheme<ThemeConfig>({
   extends: baseConfig,
 
-  lang: 'zh-CN',
+  sitemap: {
+    hostname: 'https://vuejs.org'
+  },
+
+  sitemap: {
+    hostname: 'https://vuejs.org'
+  },
+
+  lang: 'zh-HK',
   title: 'Vue.js',
   description: 'Vue.js - 漸進式的 JavaScript 框架',
   srcDir: 'src',
@@ -635,6 +653,14 @@ export default defineConfigWithTheme<ThemeConfig>({
         'utf-8'
       )
     ],
+    [
+      'script',
+      {},
+      fs.readFileSync(
+        path.resolve(__dirname, './inlined-scripts/uwu.js'),
+        'utf-8'
+      )
+    ],
     [
       'script',
       {
@@ -719,6 +745,11 @@ export default defineConfigWithTheme<ThemeConfig>({
         text: 'Čeština',
         repo: 'https://github.com/vuejs-translations/docs-cs'
       },
+      {
+        link: 'https://zh-hk.vuejs.org',
+        text: '繁體中文',
+        repo: 'https://github.com/vuejs-translations/docs-zh-hk'
+      },
       {
         link: '/translations/',
         text: '幫助我們翻譯！',
@@ -827,7 +858,6 @@ export default defineConfigWithTheme<ThemeConfig>({
       }
     },
     build: {
-      minify: 'terser',
       chunkSizeWarningLimit: Infinity
     },
     json: {

.vitepress/inlined-scripts/restorePreference.js

@@ -8,6 +8,6 @@
   restore('vue-docs-prefer-composition', 'prefer-composition', true)
   restore('vue-docs-prefer-sfc', 'prefer-sfc', true)
 
-  window.__VUE_BANNER_ID__ = 'vueconfus2024'
-  restore(`vue-docs-banner-${__VUE_BANNER_ID__}`, 'banner-dismissed')
+  // window.__VUE_BANNER_ID__ = ''
+  // restore(`vue-docs-banner-${__VUE_BANNER_ID__}`, 'banner-dismissed')
 })()

.vitepress/inlined-scripts/uwu.js

@@ -0,0 +1,3 @@
+if (location.search.includes('?uwu')) {
+  document.documentElement.classList.add('uwu')
+}

.vitepress/theme/components/Banner.vue

@@ -22,30 +22,16 @@ function dismiss() {
 
 <template>
   <div class="banner" v-if="open">
-    <p class="vt-banner-text">
-      <span class="vt-text-primary">VueConf US</span>
-      <span class="vt-tagline"> - Join the official Vue.js conference</span>
-      | May 15-17, 2024 <span class="vt-place"> - New Orleans, USA</span>
-      <a
-        target="_blank"
-        class="vt-primary-action"
-        href="https://vueconf.us?utm_source=vuejs&utm_content=top_banner"
-      >Register <span class="vt-time-now">Now</span></a
-      >
-    </p>
+    <a target="_blank"></a>
     <button @click="dismiss">
       <VTIconPlus class="close" />
     </button>
-    <p class="vt-banner-text vt-coupon">
-      <span class="vt-text-primary">Use code</span> VUEJSDOCS
-      <span class="vt-text-primary">to get $100 off!</span>
-    </p>
   </div>
 </template>
 
 <style>
 html:not(.banner-dismissed) {
-  --vt-banner-height: 60px;
+  --vt-banner-height: 30px;
 }
 </style>
 
@@ -64,10 +50,12 @@ html:not(.banner-dismissed) {
   font-weight: 600;
   color: #fff;
   background-color: var(--vt-c-green);
-  background: #11252b;
-  display: flex;
-  justify-content: center;
-  align-items: center;
+  background: linear-gradient(
+    90deg,
+    rgba(66, 184, 131, 1) 0%,
+    rgba(39, 179, 137, 1) 19%,
+    rgba(100, 126, 255, 1) 100%
+  );
 }
 
 .banner-dismissed .banner {
@@ -82,7 +70,7 @@ button {
   position: absolute;
   right: 0;
   top: 0;
-  padding: 20px 10px;
+  padding: 5px;
 }
 
 .close {
@@ -91,59 +79,10 @@ button {
   fill: #fff;
   transform: rotate(45deg);
 }
-
-.vt-banner-text {
-  color: #fff;
-  font-size: 16px;
-}
-
-.vt-text-primary {
-  color: #75c05e;
-}
-
-.vt-primary-action {
-  background: #75c05e;
-  color: #121c1a;
-  padding: 8px 15px;
-  border-radius: 5px;
-  font-size: 14px;
-  text-decoration: none;
-  margin: 0 20px;
-  font-weight: bold;
-}
-.vt-primary-action:hover {
-  text-decoration: none;
-  background: #5a9f45;
-}
-
-@media (max-width: 1280px) {
-  .banner .vt-banner-text {
-    font-size: 14px;
-  }
-  .vt-tagline {
-    display: none;
-  }
-}
-
-@media (max-width: 780px) {
-  .vt-tagline {
-    display: none;
-  }
-  .vt-coupon {
-    display: none;
-  }
-  .vt-primary-action {
-    margin: 0 10px;
-    padding: 7px 10px;
-  }
-  .vt-time-now {
-    display: none;
-  }
-}
-
-@media (max-width: 560px) {
-  .vt-place {
+/*
+@media (max-width: 720px) {
+  a > span {
     display: none;
   }
-}
+} */
 </style>

.vitepress/theme/components/CallToActionSection.vue

@@ -0,0 +1,73 @@
+<script setup lang="ts">
+withDefaults(defineProps<{
+  title?: string
+  description?: string
+  link?: string
+  linkText?: string
+  showDivider?: boolean
+}>(), {
+  showDivider: true
+})
+</script>
+
+<template>
+  <section class="cta-section">
+    <div v-if="showDivider" class="cta-divider"></div>
+    <div class="cta-content">
+      <h2 v-if="title" class="cta-title">{{ title }}</h2>
+      <p v-if="description" class="cta-description">{{ description }}</p>
+      <a v-if="link" :href="link" target="_blank" class="cta-link">{{ linkText }}</a>
+      <slot></slot>
+    </div>
+  </section>
+</template>
+
+<style scoped>
+.cta-section {
+  text-align: center;
+  max-width: 688px;
+  margin: 0 auto;
+}
+
+.cta-divider {
+  width: 100px;
+  margin: 0 auto;
+  border-top: 1px solid var(--vt-c-divider-light);
+}
+
+.cta-content {
+  padding: 28px 28px 96px;
+}
+
+.cta-title {
+  font-size: 34px;
+  font-weight: 600;
+  letter-spacing: -0.5px;
+  line-height: 1.2;
+  margin: 0.5em 0 1em;
+}
+
+.cta-description {
+  color: var(--vt-c-text-2);
+}
+
+.cta-link {
+  margin-top: 2em;
+  display: inline-block;
+  padding: 12px 24px;
+  background-color: var(--vt-c-bg-mute);
+  color: var(--vt-c-text-code);
+  font-weight: 600;
+  border-radius: 6px;
+  text-decoration: none;
+  transition: background-color 0.5s, color 0.5s;
+}
+
+.cta-link:hover {
+  background-color: var(--vt-c-gray-light-4);
+}
+
+.dark .cta-link:hover {
+  background-color: var(--vt-c-gray-dark-3);
+}
+</style>