From 33a612c770d985f37e086a6537a173b805daca52 Mon Sep 17 00:00:00 2001
From: jahnli <jahnli@163.com>
Date: Fri, 29 Dec 2023 10:30:17 +0800
Subject: [PATCH] feat: add new version tag (#5513)

---
 demo/store/menu-options.js                    | 26 ++++++++++++++++---
 src/qr-code/demos/enUS/index.demo-entry.md    |  2 +-
 src/qr-code/demos/zhCN/index.demo-entry.md    |  2 +-
 src/split/demos/enUS/index.demo-entry.md      |  2 +-
 src/split/demos/zhCN/index.demo-entry.md      |  2 +-
 .../demos/enUS/index.demo-entry.md            |  2 ++
 .../demos/zhCN/index.demo-entry.md            |  2 ++
 7 files changed, 30 insertions(+), 8 deletions(-)

diff --git a/demo/store/menu-options.js b/demo/store/menu-options.js
index c1bd11523fd..578c4617af0 100644
--- a/demo/store/menu-options.js
+++ b/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
         }
       ]
     }),
diff --git a/src/qr-code/demos/enUS/index.demo-entry.md b/src/qr-code/demos/enUS/index.demo-entry.md
index 4f16b782628..3b2ad87b404 100644
--- a/src/qr-code/demos/enUS/index.demo-entry.md
+++ b/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
 
diff --git a/src/qr-code/demos/zhCN/index.demo-entry.md b/src/qr-code/demos/zhCN/index.demo-entry.md
index c33c4f899bc..25814b3fcc4 100644
--- a/src/qr-code/demos/zhCN/index.demo-entry.md
+++ b/src/qr-code/demos/zhCN/index.demo-entry.md
@@ -1,6 +1,6 @@
 # 二维码 QR Code
 
-总是即将过期。
+总是即将过期。`2.36.0` 版本开始提供该组件。
 
 ## 演示
 
diff --git a/src/split/demos/enUS/index.demo-entry.md b/src/split/demos/enUS/index.demo-entry.md
index 9299ac5ad62..827c4c4766e 100644
--- a/src/split/demos/enUS/index.demo-entry.md
+++ b/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
 
diff --git a/src/split/demos/zhCN/index.demo-entry.md b/src/split/demos/zhCN/index.demo-entry.md
index 8cdfeef64ab..89c64aa2de8 100644
--- a/src/split/demos/zhCN/index.demo-entry.md
+++ b/src/split/demos/zhCN/index.demo-entry.md
@@ -1,6 +1,6 @@
 # 面板分割 Split
 
-灵活的布局工具，提供了用户自定义界面布局的可能性。
+灵活的布局工具，提供了用户自定义界面布局的可能性。`2.36.0` 版本开始提供该组件。
 
 ## 演示
 
diff --git a/src/virtual-list/demos/enUS/index.demo-entry.md b/src/virtual-list/demos/enUS/index.demo-entry.md
index 9e3d1598f9d..fbdcc700da2 100644
--- a/src/virtual-list/demos/enUS/index.demo-entry.md
+++ b/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
diff --git a/src/virtual-list/demos/zhCN/index.demo-entry.md b/src/virtual-list/demos/zhCN/index.demo-entry.md
index 3073417203d..03e6fb12ae3 100644
--- a/src/virtual-list/demos/zhCN/index.demo-entry.md
+++ b/src/virtual-list/demos/zhCN/index.demo-entry.md
@@ -4,6 +4,8 @@
 
 就像是个懒惰的程序员拿着一个空白纸条说：“你看不见我，我也不会加载自己！”
 
+`2.36.0` 版本开始提供该组件。
+
 ## 演示
 
 ```demo