From 034b6823db3af3a02420a3ec57de9513d91851fc Mon Sep 17 00:00:00 2001
From: higuaifan <higuaifan@higuaifan.com>
Date: Wed, 6 Nov 2024 11:26:48 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=80=20[tag]=20support=20size?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ref #58
---
 lib/components/base/tag/MTag.tsx   |  2 +-
 lib/components/base/tag/api.ts     |  1 +
 lib/components/base/tag/index.d.ts |  7 +++++++
 lib/components/base/tag/tag.css    | 15 ++++++++++++++-
 playground/src/lib/Base.vue        |  2 ++
 5 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/lib/components/base/tag/MTag.tsx b/lib/components/base/tag/MTag.tsx
index a2064f86..b0b32f96 100644
--- a/lib/components/base/tag/MTag.tsx
+++ b/lib/components/base/tag/MTag.tsx
@@ -13,7 +13,7 @@ import './tag.css';
 
 export default defineComponent((props: TagProps, { slots }) => {
   return () => {
-    return <div class={['m-tag', `m-tag-${props.type}`]}>
+    return <div class={['m-tag', `m-tag-${props.type}`, `m-tag-${props.size}`]}>
       <div class="m-tag-left"/>
       <div class="m-tag-main">
         {slots.default?.() ?? ''}
diff --git a/lib/components/base/tag/api.ts b/lib/components/base/tag/api.ts
index 6ac541f3..c7169768 100644
--- a/lib/components/base/tag/api.ts
+++ b/lib/components/base/tag/api.ts
@@ -11,4 +11,5 @@ import { TagProps } from './index';
 
 export const props: MCOPO<TagProps> = {
   type: { type: String as MPropType<'default' | 'primary' | 'error' | 'confirm' | 'warning'>, default: 'default' },
+  size: { type: String as MPropType<'small' | 'default' | 'large'>, default: 'default' },
 };
diff --git a/lib/components/base/tag/index.d.ts b/lib/components/base/tag/index.d.ts
index f0c70f75..362f681b 100644
--- a/lib/components/base/tag/index.d.ts
+++ b/lib/components/base/tag/index.d.ts
@@ -21,4 +21,11 @@ export declare type TagProps = {
    * @enum default|primary|error|confirm|warning
    */
   type?: 'default' | 'primary' | 'error' | 'confirm' | 'warning'
+  /**
+   * @description button size 按钮大小
+   * @type string
+   * @default default
+   * @enum small|default|large
+   */
+  size?: 'small' | 'default' | 'large'
 };
diff --git a/lib/components/base/tag/tag.css b/lib/components/base/tag/tag.css
index e44fe27f..ab52fbc1 100644
--- a/lib/components/base/tag/tag.css
+++ b/lib/components/base/tag/tag.css
@@ -1,5 +1,10 @@
 :root {
-  --m-tag-h: 45px;
+
+  --m-tag-large: 64px;
+  --m-tag-default: 45px;
+  --m-tag-small: 32px;
+
+  --m-tag-h: var(--m-tag-default);
   --m-tag-w-min: 80px;
   --m-tag-border-w: calc(var(--m-tag-h) / 4.5);
 }
@@ -10,6 +15,14 @@
   min-width: var(--m-tag-w-min);
   height: 100%;
   --m-tag-bg: var(--m-color-text-dark);
+
+  &.m-tag-large {
+    --m-tag-h: var(--m-tag-large);
+  }
+
+  &.m-tag-small {
+    --m-tag-h: var(--m-tag-small);
+  }
 }
 
 .m-tag-left, .m-tag-right {
diff --git a/playground/src/lib/Base.vue b/playground/src/lib/Base.vue
index d51aa48b..9cddf46c 100644
--- a/playground/src/lib/Base.vue
+++ b/playground/src/lib/Base.vue
@@ -48,6 +48,8 @@
         <m-tag>你好你好你好你好你好</m-tag>
 
         <m-tag type="primary">primary</m-tag>
+        <m-tag type="primary" size="small">small</m-tag>
+        <m-tag type="primary" size="large">large</m-tag>
         <m-tag type="error">error</m-tag>
         <m-tag type="confirm">confirm</m-tag>
         <m-tag type="warning">warning</m-tag>