u

code/base-project/base-vue/package.json

@@ -13,6 +13,7 @@
     "@floating-ui/vue": "^1.1.9",
     "@iconify/vue": "5.0.0",
     "naive-ui": "^2.42.0",
+    "tdesign-vue-next": "^1.16.1",
     "vue": "^3.5.18"
   },
   "devDependencies": {

code/base-project/base-vue/packages/ao-design/src/_styles/theme/index.scss

@@ -1,7 +1,4 @@
 @use './_light' as *;
 @use './_dark' as *;
-@use './_radius' as *;
-@use './_font' as *;
-@use './_size' as *;
 
 

code/base-project/base-vue/packages/ao-design/src/_utils/getPrefixCls.ts

@@ -1,14 +1,18 @@
 import type { ConfigProviderContext } from '../_config/context'
-import { inject } from 'vue'
+import { getCurrentInstance, inject } from 'vue'
 import { configProviderInjectionKey } from '../_config/context'
 
 const DEFAULT_PREFIX = 'ao'
 
 export function getPrefixCls(componentName?: string): string {
-  const configProvider: ConfigProviderContext | undefined
+  let prefix = DEFAULT_PREFIX
-    = inject(configProviderInjectionKey, undefined)
 
-  const prefix = configProvider?.prefixCls ?? DEFAULT_PREFIX
+  // 仅在 setup 或函数式组件中可以调用 inject
+  const instance = getCurrentInstance()
+  if (instance) {
+    const configProvider: ConfigProviderContext | undefined = inject(configProviderInjectionKey, undefined)
+    prefix = configProvider?.prefixCls ?? DEFAULT_PREFIX
+  }
 
   return componentName ? `${prefix}-${componentName}` : prefix
 }

code/base-project/base-vue/packages/ao-design/src/tag-group/index.tsx

@@ -1,5 +1,5 @@
 import type { PropType, VNode } from 'vue'
-import { cloneVNode, defineComponent, ref } from 'vue'
+import { cloneVNode, defineComponent, ref, watch } from 'vue'
 import { getPrefixCls } from '../_utils/getPrefixCls'
 import Tag from '../tag/index'
 
@@ -13,60 +13,100 @@ export default defineComponent({
       default: () => [],
     },
     checkedProps: {
-      type: Object as PropType<{
+      type: Object as PropType<{ type?: 'solid' | 'light' | 'outline' | 'outline-light', status?: 'primary' | 'danger' | 'warning' | 'success' | 'default' }>,
-        type?: string
-        status?: string
-      }>,
       default: () => ({
         type: 'solid',
         status: 'primary',
       }),
     },
     uncheckedProps: {
-      type: Object as PropType<{
+      type: Object as PropType<{ type?: 'solid' | 'light' | 'outline' | 'outline-light', status?: 'primary' | 'danger' | 'warning' | 'success' | 'default' }>,
-        type?: string
-        status?: string
-      }>,
       default: () => ({
         type: 'solid',
         status: 'default',
       }),
     },
-    class: {
+    class: { type: [String, Array, Object], default: '' },
-      type: [String, Array, Object],
+    style: { type: Object, default: () => ({}) },
-      default: '',
   },
-    style: {
+  emits: ['update:modelValue', 'change'],
-      type: Object,
+  setup(props, { slots, emit }) {
-      default: () => ({}),
-    },
-  },
-  emits: [],
-  setup(props, { slots }) {
     const prefixCls = getPrefixCls('tag-group')
-    const selectedValues = ref([...props.modelValue])
+    const selectedValues = ref<(string | number)[]>([...props.modelValue])
 
+    // 外部 v-model 更新时同步内部值
+    watch(
+      () => props.modelValue,
+      (val) => {
+        selectedValues.value = [...val]
+      },
+    )
+
+    const updateValue = (value: string | number, checked: boolean) => {
+      let newValues = [...selectedValues.value]
+
+      if (props.multiple) {
+        if (checked) {
+          if (!newValues.includes(value))
+            newValues.push(value)
+        }
+        else {
+          newValues = newValues.filter(v => v !== value)
+        }
+      }
+      else {
+        // 单选：checked 为 true → 只保留当前值
+        newValues = checked ? [value] : []
+      }
+
+      selectedValues.value = newValues
+      emit('update:modelValue', newValues)
+      emit('change', newValues)
+    }
+
+    const renderTag = (value: string | number, label?: string, vnode?: VNode) => {
+      const checked = selectedValues.value.includes(value)
+      const baseProps = {
+        'key': value,
+        value,
+        checked,
+        'checkable': true,
+        'checkedProps': props.checkedProps,
+        'uncheckedProps': props.uncheckedProps,
+        'onUpdate:checked': (val: boolean) => updateValue(value, val),
+      }
+
+      if (vnode) {
+        return cloneVNode(vnode, baseProps)
+      }
+      else {
+        return (
+          <Tag {...baseProps}>
+            {label}
+          </Tag>
+        )
+      }
+    }
+
+    // slot 渲染
     const renderSlotTags = () => {
       const slotNodes = slots.default?.() || []
       return slotNodes.map((vnode: VNode) => {
-        // 判断是否是 Tag 组件
+        if ((vnode.type as any)?.name === 'Tag') {
-        if (vnode.type === Tag) {
           const value = (vnode.props as any)?.value
-          const checked = selectedValues.value.includes(value)
+          return renderTag(value, undefined, vnode)
-          return cloneVNode(vnode, {
-            checked,
-            'type': checked ? props.checkedProps.type : props.uncheckedProps.type,
-            'status': checked ? props.checkedProps.status : props.uncheckedProps.status,
-            'onUpdate:checked': (val: boolean) => handleTagClick(value, val),
-          })
         }
         return vnode
       })
     }
 
+    // options 渲染
+    const renderOptionTags = () =>
+      props.options.map(opt => renderTag(opt.value, opt.label))
+
     return () => (
       <div class={[prefixCls, props.class]} style={{ ...props.style }}>
-        {slots.default?.()}
+        {props.options.length ? renderOptionTags() : renderSlotTags()}
       </div>
     )
   },

code/base-project/base-vue/packages/ao-design/src/tag/index.scss

@@ -53,6 +53,37 @@ $tag-prefix: '#{$prefix}-tag';
     }
   }
 
+  &-check {
+    cursor: pointer;
+    user-select: none;
+    transition: background-color 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  }
+
+  &-disabled {
+    cursor: default;
+  }
+
+  &-check.#{$tag-prefix}-disabled.#{$tag-prefix}-type-solid.#{$tag-prefix}-status-default {
+    background-color: $default-color-disabled;
+    color: $text-color-disabled;
+  }
+
+  &-checked.#{$tag-prefix}-disabled.#{$tag-prefix}-type-solid.#{$tag-prefix}-status-primary {
+    background-color: $primary-color-disabled;
+  }
+
+  &-checked.#{$tag-prefix}-disabled.#{$tag-prefix}-type-solid.#{$tag-prefix}-status-danger {
+    background-color: $danger-color-disabled;
+  }
+
+  &-checked.#{$tag-prefix}-disabled.#{$tag-prefix}-type-solid.#{$tag-prefix}-status-warning {
+    background-color: $warning-color-disabled;
+  }
+
+  &-checked.#{$tag-prefix}-disabled.#{$tag-prefix}-type-solid.#{$tag-prefix}-status-success {
+    background-color: $success-color-disabled;
+  }
+
   &-type-solid {
     &.#{$tag-prefix}-status-default {
       color: $text-color-base;

code/base-project/base-vue/packages/ao-design/src/tag/index.tsx

@@ -6,6 +6,7 @@ import Icon from '../icon/index'
 export default defineComponent({
   name: 'Tag',
   props: {
+
     shape: {
       type: String as PropType<'square' | 'round' | 'mark'>,
       default: 'square',
@@ -22,51 +23,77 @@ export default defineComponent({
       type: String as () => 'primary' | 'danger' | 'warning' | 'success' | 'default',
       default: 'default',
     },
-    showClose: {
+    checkable: { type: Boolean, default: false },
-      type: Boolean,
+    checked: { type: Boolean, default: false },
-      default: false,
+    value: { type: [String, Number], required: false },
+    checkedProps: {
+      type: Object as PropType<{ type?: 'solid' | 'light' | 'outline' | 'outline-light', status?: 'primary' | 'danger' | 'warning' | 'success' | 'default' }>,
+      default: () => ({
+        type: 'solid',
+        status: 'primary',
+      }),
     },
-    icon: {
+    uncheckedProps: {
-      type: String,
+      type: Object as PropType<{ type?: 'solid' | 'light' | 'outline' | 'outline-light', status?: 'primary' | 'danger' | 'warning' | 'success' | 'default' }>,
-      default: '',
+      default: () => ({
+        type: 'solid',
+        status: 'default',
+      }),
     },
-    disabled: {
+    showClose: { type: Boolean, default: false },
-      type: Boolean,
+    icon: { type: String, default: '' },
-      default: false,
+    disabled: { type: Boolean, default: false },
+    class: { type: [String, Array, Object], default: '' },
+    style: { type: Object, default: () => ({}) },
   },
-    class: {
+  emits: ['click', 'close', 'update:checked'],
-      type: [String, Array, Object],
-      default: '',
-    },
-    style: {
-      type: Object,
-      default: () => ({}),
-    },
-  },
-  emits: ['click', 'close'],
   setup(props, { slots, emit }) {
     const prefixCls = getPrefixCls('tag')
     const visible = ref(true)
 
     const handleClick = (event: MouseEvent) => {
-      emit('click', event)
+      if (props.disabled)
+        return
+
+      // 如果 checkable，触发 update:checked
+      if (props.checkable) {
+        emit('update:checked', !props.checked)
+      }
+
+      emit('click', { value: props.value, checked: props.checked, event })
     }
 
     const handleClose = (event: MouseEvent) => {
       event.stopPropagation()
-      visible.value = false // 点击关闭隐藏 Tag
+      visible.value = false
-      emit('close', event)
+      emit('close', { value: props.value, event })
     }
 
     return () =>
-      visible.value && (
+      visible.value && (() => {
+        const renderType = props.checkable
+          ? props.checked
+            ? props.checkedProps.type
+            : props.uncheckedProps.type
+          : props.type
+
+        const renderStatus = props.checkable
+          ? props.checked
+            ? props.checkedProps.status
+            : props.uncheckedProps.status
+          : props.status
+
+        return (
           <div
             class={[
               prefixCls,
               `${prefixCls}-size-${props.size}`,
               `${prefixCls}-shape-${props.shape}`,
-            `${prefixCls}-type-${props.type}`,
+              `${prefixCls}-type-${renderType}`,
-            `${prefixCls}-status-${props.status}`,
+              `${prefixCls}-status-${renderStatus}`,
+              { [`${prefixCls}-check`]: props.checkable },
+              { [`${prefixCls}-checked`]: props.checked },
+              { [`${prefixCls}-disabled`]: props.disabled },
               props.class,
             ]}
             style={{ ...props.style }}
@@ -79,5 +106,6 @@ export default defineComponent({
             )}
           </div>
         )
+      })()
   },
 })

code/base-project/base-vue/pnpm-lock.yaml

@@ -20,6 +20,9 @@ importers:
       naive-ui:
         specifier: ^2.42.0
         version: 2.42.0(vue@3.5.19(typescript@5.8.3))
+      tdesign-vue-next:
+        specifier: ^1.16.1
+        version: 1.16.1(vue@3.5.19(typescript@5.8.3))
       vue:
         specifier: ^3.5.18
         version: 3.5.19(typescript@5.8.3)
@@ -255,6 +258,10 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
+  '@babel/runtime@7.28.4':
+    resolution: {integrity: sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/template@7.27.2':
     resolution: {integrity: sha512-LPDZ85aEJyYSd18/DkjNh4/y1ntkE5KwUHWTiqgRxruuZL2F1yuHligVHLvcHY2vMHXttKFpJn6LwfI7cw7ODw==}
     engines: {node: '>=6.9.0'}
@@ -616,42 +623,36 @@ packages:
     engines: {node: '>= 10.0.0'}
     cpu: [arm]
     os: [linux]
-    libc: [glibc]
 
   '@parcel/watcher-linux-arm-musl@2.5.1':
     resolution: {integrity: sha512-6E+m/Mm1t1yhB8X412stiKFG3XykmgdIOqhjWj+VL8oHkKABfu/gjFj8DvLrYVHSBNC+/u5PeNrujiSQ1zwd1Q==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm]
     os: [linux]
-    libc: [musl]
 
   '@parcel/watcher-linux-arm64-glibc@2.5.1':
     resolution: {integrity: sha512-LrGp+f02yU3BN9A+DGuY3v3bmnFUggAITBGriZHUREfNEzZh/GO06FF5u2kx8x+GBEUYfyTGamol4j3m9ANe8w==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [linux]
-    libc: [glibc]
 
   '@parcel/watcher-linux-arm64-musl@2.5.1':
     resolution: {integrity: sha512-cFOjABi92pMYRXS7AcQv9/M1YuKRw8SZniCDw0ssQb/noPkRzA+HBDkwmyOJYp5wXcsTrhxO0zq1U11cK9jsFg==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [linux]
-    libc: [musl]
 
   '@parcel/watcher-linux-x64-glibc@2.5.1':
     resolution: {integrity: sha512-GcESn8NZySmfwlTsIur+49yDqSny2IhPeZfXunQi48DMugKeZ7uy1FX83pO0X22sHntJ4Ub+9k34XQCX+oHt2A==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [linux]
-    libc: [glibc]
 
   '@parcel/watcher-linux-x64-musl@2.5.1':
     resolution: {integrity: sha512-n0E2EQbatQ3bXhcH2D1XIAANAcTZkQICBPVaxMeaCVBtOpBZpWJuf7LwyWPSBDITb7In8mqQgJ7gH8CILCURXg==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [linux]
-    libc: [musl]
 
   '@parcel/watcher-win32-arm64@2.5.1':
     resolution: {integrity: sha512-RFzklRvmc3PkjKjry3hLF9wD7ppR4AKcWNzH7kXR7GUe0Igb3Nz8fyPwtZCSquGrhU5HhUNDr/mKBqj7tqA2Vw==}
@@ -683,6 +684,9 @@ packages:
     resolution: {integrity: sha512-QNqXyfVS2wm9hweSYD2O7F0G06uurj9kZ96TRQE5Y9hU7+tgdZwIkbAKc5Ocy1HxEY2kuDQa6cQ1WRs/O5LFKA==}
     engines: {node: ^12.20.0 || ^14.18.0 || >=16.0.0}
 
+  '@popperjs/core@2.11.8':
+    resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
+
   '@rolldown/pluginutils@1.0.0-beta.29':
     resolution: {integrity: sha512-NIJgOsMjbxAXvoGq/X0gD7VPMQ8j9g0BiDaNjVNVjvl+iKXxL3Jre0v31RmBYeLEmkbj2s02v8vFTbUXi5XS2Q==}
 
@@ -723,67 +727,56 @@ packages:
     resolution: {integrity: sha512-JWnrj8qZgLWRNHr7NbpdnrQ8kcg09EBBq8jVOjmtlB3c8C6IrynAJSMhMVGME4YfTJzIkJqvSUSVJRqkDnu/aA==}
     cpu: [arm]
     os: [linux]
-    libc: [glibc]
 
   '@rollup/rollup-linux-arm-musleabihf@4.48.0':
     resolution: {integrity: sha512-9xu92F0TxuMH0tD6tG3+GtngwdgSf8Bnz+YcsPG91/r5Vgh5LNofO48jV55priA95p3c92FLmPM7CvsVlnSbGQ==}
     cpu: [arm]
     os: [linux]
-    libc: [musl]
 
   '@rollup/rollup-linux-arm64-gnu@4.48.0':
     resolution: {integrity: sha512-NLtvJB5YpWn7jlp1rJiY0s+G1Z1IVmkDuiywiqUhh96MIraC0n7XQc2SZ1CZz14shqkM+XN2UrfIo7JB6UufOA==}
     cpu: [arm64]
     os: [linux]
-    libc: [glibc]
 
   '@rollup/rollup-linux-arm64-musl@4.48.0':
     resolution: {integrity: sha512-QJ4hCOnz2SXgCh+HmpvZkM+0NSGcZACyYS8DGbWn2PbmA0e5xUk4bIP8eqJyNXLtyB4gZ3/XyvKtQ1IFH671vQ==}
     cpu: [arm64]
     os: [linux]
-    libc: [musl]
 
   '@rollup/rollup-linux-loongarch64-gnu@4.48.0':
     resolution: {integrity: sha512-Pk0qlGJnhILdIC5zSKQnprFjrGmjfDM7TPZ0FKJxRkoo+kgMRAg4ps1VlTZf8u2vohSicLg7NP+cA5qE96PaFg==}
     cpu: [loong64]
     os: [linux]
-    libc: [glibc]
 
   '@rollup/rollup-linux-ppc64-gnu@4.48.0':
     resolution: {integrity: sha512-/dNFc6rTpoOzgp5GKoYjT6uLo8okR/Chi2ECOmCZiS4oqh3mc95pThWma7Bgyk6/WTEvjDINpiBCuecPLOgBLQ==}
     cpu: [ppc64]
     os: [linux]
-    libc: [glibc]
 
   '@rollup/rollup-linux-riscv64-gnu@4.48.0':
     resolution: {integrity: sha512-YBwXsvsFI8CVA4ej+bJF2d9uAeIiSkqKSPQNn0Wyh4eMDY4wxuSp71BauPjQNCKK2tD2/ksJ7uhJ8X/PVY9bHQ==}
     cpu: [riscv64]
     os: [linux]
-    libc: [glibc]
 
   '@rollup/rollup-linux-riscv64-musl@4.48.0':
     resolution: {integrity: sha512-FI3Rr2aGAtl1aHzbkBIamsQyuauYtTF9SDUJ8n2wMXuuxwchC3QkumZa1TEXYIv/1AUp1a25Kwy6ONArvnyeVQ==}
     cpu: [riscv64]
     os: [linux]
-    libc: [musl]
 
   '@rollup/rollup-linux-s390x-gnu@4.48.0':
     resolution: {integrity: sha512-Dx7qH0/rvNNFmCcIRe1pyQ9/H0XO4v/f0SDoafwRYwc2J7bJZ5N4CHL/cdjamISZ5Cgnon6iazAVRFlxSoHQnQ==}
     cpu: [s390x]
     os: [linux]
-    libc: [glibc]
 
   '@rollup/rollup-linux-x64-gnu@4.48.0':
     resolution: {integrity: sha512-GUdZKTeKBq9WmEBzvFYuC88yk26vT66lQV8D5+9TgkfbewhLaTHRNATyzpQwwbHIfJvDJ3N9WJ90wK/uR3cy3Q==}
     cpu: [x64]
     os: [linux]
-    libc: [glibc]
 
   '@rollup/rollup-linux-x64-musl@4.48.0':
     resolution: {integrity: sha512-ao58Adz/v14MWpQgYAb4a4h3fdw73DrDGtaiF7Opds5wNyEQwtO6M9dBh89nke0yoZzzaegq6J/EXs7eBebG8A==}
     cpu: [x64]
     os: [linux]
-    libc: [musl]
 
   '@rollup/rollup-win32-arm64-msvc@4.48.0':
     resolution: {integrity: sha512-kpFno46bHtjZVdRIOxqaGeiABiToo2J+st7Yce+aiAoo1H0xPi2keyQIP04n2JjDVuxBN6bSz9R6RdTK5hIppw==}
@@ -833,9 +826,18 @@ packages:
   '@types/node@24.3.0':
     resolution: {integrity: sha512-aPTXCrfwnDLj4VvXrm+UUCQjNEvJgNA8s5F1cvwQU+3KNltTOkBm1j30uNLyqqPNe7gE3KFzImYoZEfLhp4Yow==}
 
+  '@types/sortablejs@1.15.8':
+    resolution: {integrity: sha512-b79830lW+RZfwaztgs1aVPgbasJ8e7AXtZYHTELNXZPsERt4ymJdjV4OccDbHQAvHrCcFpbF78jkm0R6h/pZVg==}
+
+  '@types/tinycolor2@1.4.6':
+    resolution: {integrity: sha512-iEN8J0BoMnsWBqjVbWH/c0G0Hh7O21lpR2/+PrvAVgWdzL7eexIFm4JN/Wn10PTcmNdtS6U67r499mlWMXOxNw==}
+
   '@types/unist@3.0.3':
     resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==}
 
+  '@types/validator@13.15.3':
+    resolution: {integrity: sha512-7bcUmDyS6PN3EuD9SlGGOxM77F8WLVsrwkxyWxKnxzmXoequ6c7741QBrANq6htVRGOITJ7z72mTP6Z4XyuG+Q==}
+
   '@typescript-eslint/eslint-plugin@8.40.0':
     resolution: {integrity: sha512-w/EboPlBwnmOBtRbiOvzjD+wdiZdgFeo17lkltrtn7X37vagKKWJABvyfsJXTlHe6XBzugmYgd4A4nW+k8Mixw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
@@ -1159,6 +1161,9 @@ packages:
   date-fns@3.6.0:
     resolution: {integrity: sha512-fRHTG8g/Gif+kSh50gaGEdToemgfj74aRX3swtiouboip5JDLAyDE9F11nHMIcvOaXeOC6D7SpNhi7uFyB7Uww==}
 
+  dayjs@1.11.18:
+    resolution: {integrity: sha512-zFBQ7WFRvVRhKcWoUh+ZA1g2HVgUbsZm9sbddh8EC5iv93sui8DVVz1Npvz+r6meo9VKfa8NyLWBsQK1VvIKPA==}
+
   de-indent@1.0.2:
     resolution: {integrity: sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==}
 
@@ -1855,6 +1860,9 @@ packages:
     resolution: {integrity: sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==}
     engines: {node: '>=16 || 14 >=14.17'}
 
+  mitt@3.0.1:
+    resolution: {integrity: sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==}
+
   mlly@1.8.0:
     resolution: {integrity: sha512-l8D9ODSRWLe2KHJSifWGwBqpTZXIXTeo8mlKjY+E2HAakaTeNpqAyBZ8GSqLzHgw4XmHmC8whvpjJNMbFZN7/g==}
 
@@ -2096,6 +2104,9 @@ packages:
   sisteransi@1.0.5:
     resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==}
 
+  sortablejs@1.15.6:
+    resolution: {integrity: sha512-aNfiuwMEpfBM/CN6LY0ibyhxPfPbyFeBTYJKCvzkJ2GkUpazIt3H+QIPAMHwqQ7tMKaHz1Qj+rJJCqljnf4p3A==}
+
   source-map-js@1.2.1:
     resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
     engines: {node: '>=0.10.0'}
@@ -2140,6 +2151,20 @@ packages:
     resolution: {integrity: sha512-ZL6DDuAlRlLGghwcfmSn9sK3Hr6ArtyudlSAiCqQ6IfE+b+HHbydbYDIG15IfS5do+7XQQBdBiubF/cV2dnDzg==}
     engines: {node: '>=6'}
 
+  tdesign-icons-vue-next@0.3.7:
+    resolution: {integrity: sha512-Q5ebVty/TCqhBa0l/17kkhjC0pBAOGvn7C35MAt1xS+johKVM9QEDOy9R6XEl332AiwQ37MwqioczqjYC30ckw==}
+    peerDependencies:
+      vue: ^3.0.0
+
+  tdesign-vue-next@1.16.1:
+    resolution: {integrity: sha512-UftAv+Zp1670Ld0+EfCk5/8X4OigKvXKDTgO3X2PIvq8KTZA1Nvf0IegYvwCoKAjCaV1jYEmEHuGfmlXskdSCg==}
+    engines: {node: '>= 18'}
+    peerDependencies:
+      vue: '>=3.1.0'
+
+  tinycolor2@1.6.0:
+    resolution: {integrity: sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==}
+
   tinyexec@1.0.1:
     resolution: {integrity: sha512-5uC6DDlmeqiOwCPmK9jMSdOuZTh8bU39Ys6yidB+UTt5hfZUPGAypSgFRiEp+jbi9qH40BLDvy85jIU88wKSqw==}
 
@@ -2257,6 +2282,10 @@ packages:
   util-deprecate@1.0.2:
     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
 
+  validator@13.15.15:
+    resolution: {integrity: sha512-BgWVbCI72aIQy937xbawcs+hrVaN/CZ2UwutgaJ36hGqRrLNM+f5LUT/YPRbo8IV/ASeFzXszezV+y2+rq3l8A==}
+    engines: {node: '>= 0.10'}
+
   vdirs@0.1.8:
     resolution: {integrity: sha512-H9V1zGRLQZg9b+GdMk8MXDN2Lva0zx72MPahDKc30v+DtwKjfyOSXWRIX4t2mhDubM1H09gPhWeth/BJWPHGUw==}
     peerDependencies:
@@ -2585,6 +2614,8 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@babel/runtime@7.28.4': {}
+
   '@babel/template@7.27.2':
     dependencies:
       '@babel/code-frame': 7.27.1
@@ -2935,6 +2966,8 @@ snapshots:
 
   '@pkgr/core@0.2.9': {}
 
+  '@popperjs/core@2.11.8': {}
+
   '@rolldown/pluginutils@1.0.0-beta.29': {}
 
   '@rolldown/pluginutils@1.0.0-beta.34': {}
@@ -3035,8 +3068,14 @@ snapshots:
     dependencies:
       undici-types: 7.10.0
 
+  '@types/sortablejs@1.15.8': {}
+
+  '@types/tinycolor2@1.4.6': {}
+
   '@types/unist@3.0.3': {}
 
+  '@types/validator@13.15.3': {}
+
   '@typescript-eslint/eslint-plugin@8.40.0(@typescript-eslint/parser@8.40.0(eslint@9.34.0)(typescript@5.8.3))(eslint@9.34.0)(typescript@5.8.3)':
     dependencies:
       '@eslint-community/regexpp': 4.12.1
@@ -3422,6 +3461,8 @@ snapshots:
 
   date-fns@3.6.0: {}
 
+  dayjs@1.11.18: {}
+
   de-indent@1.0.2: {}
 
   debug@4.4.1:
@@ -4348,6 +4389,8 @@ snapshots:
     dependencies:
       brace-expansion: 2.0.2
 
+  mitt@3.0.1: {}
+
   mlly@1.8.0:
     dependencies:
       acorn: 8.15.0
@@ -4598,6 +4641,8 @@ snapshots:
 
   sisteransi@1.0.5: {}
 
+  sortablejs@1.15.6: {}
+
   source-map-js@1.2.1: {}
 
   source-map@0.6.1:
@@ -4637,6 +4682,30 @@ snapshots:
 
   tapable@2.2.3: {}
 
+  tdesign-icons-vue-next@0.3.7(vue@3.5.19(typescript@5.8.3)):
+    dependencies:
+      '@babel/runtime': 7.28.4
+      vue: 3.5.19(typescript@5.8.3)
+
+  tdesign-vue-next@1.16.1(vue@3.5.19(typescript@5.8.3)):
+    dependencies:
+      '@babel/runtime': 7.28.4
+      '@popperjs/core': 2.11.8
+      '@types/lodash-es': 4.17.12
+      '@types/sortablejs': 1.15.8
+      '@types/tinycolor2': 1.4.6
+      '@types/validator': 13.15.3
+      dayjs: 1.11.18
+      lodash-es: 4.17.21
+      mitt: 3.0.1
+      sortablejs: 1.15.6
+      tdesign-icons-vue-next: 0.3.7(vue@3.5.19(typescript@5.8.3))
+      tinycolor2: 1.6.0
+      validator: 13.15.15
+      vue: 3.5.19(typescript@5.8.3)
+
+  tinycolor2@1.6.0: {}
+
   tinyexec@1.0.1: {}
 
   tinyglobby@0.2.14:
@@ -4772,6 +4841,8 @@ snapshots:
 
   util-deprecate@1.0.2: {}
 
+  validator@13.15.15: {}
+
   vdirs@0.1.8(vue@3.5.19(typescript@5.8.3)):
     dependencies:
       evtd: 0.2.4

code/base-project/base-vue/src/App.vue

@@ -1,13 +1,36 @@
 <script setup lang="ts">
+import { ref } from 'vue'
 
+const checked = ref(['1'])
+
+const checked1 = ref(false)
+const checked2 = ref(false)
+const checked3 = ref(false)
+
+const STYLE_B_UNCHECKED_PROPS = {
+  theme: 'default',
+  variant: 'outline',
+}
+
+const STYLE_C_CHECKED_PROPS = {
+  theme: 'primary',
+  variant: 'outline',
+}
 </script>
 
 <template>
   <div class="demo">
     <div class="row">
-      <ATagGroup>
+      <ATag show-close checkable disabled>
-        <ATag show-close>测试1</ATag>
+        测试 1
-        <ATag show-close>测试2</ATag>
+      </ATag>
+      <ATagGroup v-model="checked">
+        <ATag show-close value="1">
+          测试 1
+        </ATag>
+        <ATag show-close value="2">
+          测试2
+        </ATag>
       </ATagGroup>
     </div>
   </div>

code/base-project/base-vue/src/main.ts

@@ -1,6 +1,9 @@
 import naive from 'naive-ui'
+import TDesign from 'tdesign-vue-next'
 import { createApp } from 'vue'
 import App from './App.vue'
 import './style.scss'
 
-createApp(App).use(naive).mount('#app')
+import 'tdesign-vue-next/es/style/index.css'
+
+createApp(App).use(naive).use(TDesign).mount('#app')