feat: add new version tag (#5513)

demo/store/menu-options.js

@@ -2,6 +2,7 @@
 
 import { h } from 'vue'
 import { RouterLink } from 'vue-router'
+import { NTag, NSpace } from 'naive-ui'
 
 export const renderMenuLabel = (option) => {
   if (!('path' in option) || option.label === '--Debug') {
@@ -16,6 +17,20 @@ export const renderMenuLabel = (option) => {
   )
 }
 
+const renderNewTag = () =>
+  h(NTag, { type: 'success', size: 'small' }, { default: () => 'New' })
+
+const renderItemExtra = (rawItem, isZh) => {
+  if (!rawItem.enSuffix || !isZh) { return rawItem.isNew ? renderNewTag : undefined }
+  const renderEn = () =>
+    h(
+      NSpace,
+      { inline: true, size: 6 },
+      { default: () => [rawItem.en, renderNewTag()] }
+    )
+  return rawItem.isNew ? renderEn : rawItem.en
+}
+
 const appendCounts = (item) => {
   if (!item.children) {
     item.count = 1
@@ -40,7 +55,7 @@ function createItems (lang, theme, prefix, items) {
       ...rawItem,
       key: rawItem.en,
       label: rawItem[langKey] || rawItem.en,
-      extra: rawItem.enSuffix && isZh ? rawItem.en : undefined,
+      extra: renderItemExtra(rawItem, isZh),
       path: rawItem.path
         ? `/${lang}/${theme}` + prefix + rawItem.path
         : undefined
@@ -465,7 +480,8 @@ export function createComponentMenuOptions ({ lang, theme, mode }) {
           en: 'QR Code',
           zh: '二维码',
           enSuffix: true,
-          path: '/qr-code'
+          path: '/qr-code',
+          isNew: true
         },
         {
           en: 'Statistic',
@@ -696,7 +712,8 @@ export function createComponentMenuOptions ({ lang, theme, mode }) {
           en: 'Split',
           zh: '面板分割',
           enSuffix: true,
-          path: '/split'
+          path: '/split',
+          isNew: true
         }
       ]
     }),
@@ -727,7 +744,8 @@ export function createComponentMenuOptions ({ lang, theme, mode }) {
           en: 'Virtual List',
           zh: '虚拟列表',
           enSuffix: true,
-          path: '/virtual-list'
+          path: '/virtual-list',
+          isNew: true
         }
       ]
     }),

src/qr-code/demos/enUS/index.demo-entry.md

@@ -1,6 +1,6 @@
 # QR Code
 
-It is always only valid for a short time.
+It is always only valid for a short time. Available since `2.36.0`.
 
 ## Demos
 

src/qr-code/demos/zhCN/index.demo-entry.md

@@ -1,6 +1,6 @@
 # 二维码 QR Code
 
-总是即将过期。
+总是即将过期。`2.36.0` 版本开始提供该组件。
 
 ## 演示
 

src/split/demos/enUS/index.demo-entry.md

@@ -1,6 +1,6 @@
 # Split
 
-The flexible layout tool provides the possibility of customizing the interface layout.
+The flexible layout tool provides the possibility of customizing the interface layout. Available since `2.36.0`.
 
 ## Demos
 

src/split/demos/zhCN/index.demo-entry.md

@@ -1,6 +1,6 @@
 # 面板分割 Split
 
-灵活的布局工具，提供了用户自定义界面布局的可能性。
+灵活的布局工具，提供了用户自定义界面布局的可能性。`2.36.0` 版本开始提供该组件。
 
 ## 演示
 

src/virtual-list/demos/enUS/index.demo-entry.md

@@ -4,6 +4,8 @@ When it comes to virtual lists, it can feel like a list is infinitely long, but
 
 It's like a lazy programmer holding up a blank note and saying, "You can't see me, and I can't load myself!"
 
+Available since `2.36.0`.
+
 ## Demos
 
 ```demo

src/virtual-list/demos/zhCN/index.demo-entry.md

@@ -4,6 +4,8 @@
 
 就像是个懒惰的程序员拿着一个空白纸条说：“你看不见我，我也不会加载自己！”
 
+`2.36.0` 版本开始提供该组件。
+
 ## 演示
 
 ```demo