@aloudata/aloudata-design 2.18.4 → 2.19.0-beta.2

package/dist/Radio/style/index.less

@@ -48,22 +48,19 @@
 .ald-radio-inner {
   position: relative;
   display: inline-block;
-  width: 16px;
-  height: 16px;
-  border: 1px solid
-    var(--alias-colors-border-accent-gray-subtle-default, #d1d5db);
-  background-color: var(--alias-colors-bg-skeleton-subtler, #fff);
+  width: 14px;
+  height: 14px;
+  border: 2px solid var(--interaction-border-neutral-normal);
+  background-color: var(--alias-colors-bg-skeleton-subtler);
   border-radius: 50%;
 
   &:hover {
-    border: 1px solid
-      var(--alias-colors-border-accent-gray-subtle-hover, #9ca3af);
+    border: 2px solid var(--interaction-border-hover);
   }
 
   &:active {
-    border: 1px solid
-      var(--alias-colors-border-accent-gray-subtle-default, #d1d5db);
-    background-color: var(--alias-colors-bg-skeleton-strong, #f3f4f6);
+    border: 2px solid var(--interaction-border-active);
+    background-color: var(--alias-colors-bg-skeleton-strong);
   }
 }
 
@@ -72,7 +69,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  color: #171717;
+  color: var(--alias-colors-text-default);
   font-weight: 400;
   font-size: 14px;
   line-height: 20px;
@@ -82,7 +79,7 @@
 
 // 绘制选中时的圆圈样式
 :not(.ald-radio-wrapper-indeterminate) > .ald-radio-checked > .ald-radio-inner {
-  background-color: var(--alias-colors-bg-selected-strong-default, #126fdd);
+  background-color: var(--alias-colors-bg-selected-strong-default);
   border: 0;
   transform: background 0.5s ease;
 
@@ -92,23 +89,23 @@
     left: 50%;
     width: 5px;
     height: 5px;
-    background-color: var(--alias-colors-icon-inverse-default, #fff);
+    background-color: var(--alias-colors-icon-inverse-default);
     border-radius: 50%;
     transform: translate(-50%, -50%);
     content: '';
   }
 
   &:hover {
-    background-color: var(--alias-colors-bg-selected-strong-hover, #0f59b1);
+    background-color: var(--alias-colors-bg-selected-strong-hover);
   }
 
   &:active {
-    background-color: var(--alias-colors-bg-selected-strong-press, #0b4385);
+    background-color: var(--alias-colors-bg-selected-strong-press);
   }
 }
 // 半选的样式
 .ald-radio-wrapper-indeterminate > .ald-radio > .ald-radio-inner[class] {
-  background-color: var(--alias-colors-bg-selected-strong-default, #126fdd);
+  background-color: var(--alias-colors-bg-selected-strong-default);
   border: 0;
   transform: background 0.5s ease;
 
@@ -118,38 +115,35 @@
     left: 50%;
     width: 8.5px;
     height: 2px;
-    background-color: var(--alias-colors-icon-inverse-default, #fff);
+    background-color: var(--alias-colors-icon-inverse-default);
     border-radius: 2px;
     transform: translate(-50%, -50%);
     content: '';
   }
 
   &:hover {
-    background-color: var(--alias-colors-bg-selected-strong-hover, #0f59b1);
+    background-color: var(--alias-colors-bg-selected-strong-hover);
   }
 
   &:active {
-    background-color: var(--alias-colors-bg-selected-strong-press, #0b4385);
+    background-color: var(--alias-colors-bg-selected-strong-press);
   }
 }
 
 // 禁用状态下的样式
 .ald-radio-disabled > .ald-radio-inner {
-  background-color: var(
-    --alias-colors-bg-disabled,
-    rgba(0, 0, 0, 0.05)
-  ) !important;
-  border: 1px solid var(--alias-colors-border-disabled, rgba(0, 0, 0, 0.1));
+  background-color: var(--alias-colors-bg-disabled) !important;
+  border: 2px solid var(--alias-colors-border-disabled);
 
   &::after {
-    background-color: var(--alias-colors-bg-disabled, rgba(0, 0, 0, 0.05));
+    background-color: var(--alias-colors-bg-disabled);
     border: 0;
   }
 }
 
 .ald-radio-disabled.ald-radio-checked > .ald-radio-inner {
   border: 0;
-  background: var(--alias-colors-bg-disabled, rgba(0, 0, 0, 0.05));
+  background: var(--alias-colors-bg-disabled);
 
   &::after {
     position: absolute;
@@ -157,7 +151,7 @@
     left: 50%;
     width: 5px;
     height: 5px;
-    background: var(--alias-colors-icon-disabled, rgba(0, 0, 0, 0.25));
+    background: var(--alias-colors-icon-disabled);
     border-radius: 50%;
     transform: translate(-50%, -50%);
     content: '';
@@ -176,7 +170,7 @@
   position: relative;
 
   .ald-radio-label .ald-radio-desc {
-    color: #171717;
+    color: var(--alias-colors-text-default);
     font-weight: 400;
     font-size: @font-size-middle;
     font-style: normal;
@@ -313,31 +307,27 @@
     align-items: center;
     justify-content: center;
     height: calc(100% - 4px);
-    background-color: var(--alias-colors-bg-skeleton-strong, #f3f4f6);
+    background-color: var(--alias-colors-bg-skeleton-strong);
     cursor: pointer;
 
     // 选中样式
     &.ald-radio-wrapper-checked {
-      background: var(--alias-colors-bg-skeleton-subtler, #fff);
-      border: 1px solid
-        var(--alias-colors-border-accent-gray-subtle-default, #d1d5db);
-      border-radius: var(--alias-radius-75, 6px);
-      box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
-        0 1px 2px 0 rgba(0, 0, 0, 0.06);
+      background: var(--alias-colors-bg-skeleton-subtler);
+      border: 1px solid var(--border-default);
+      border-radius: var(--alias-radius-75);
+      box-shadow: var(--elevation-bottom-bottom-sm);
       cursor: pointer;
 
       &:hover {
-        border-radius: var(--alias-radius-75, 6px);
-        border: 1px solid
-          var(--alias-colors-border-accent-gray-subtle-hover, #9ca3af);
-        background: var(--alias-colors-bg-skeleton-subtler, #fff);
+        border-radius: var(--alias-radius-75);
+        border: 1px solid var(--border-neutral-strong);
+        background: var(--alias-colors-bg-skeleton-subtler);
       }
 
       &:active {
-        border-radius: var(--alias-radius-75, 6px);
-        border: 1px solid
-          var(--alias-colors-border-accent-gray-subtle-default, #d1d5db);
-        background: var(--alias-colors-bg-skeleton-subtle, #f9fafb);
+        border-radius: var(--alias-radius-75);
+        border: 1px solid var(--border-default);
+        background: var(--alias-colors-bg-skeleton-subtle);
       }
     }
 
@@ -404,7 +394,7 @@
     border-radius: @border-radius-middle;
 
     .ald-radio-icon-button-wrapper-filled {
-      border-radius: var(--alias-radius-50, 4px) !important ;
+      border-radius: var(--alias-radius-50) !important ;
     }
 
     .ald-radio-label {
@@ -462,7 +452,7 @@
     }
 
     .ald-radio-icon-button-wrapper-filled {
-      border-radius: var(--alias-radius-25, 2px) !important ;
+      border-radius: var(--alias-radius-25) !important ;
     }
 
     .ald-radio-label.ald-radio-button-wrapper-filled {
@@ -527,7 +517,7 @@
     border-radius: @border-radius-large;
 
     .ald-radio-icon-button-wrapper-filled {
-      border-radius: var(--alias-radius-75, 6px) !important ;
+      border-radius: var(--alias-radius-75) !important ;
     }
 
     .ald-radio-label.ald-radio-button-wrapper-filled {
@@ -597,17 +587,17 @@
 .ald-radio-group-filled {
   display: flex;
   gap: 2px;
-  background: var(--alias-colors-bg-skeleton-strong, #f3f4f6);
+  background: var(--alias-colors-bg-skeleton-strong);
   padding: 0 2px;
   width: min-content;
 
   .ald-radio-label:not(.ald-radio-wrapper-disabled) {
     &:not(.ald-radio-wrapper-checked):hover {
-      background: var(--alias-colors-bg-interaction-hover, rgba(0, 0, 0, 0.05));
+      background: var(--alias-colors-bg-interaction-hover);
     }
 
     &:active {
-      background: var(--alias-colors-bg-interaction-press, rgba(0, 0, 0, 0.1));
+      background: var(--alias-colors-bg-interaction-press);
     }
   }
 }

package/dist/RenameInput/style/index.less

@@ -33,14 +33,14 @@
     'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
 
   &:hover {
-    border: 1px solid var(--alias-colors-border-strong, #d1d5db);
+    border: 1px solid var(--border-neutral-strong);
     margin-left: -1px;
     margin-right: 1px;
   }
 
   &:focus {
-    border: 1px solid var(--alias-colors-border-selected, #126fdd);
-    box-shadow: 0 0 0 1px #126fdd;
+    border: 1px solid var(--interaction-border-selected);
+    box-shadow: 0 0 0 1px var(--interaction-focus-default);
     margin-left: -1px;
     margin-right: 1px;
   }

package/dist/Result/index.js

@@ -11,22 +11,23 @@ import unauthorized from "./unauthorized";
 export var IconMap = {
   success: /*#__PURE__*/React.createElement(CheckCircleDuotone, {
     size: 80,
-    color: "#16B667",
-    fill: "#FFFFFF"
+    fill: 'var(--content-inverted-primary)',
+    color: 'var(--non-semantic-background-green-strong)'
   }),
   error: /*#__PURE__*/React.createElement(CancelCircleDuotone, {
     size: 80,
-    color: "#D64343",
-    fill: "#FFFFFF"
+    fill: 'var(--content-inverted-primary)',
+    color: 'var(--non-semantic-background-red-strong)'
   }),
   info: /*#__PURE__*/React.createElement(InfoCircleLine, {
     size: 80,
-    color: "#3271C9"
+    fill: 'var(--content-inverted-primary)',
+    color: 'var(--non-semantic-background-blue-strong)'
   }),
   warning: /*#__PURE__*/React.createElement(AlertTriangleDuotone, {
     size: 80,
-    color: "#FFB01F",
-    fill: "#FFFFFF"
+    fill: 'var(--content-inverted-primary)',
+    color: 'var(--non-semantic-background-orange-strong)'
   })
 };
 export var ExceptionMap = {

package/dist/Result/style/index.less

@@ -21,7 +21,7 @@
   }
 
   .ald-result-title {
-    color: var(--colors-gray-900, #171717);
+    color: var(--content-primary);
     text-align: center;
     font-size: 16px;
     font-style: normal;
@@ -30,7 +30,7 @@
   }
 
   .ald-result-subtitle {
-    color: var(--colors-gray-700, #858585);
+    color: var(--content-secondary);
     text-align: center;
     font-size: 13px;
     font-style: normal;
@@ -61,7 +61,7 @@
     width: 50%;
 
     .ald-result-title {
-      color: #171717;
+      color: var(--content-primary);
       font-size: 48px;
       font-weight: 600;
       line-height: 56px;
@@ -69,7 +69,7 @@
     }
 
     .ald-result-subtitle {
-      color: var(--colors-gray-700, #858585);
+      color: var(--content-secondary);
       font-size: 16px;
       font-style: normal;
       font-weight: 400;

package/dist/ScrollArea/style/index.less

@@ -30,7 +30,7 @@
   // 滚动条可拖动条
   .ald-scroll-area-thumb {
     flex: 1;
-    background: #575757;
+    background: var(--alias-colors-icon-subtle);
     border-radius: var(--scrollbar-size);
     position: relative;
     opacity: 0.2;

package/dist/Select/index.js

@@ -454,7 +454,7 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
     dropdownStyle: dropdownStyle || defaultDropdownStyle,
     clearIcon: /*#__PURE__*/React.createElement(TimesLightLine, {
       className: "ald-select-clear-icon",
-      color: "#9CA3AF"
+      color: "var(--alias-colors-icon-subtle)"
     }),
     style: {
       width: '100%'

package/dist/Select/style/emptyShowAll.less

@@ -2,7 +2,7 @@
   .ant-select {
     .ant-select-selector {
       .ant-select-selection-placeholder {
-        color: var(--alias-colors-text-default, #1f2937);
+        color: var(--alias-colors-text-default);
         font-weight: 500;
       }
     }

package/dist/Select/style/index.less

@@ -19,7 +19,7 @@
   border-style: solid;
 
   .ald-select-prefix {
-    color: var(--alias-colors-text-subtle, #4b5563);
+    color: var(--alias-colors-text-subtle);
     display: inline-flex;
     position: absolute;
     align-items: center;
@@ -115,8 +115,8 @@
                 display: flex;
                 align-items: center;
                 height: 16px;
-                padding: 0 var(--alias-spacing-50, 4px);
-                border-radius: var(--alias-radius-100, 8px);
+                padding: 0 var(--alias-spacing-50);
+                border-radius: var(--alias-radius-100);
                 font-size: 12px;
               }
             }
@@ -148,7 +148,7 @@
           .ant-select-selection-search-input {
             height: inherit;
             line-height: inherit;
-            caret-color: var(--alias-colors-text-selected, #126fdd);
+            caret-color: var(--alias-colors-text-selected);
           }
         }
       }
@@ -171,6 +171,6 @@
 .ald-select-clear-icon,
 .ald-select-suffix-icon {
   cursor: pointer;
-  color: var(--alias-colors-icon-subtle, #6b7280);
+  color: var(--alias-colors-icon-subtle);
   font-size: 16px;
 }

package/dist/Select/style/layout.less

@@ -37,7 +37,7 @@
         content: '';
         height: 14px;
         width: 1px;
-        background-color: var(--alias-colors-border-default, #e5e7eb);
+        background-color: var(--alias-colors-border-default);
       }
     }
   }

package/dist/Select/style/option.less

@@ -1,28 +1,25 @@
 @select-option-height: 36px;
 
 .ald-option {
-  padding: var(--alias-padding-100, 8px) var(--alias-padding-150, 12px);
+  padding: var(--alias-padding-100) var(--alias-padding-150);
   display: flex;
   height: @select-option-height;
   align-items: center;
   cursor: pointer;
-  color: var(--alias-colors-text-default, #1f2937);
-  gap: var(--alias-spacing-50, 4px);
+  color: var(--alias-colors-text-default);
+  gap: var(--alias-spacing-50);
   font-size: 14px;
   font-style: normal;
   font-weight: 400;
   line-height: 20px;
 
   &:hover {
-    background-color: var(
-      --alias-colors-bg-interaction-hover,
-      rgba(0, 0, 0, 0.05)
-    );
+    background-color: var(--alias-colors-bg-interaction-hover);
   }
 
   &.ald-option-disabled {
-    background-color: var(--alias-colors-bg-skeleton-subtler, #fff);
-    color: var(--alias-colors-text-disabled, rgba(0, 0, 0, 0.25));
+    background-color: var(--alias-colors-bg-skeleton-subtler);
+    color: var(--alias-colors-text-disabled);
 
     &:hover {
       cursor: default;
@@ -30,7 +27,7 @@
   }
 
   &.ald-option-selected {
-    color: var(--alias-colors-text-selected, #126fdd);
+    color: var(--alias-colors-text-selected);
   }
 }
 

package/dist/Select/style/selectDropdown.less

@@ -2,15 +2,15 @@
 .ant-select-dropdown.ant-select-dropdown {
   padding-left: 0;
   padding-right: 0;
-  border-radius: var(--alias-radius-75, 6px);
+  border-radius: var(--alias-radius-75);
 
   &.ald-select-popup {
     // max-height: 264px;
     overflow-y: auto;
     overflow-y: overlay;
-    border: 1px solid var(--alias-colors-border-strong, #d1d5db);
-    background: var(--alias-colors-bg-skeleton-subtler, #fff);
-    box-shadow: 0 10px 18px -2px rgba(0, 0, 0, 0.08);
+    border: 1px solid var(--alias-colors-border-strong);
+    background: var(--alias-colors-bg-skeleton-subtler);
+    box-shadow: var(--elevation-bottom-bottom-lg);
     padding: 4px 0;
   }
 }

package/dist/Select/style/status.less

@@ -4,7 +4,7 @@
   color: @textColor;
 
   .ant-select-selection-placeholder {
-    color: var(--alias-colors-text-subtlest, #9ca3af);
+    color: var(--alias-colors-text-subtlest);
   }
 
   .ant-select-selection-item {
@@ -13,42 +13,39 @@
 }
 
 .ald-select.ald-select-primary {
-  .select-color(var(--alias-colors-border-accent-gray-subtle-default, #D1D5DB),var(--alias-colors-bg-skeleton-subtle, #F9FAFB),var(--alias-colors-text-default, #1f2937));
+  .select-color(var(--alias-colors-border-accent-gray-default),var(--background-neutral-on-subtle),var(--alias-colors-text-default));
 
   &.ald-select-multiple .ant-select {
     .ant-select-selector {
-      color: var(--alias-colors-text-selected, #126fdd);
+      color: var(--alias-colors-text-selected);
 
       .ant-select-selection-overflow-item-rest {
         .ant-select-selection-item-content {
-          background: var(
-            --alias-colors-bg-accent-blue-subtle-default,
-            #d4e7fd
-          );
-          color: var(--alias-colors-text-information, #0f59b1);
+          background: var(--action-primary-subtle-hover);
+          color: var(--alias-colors-text-information);
         }
       }
     }
   }
 
   &.ald-select-fitted {
-    .select-color(var(--alias-colors-border-accent-gray-subtle-default, #D1D5DB),var(--alias-colors-bg-skeleton-subtle, #F9FAFB),var(--alias-colors-text-default, #1f2937));
+    .select-color(var(--alias-colors-border-accent-gray-default),var(--background-neutral-on-subtle),var(--alias-colors-text-default));
   }
 
   &:hover {
-    .select-color(var(--alias-colors-border-accent-gray-subtle-hover, #9ca3af), var(--alias-colors-bg-accent-gray-subtler-default, #F9FAFB),var(--alias-colors-text-default, #1f2937));
+    .select-color(var(--alias-colors-border-accent-gray-strong), var(--background-neutral-on-subtle),var(--alias-colors-text-default));
   }
 
   &.ald-select-focused {
-    .select-color(var(--alias-colors-border-selected, #126fdd), var(--alias-colors-bg-accent-gray-subtler-default, #F9FAFB),var(--alias-colors-text-default, #1f2937));
+    .select-color(var(--alias-colors-border-selected), var(--background-neutral-on-subtle),var(--alias-colors-text-default));
   }
 
   &:active {
-    .select-color(var(--alias-colors-border-accent-gray-subtle-default, #D1D5DB),var(--alias-colors-bg-skeleton-strong, #F3F4F6),var(--alias-colors-text-default, #1f2937));
+    .select-color(var(--alias-colors-border-accent-gray-default),var(--background-neutral-muted),var(--alias-colors-text-default));
   }
 
   &.ald-select-disabled {
-    .select-color(var(--alias-colors-border-disabled, rgba(0, 0, 0, 0.1)),var(--alias-colors-bg-transp, rgba(0, 0, 0, 0)),var(--alias-colors-text-default, #1f2937));
+    .select-color(var(--alias-colors-border-disabled),var(--alias-colors-bg-transp),var(--alias-colors-text-default));
 
     cursor: default;
 
@@ -65,27 +62,27 @@
 
       .ant-select-arrow {
         .ald-select-suffix-icon {
-          color: var(--alias-colors-icon-disabled, rgba(0, 0, 0, 0.25));
+          color: var(--alias-colors-icon-disabled);
         }
       }
     }
   }
 
   &.ald-select-status-error {
-    .select-color(var(--alias-colors-border-danger, #DC2626),var(--alias-colors-bg-skeleton-subtle, #F9FAFB),var(--alias-colors-text-default, #1f2937));
+    .select-color(var(--alias-colors-border-danger),var(--background-neutral-on-subtle),var(--alias-colors-text-default));
   }
 }
 
 .ald-select {
   &.ald-select-secondary {
-    .select-color(var(--alias-colors-border-accent-gray-subtle-default, #D1D5DB),var(--alias-colors-bg-skeleton-subtler, #FFF),var(--alias-colors-text-default, #1f2937));
+    .select-color(var(--alias-colors-border-accent-gray-default),var(--alias-colors-bg-skeleton-subtler),var(--alias-colors-text-default));
 
     &.ald-select-multiple .ant-select {
       .ant-select-selector {
         .ant-select-selection-overflow-item-rest {
           .ant-select-selection-item-content {
             background: transparent;
-            color: var(--alias-colors-text-subtle, #4b5563);
+            color: var(--alias-colors-text-subtle);
             font-weight: 500;
             line-height: 16px;
           }
@@ -94,23 +91,23 @@
     }
 
     &.ald-select-fitted {
-      .select-color(var(--alias-colors-border-accent-gray-subtle-default, #D1D5DB),var(--alias-colors-bg-skeleton-subtler, #FFF),var(--alias-colors-text-default, #1f2937));
+      .select-color(var(--alias-colors-border-accent-gray-default),var(--alias-colors-bg-skeleton-subtler),var(--alias-colors-text-default));
     }
 
     &:hover {
-      .select-color(var(--alias-colors-border-accent-gray-subtle-hover, #9ca3af),var(--alias-colors-bg-skeleton-subtler, #FFF),var(--alias-colors-text-default, #1f2937));
+      .select-color(var(--alias-colors-border-accent-gray-strong),var(--alias-colors-bg-skeleton-subtler),var(--alias-colors-text-default));
     }
 
     &.ald-select-focused {
-      .select-color(var(--alias-colors-border-selected, #126fdd),var(--alias-colors-bg-skeleton-subtler, #FFF),var(--alias-colors-text-default, #1f2937));
+      .select-color(var(--alias-colors-border-selected),var(--alias-colors-bg-skeleton-subtler),var(--alias-colors-text-default));
     }
 
     &:active {
-      .select-color(var(--alias-colors-border-accent-gray-subtle-default, #D1D5DB),var(--alias-colors-bg-skeleton-subtler, #FFF),var(--alias-colors-text-default, #1f2937));
+      .select-color(var(--alias-colors-border-accent-gray-default),var(--alias-colors-bg-skeleton-subtler),var(--alias-colors-text-default));
     }
 
     &.ald-select-disabled {
-      .select-color(var(--alias-colors-border-disabled, rgba(0, 0, 0, 0.1)),var(--alias-colors-bg-transp, rgba(0, 0, 0, 0)),var(--alias-colors-text-default, #1f2937));
+      .select-color(var(--alias-colors-border-disabled),var(--alias-colors-bg-transp),var(--alias-colors-text-default));
 
       cursor: default;
 
@@ -127,7 +124,7 @@
 
         .ant-select-arrow {
           .ald-select-suffix-icon {
-            color: var(--alias-colors-icon-disabled, rgba(0, 0, 0, 0.25));
+            color: var(--alias-colors-icon-disabled);
           }
         }
       }
@@ -135,6 +132,6 @@
   }
 
   &.ald-select-status-error {
-    .select-color(var(--alias-colors-border-danger, #DC2626),var(--alias-colors-bg-skeleton-subtle, #F9FAFB),var(--alias-colors-text-default, #1f2937));
+    .select-color(var(--alias-colors-border-danger),var(--background-neutral-on-subtle),var(--alias-colors-text-default));
   }
 }

package/dist/Select/style/variables.less

@@ -5,7 +5,7 @@
 @select-border-radius-large: 8px;
 @select-font-size-large: 16px;
 @select-line-height-large: 24px;
-@select-padding-horizontal-large: var(--alias-padding-150-minus-1, 12px);
+@select-padding-horizontal-large: var(--alias-padding-150-minus-1);
 @selector-height-large: 34px;
 @selector-gap-large: 8px;
 @select-icon-use-width-large: 24px; //16+8
@@ -15,7 +15,7 @@
 @select-border-radius-middle: 6px;
 @select-font-size-middle: 14px;
 @select-line-height-middle: 20px;
-@select-padding-horizontal-middle: var(--alias-padding-150-minus-1, 12px);
+@select-padding-horizontal-middle: var(--alias-padding-150-minus-1);
 @selector-height-middle: 30px;
 @selector-gap-middle: 6px;
 @select-icon-use-width-middle: 22px; //16+6
@@ -25,7 +25,7 @@
 @select-border-radius-small: 4px;
 @select-font-size-small: 12px;
 @select-line-height-small: 16px;
-@select-padding-horizontal-small: var(--alias-padding-150-minus-1, 12px);
+@select-padding-horizontal-small: var(--alias-padding-150-minus-1);
 @selector-height-small: 26px;
 @selector-gap-small: 4px;
 @select-icon-use-width-small: 20px; //16+4

package/dist/Skeleton/style/index.less

@@ -2,27 +2,27 @@
 
 .ant-skeleton .ant-skeleton-content .ant-skeleton-title[class][class] {
   height: 16px;
-  border-radius: var(--alias-radius-75, 6px);
+  border-radius: var(--alias-radius-75);
   background: linear-gradient(
     90deg,
-    #f2f4f7 -0.95%,
-    #e5e7eb 24.29%,
-    #f2f4f7 48.47%,
-    #e5e7eb 69.5%,
-    #f2f4f7 96.32%
+    var(--alias-colors-bg-skeleton-subtle) -0.95%,
+    var(--alias-colors-bg-skeleton-strong) 24.29%,
+    var(--alias-colors-bg-skeleton-subtle) 48.47%,
+    var(--alias-colors-bg-skeleton-strong) 69.5%,
+    var(--alias-colors-bg-skeleton-subtle) 96.32%
   );
 }
 
 .ant-skeleton .ant-skeleton-content .ant-skeleton-paragraph[class][class] > li {
   height: 16px;
-  border-radius: var(--alias-radius-75, 6px);
+  border-radius: var(--alias-radius-75);
   background: linear-gradient(
     90deg,
-    #f2f4f7 -0.95%,
-    #e5e7eb 24.29%,
-    #f2f4f7 48.47%,
-    #e5e7eb 69.5%,
-    #f2f4f7 96.32%
+    var(--alias-colors-bg-skeleton-subtle) -0.95%,
+    var(--alias-colors-bg-skeleton-strong) 24.29%,
+    var(--alias-colors-bg-skeleton-subtle) 48.47%,
+    var(--alias-colors-bg-skeleton-strong) 69.5%,
+    var(--alias-colors-bg-skeleton-subtle) 96.32%
   );
 }
 
@@ -39,9 +39,9 @@
   .ant-skeleton-image {
   background: linear-gradient(
     90deg,
-    rgba(0, 0, 0, 0.06) 25%,
-    rgba(0, 0, 0, 0.15) 37%,
-    rgba(0, 0, 0, 0.06) 63%
+    var(--alias-colors-bg-skeleton-subtle) 25%,
+    var(--alias-colors-bg-skeleton-strong) 37%,
+    var(--alias-colors-bg-skeleton-subtle) 63%
   );
   background-size: 400% 100%;
   animation-name: ald-skeleton-loading;