ep-craft 0.1.11 → 0.1.13

package/dist/resolver.d.ts

@@ -21,10 +21,6 @@ export interface EpCraftResolverOptions {
 export declare function EpCraftResolver(options?: EpCraftResolverOptions): {
     type: "component";
     resolve: (name: string) => {
-        name: string;
-        from: string;
-        sideEffects?: undefined;
-    } | {
         name: string;
         from: string;
         sideEffects: string[] | undefined;

package/dist/resolver.js

@@ -1,22 +1,23 @@
-function n(r = {}) {
-  const { importStyle: o = !0 } = r;
+function c(s = {}) {
+  const { importStyle: r = !0 } = s;
   return {
     type: "component",
-    resolve: (t) => {
-      if (!t.startsWith("Ep")) return;
-      const e = t.slice(2);
-      return e === "Button" || e === "ButtonGroup" ? {
-        name: t,
-        from: "ep-craft"
+    resolve: (e) => {
+      if (!e.startsWith("Ep")) return;
+      const t = e.slice(2);
+      return t === "Button" || t === "ButtonGroup" || t === "Tag" || t === "CheckTag" ? {
+        name: e,
+        from: "ep-craft",
+        sideEffects: r ? ["ep-craft/dist/index.css"] : void 0
       } : {
-        name: `El${e}`,
+        name: `El${t}`,
         from: "ep-craft",
-        sideEffects: o ? ["ep-craft/dist/index.css"] : void 0
+        sideEffects: r ? ["ep-craft/dist/index.css"] : void 0
       };
     }
   };
 }
 export {
-  n as EpCraftResolver,
-  n as default
+  c as EpCraftResolver,
+  c as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ep-craft",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "description": "A Vue 3 component library based on element-plus with ep- prefix",
   "type": "module",
   "main": "./dist/ep-craft.js",

package/theme-chalk/src/button.scss

@@ -93,8 +93,6 @@ $button-plain-config: (
 
 @include b(button) {
   @include set-component-css-var('button', $button);
-  // 默认按钮（未指定 type）样式与 primary 保持一致
-  @include button-variant(primary);
 }
 
 @include b(button) {
@@ -174,25 +172,11 @@ $button-plain-config: (
   }
 
   @include when(plain) {
-    // 默认朴素按钮样式与 primary + plain 保持一致
-    $cfg: map.get($button-plain-config, primary);
-    @include button-reverse-variant(
-      $color-primary,
-      list.nth($cfg, 2),
-      list.nth($cfg, 3),
-      list.nth($cfg, 4),
-      list.nth($cfg, 5)
-    );
-
-    // plain 禁用态与 primary + plain disabled 保持一致：透明背景 + 主题色边框 + 整体 40% 透明
     &.is-disabled {
       &,
       &:hover,
       &:focus,
       &:active {
-        color: getCssVar('color-primary');
-        background-color: transparent;
-        border-color: list.nth($cfg, 2);
         opacity: 0.4;
       }
     }

package/theme-chalk/src/check-tag.scss

@@ -1,57 +1,96 @@
+@use 'sass:color';
+@use 'sass:map';
 @use 'mixins/mixins' as *;
 @use 'common/var' as *;
 
+// 各类型选中态主色（依据 Figma 实心标签规范）
+$haldur-check-tag-checked: (
+  'primary': #1c64fd,
+  'success': #12b886,
+  'info': #a9acb8,
+  'warning': #f57f00,
+  'danger': #f14646,
+);
+
+// ---------------------------------------------------------------------------
+// CheckTag 可选标签
+// 依据 Haldur Design System（Figma node 1443-21458 / 21470 / 21471 / 21472）
+// 精确对齐各状态颜色、尺寸与圆角。
+// ---------------------------------------------------------------------------
 @include b(check-tag) {
-  background-color: getCssVar('color', 'info', 'light-9');
-  border-radius: getCssVar('border-radius', 'base');
-  color: getCssVar('color', 'info');
+  // 基础排版：14px / 22px 常规字重，圆角 4px，内边距 1px 8px
+  font-family: 'PingFang SC', sans-serif;
+  font-size: 14px;
+  line-height: 22px;
+  font-weight: 400;
+  border-radius: 4px;
+  padding: 1px 8px;
   cursor: pointer;
   display: inline-block;
-  font-size: getCssVar('font-size', 'base');
-  line-height: getCssVar('font-size', 'base');
-  padding: 7px 15px;
   transition: getCssVar('transition', 'all');
-  font-weight: bold;
 
+  // 未选中 默认：浅灰底 + 深色字
+  background-color: #f2f3f5;
+  color: #1d1f29;
+
+  // 未选中 悬停
   &:hover {
-    background-color: getCssVar('color', 'info', 'light-7');
+    background-color: #e5e6eb;
+  }
+
+  // 未选中 禁用
+  @include when(disabled) {
+    background-color: #f2f3f5;
+    color: #c9cbd4;
+    cursor: not-allowed;
+
+    &:hover {
+      background-color: #f2f3f5;
+    }
   }
 
-  @each $type in $types {
+  // 选中：实心底 + 白字（默认 primary 蓝）
+  @include when(checked) {
+    background-color: #1c64fd;
+    color: #fff;
+
+    // 选中 悬停
+    &:hover {
+      background-color: #164ed1;
+    }
+
+    // 选中 禁用
+    @include when(disabled) {
+      background-color: #b8cfff;
+      color: #fff;
+      cursor: not-allowed;
+
+      &:hover {
+        background-color: #b8cfff;
+      }
+    }
+  }
+
+  // 各类型选中态：实心主色 + 白字
+  @each $type, $main in $haldur-check-tag-checked {
     &.#{bem('check-tag', '', $type)} {
       @include when(checked) {
-        background-color: getCssVar('color', $type, 'light-8');
-        color: getCssVar('color', $type);
+        background-color: $main;
+        color: #fff;
 
+        // 悬停：加深主色
         &:hover {
-          background-color: getCssVar('color', $type, 'light-7');
+          background-color: color.adjust($main, $lightness: -6%);
         }
 
+        // 禁用：主色浅化
         @include when(disabled) {
-          background-color: getCssVar('color', $type, 'light-8');
-          color: getCssVar('disabled-text-color');
+          background-color: color.mix(#fff, $main, 72%);
+          color: #fff;
           cursor: not-allowed;
 
           &:hover {
-            background-color: getCssVar('color', $type, 'light-8');
-          }
-        }
-      }
-
-      @include when(disabled) {
-        @if $type == 'primary' {
-          background-color: getCssVar('color', 'info', 'light-9');
-        } @else {
-          background-color: getCssVar('color', $type, 'light-9');
-        }
-        color: getCssVar('disabled-text-color');
-        cursor: not-allowed;
-
-        &:hover {
-          @if $type == 'primary' {
-            background-color: getCssVar('color', 'info', 'light-9');
-          } @else {
-            background-color: getCssVar('color', $type, 'light-9');
+            background-color: color.mix(#fff, $main, 72%);
           }
         }
       }

package/theme-chalk/src/tag.scss

@@ -193,3 +193,112 @@ $tag-icon-span-gap: map.merge(
     }
   }
 }
+
+// ---------------------------------------------------------------------------
+// Haldur Design System - Tag 样式覆盖
+// 依据 Figma 设计规范（node 1433-12002）精确对齐颜色、尺寸与圆角。
+// 通过覆盖 CSS 变量的方式实现，保留上方原有的结构与逻辑。
+// ---------------------------------------------------------------------------
+
+// 各类型的设计色板：(文字色, 浅色背景, 描边色)
+$haldur-tag-colors: (
+  'primary': (
+    'main': #1c64fd,
+    'light-bg': #f5f8ff,
+    'border': #b8cfff,
+  ),
+  'success': (
+    'main': #12b886,
+    'light-bg': #f3fbf9,
+    'border': #b8eadb,
+  ),
+  'info': (
+    'main': #1d1f29,
+    'light-bg': #f2f3f5,
+    'border': #c9cbd4,
+  ),
+  'warning': (
+    'main': #f57f00,
+    'light-bg': #fff6eb,
+    'border': #ffd8a8,
+  ),
+  'danger': (
+    'main': #f14646,
+    'light-bg': #fff5f5,
+    'border': #ffc9c9,
+  ),
+);
+
+@include b(tag) {
+  // 基础排版：14px / 22px，圆角 4px，间距 4px，内边距 1px 8px
+  #{getCssVarName('tag-font-size')}: 14px;
+  #{getCssVarName('tag-border-radius')}: 4px;
+
+  font-family: 'PingFang SC', sans-serif;
+  line-height: 22px;
+  height: 24px;
+  padding: 1px calc(8px - #{$tag-border-width});
+  gap: 4px;
+
+  // light（默认）：浅色背景 + 彩色文字，无边框
+  @each $type, $conf in $haldur-tag-colors {
+    &.#{bem('tag', '', $type)} {
+      #{getCssVarName('tag-bg-color')}: map.get($conf, 'light-bg');
+      #{getCssVarName('tag-border-color')}: map.get($conf, 'light-bg');
+      #{getCssVarName('tag-text-color')}: map.get($conf, 'main');
+      #{getCssVarName('tag-hover-color')}: map.get($conf, 'main');
+    }
+  }
+
+  // dark（实心）：彩色背景 + 白色文字
+  @include m(dark) {
+    @each $type, $conf in $haldur-tag-colors {
+      $bg: map.get($conf, 'main');
+      @if $type == 'info' {
+        $bg: #4e5369;
+      }
+      &.#{bem('tag', '', $type)} {
+        #{getCssVarName('tag-bg-color')}: $bg;
+        #{getCssVarName('tag-border-color')}: $bg;
+        #{getCssVarName('tag-text-color')}: #fff;
+      }
+    }
+  }
+
+  // plain（带边框）：浅色背景 + 彩色文字 + 彩色描边
+  @include m(plain) {
+    @each $type, $conf in $haldur-tag-colors {
+      &.#{bem('tag', '', $type)} {
+        #{getCssVarName('tag-bg-color')}: map.get($conf, 'light-bg');
+        #{getCssVarName('tag-border-color')}: map.get($conf, 'border');
+        #{getCssVarName('tag-text-color')}: map.get($conf, 'main');
+      }
+    }
+  }
+
+  // 图标尺寸对齐 12px
+  @include set-css-var-value('icon-size', 12px);
+
+  .#{$namespace}-tag__close {
+    margin-left: 0;
+  }
+
+  &.is-closable {
+    padding-right: calc(8px - #{$tag-border-width});
+  }
+
+  // 各尺寸标签高度：large 28px / default 24px / small 22px / mini 18px
+  $haldur-tag-height: (
+    'large': 28px,
+    'default': 24px,
+    'small': 22px,
+    'mini': 18px,
+  );
+
+  @each $size, $height in $haldur-tag-height {
+    @include m($size) {
+      height: $height;
+    }
+  }
+}
+