@aloudata/aloudata-design 2.18.3 → 2.19.0-beta.1

package/dist/Icon/svg/Loading-duotone.svg

@@ -1,6 +1,7 @@
 <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g id=" Icon / Duotone / Interface / Loading-duotone">
-<path id="Icon" opacity="0.16" fill-rule="evenodd" clip-rule="evenodd" d="M3.33332 9.9999C3.33332 6.318 6.31809 3.33323 9.99999 3.33323C13.6815 3.33323 16.666 6.31735 16.6667 9.9987C16.6673 9.53901 17.0402 9.16656 17.5 9.16656C17.9602 9.16656 18.3333 9.53966 18.3333 9.9999C18.3333 11.0942 18.1178 12.1779 17.699 13.1889C17.2802 14.2 16.6664 15.1186 15.8925 15.8925C15.1187 16.6663 14.2001 17.2801 13.189 17.6989C12.178 18.1177 11.0943 18.3332 9.99999 18.3332C9.53975 18.3332 9.16666 17.9601 9.16666 17.4999C9.16666 17.0397 9.53975 16.6666 9.99999 16.6666C6.31809 16.6666 3.33332 13.6818 3.33332 9.9999ZM14.6961 14.7318C14.7021 14.7258 14.7081 14.7199 14.714 14.7139C14.72 14.708 14.7259 14.702 14.7319 14.6961C14.72 14.708 14.7081 14.7199 14.6961 14.7318ZM9.99999 18.3332C14.6024 18.3332 18.3333 14.6023 18.3333 9.9999C18.3333 5.39753 14.6024 1.66656 9.99999 1.66656C5.39762 1.66656 1.66666 5.39753 1.66666 9.9999C1.66666 14.6023 5.39762 18.3332 9.99999 18.3332Z" fill="#6B7280"/>
-<path id="Icon_2" fill-rule="evenodd" clip-rule="evenodd" d="M17.5 9.16656C17.9602 9.16656 18.3333 9.53966 18.3333 9.9999C18.3333 11.0942 18.1178 12.1779 17.699 13.1889C17.2802 14.2 16.6664 15.1186 15.8925 15.8925C15.1187 16.6663 14.2001 17.2801 13.189 17.6989C12.178 18.1177 11.0943 18.3332 9.99999 18.3332C9.53975 18.3332 9.16666 17.9601 9.16666 17.4999C9.16666 17.0397 9.53975 16.6666 9.99999 16.6666C10.8755 16.6666 11.7424 16.4941 12.5512 16.1591C13.3601 15.8241 14.095 15.333 14.714 14.7139C15.3331 14.0949 15.8242 13.36 16.1592 12.5511C16.4942 11.7423 16.6667 10.8754 16.6667 9.9999C16.6667 9.53966 17.0398 9.16656 17.5 9.16656Z" fill="#6B7280"/>
+<path id="Icon" opacity="0.16" fill-rule="evenodd" clip-rule="evenodd" d="M3.33332 9.9999C3.33332 6.318 6.31809 3.33323 9.99999 3.33323C13.6815 3.33323 16.666 6.31735 16.6667 9.9987C16.6673 9.53901 17.0402 9.16656 17.5 9.16656C17.9602 9.16656 18.3333 9.53966 18.3333 9.9999C18.3333 11.0942 18.1178 12.1779 17.699 13.1889C17.2802 14.2 16.6664 15.1186 15.8925 15.8925C15.1187 16.6663 14.2001 17.2801 13.189 17.6989C12.178 18.1177 11.0943 18.3332 9.99999 18.3332C9.53975 18.3332 9.16666 17.9601 9.16666 17.4999C9.16666 17.0397 9.53975 16.6666 9.99999 16.6666C6.31809 16.6666 3.33332 13.6818 3.33332 9.9999ZM14.6961 14.7318C14.7021 14.7258 14.7081 14.7199 14.714 14.7139C14.72 14.708 14.7259 14.702 14.7319 14.6961C14.72 14.708 14.7081 14.7199 14.6961 14.7318ZM9.99999 18.3332C14.6024 18.3332 18.3333 14.6023 18.3333 9.9999C18.3333 5.39753 14.6024 1.66656 9.99999 1.66656C5.39762 1.66656 1.66666 5.39753 1.66666 9.9999C1.66666 14.6023 5.39762 18.3332 9.99999 18.3332Z" fill="black"/>
+<path id="Icon_2" fill-rule="evenodd" clip-rule="evenodd" d="M17.5 9.16656C17.9602 9.16656 18.3333 9.53966 18.3333 9.9999C18.3333 11.0942 18.1178 12.1779 17.699 13.1889C17.2802 14.2 16.6664 15.1186 15.8925 15.8925C15.1187 16.6663 14.2001 17.2801 13.189 17.6989C12.178 18.1177 11.0943 18.3332 9.99999 18.3332C9.53975 18.3332 9.16666 17.9601 9.16666 17.4999C9.16666 17.0397 9.53975 16.6666 9.99999 16.6666C10.8755 16.6666 11.7424 16.4941 12.5512 16.1591C13.3601 15.8241 14.095 15.333 14.714 14.7139C15.3331 14.0949 15.8242 13.36 16.1592 12.5511C16.4942 11.7423 16.6667 10.8754 16.6667 9.9999C16.6667 9.53966 17.0398 9.16656 17.5 9.16656Z" fill="black"/>
+
 </g>
 </svg>

package/dist/Icon/svg/Sort-Ascending-order-Color.svg

@@ -1,4 +1,5 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M15.2925 10C15.567 10 15.8168 9.85199 15.9332 9.62029C16.0496 9.3886 16.0117 9.11505 15.836 8.91852L12.5435 5.23719C12.409 5.08689 12.2099 5 12 5C11.7901 5 11.591 5.08689 11.4565 5.23719L8.16404 8.91851C7.98826 9.11504 7.95036 9.3886 8.06679 9.62029C8.18322 9.85199 8.43297 10 8.7075 10L15.2925 10Z" fill="#2986F4"/>
-<path d="M15.2925 14C15.567 14 15.8168 14.148 15.9332 14.3797C16.0496 14.6114 16.0117 14.885 15.836 15.0815L12.5435 18.7628C12.409 18.9131 12.2099 19 12 19C11.7901 19 11.591 18.9131 11.4565 18.7628L8.16404 15.0815C7.98826 14.885 7.95036 14.6114 8.06679 14.3797C8.18322 14.148 8.43296 14 8.70749 14H15.2925Z" fill="#6B7280"/>
+<path d="M15.2925 14C15.567 14 15.8168 14.148 15.9332 14.3797C16.0496 14.6114 16.0117 14.885 15.836 15.0815L12.5435 18.7628C12.409 18.9131 12.2099 19 12 19C11.7901 19 11.591 18.9131 11.4565 18.7628L8.16404 15.0815C7.98826 14.885 7.95036 14.6114 8.06679 14.3797C8.18322 14.148 8.43296 14 8.70749 14H15.2925Z" fill="black"/>
+
 </svg>

package/dist/Icon/svg/Sort-Color.svg

@@ -1,4 +1,5 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M15.2925 10C15.567 10 15.8168 9.85199 15.9332 9.62029C16.0496 9.3886 16.0117 9.11505 15.836 8.91852L12.5435 5.23719C12.409 5.08689 12.2099 5 12 5C11.7901 5 11.591 5.08689 11.4565 5.23719L8.16404 8.91851C7.98826 9.11504 7.95036 9.3886 8.06679 9.62029C8.18322 9.85199 8.43297 10 8.7075 10L15.2925 10Z" fill="#6B7280"/>
-<path d="M15.2925 14C15.567 14 15.8168 14.148 15.9332 14.3797C16.0496 14.6114 16.0117 14.885 15.836 15.0815L12.5435 18.7628C12.409 18.9131 12.2099 19 12 19C11.7901 19 11.591 18.9131 11.4565 18.7628L8.16404 15.0815C7.98826 14.885 7.95036 14.6114 8.06679 14.3797C8.18322 14.148 8.43296 14 8.70749 14H15.2925Z" fill="#6B7280"/>
+<path d="M15.2925 10C15.567 10 15.8168 9.85199 15.9332 9.62029C16.0496 9.3886 16.0117 9.11505 15.836 8.91852L12.5435 5.23719C12.409 5.08689 12.2099 5 12 5C11.7901 5 11.591 5.08689 11.4565 5.23719L8.16404 8.91851C7.98826 9.11504 7.95036 9.3886 8.06679 9.62029C8.18322 9.85199 8.43297 10 8.7075 10L15.2925 10Z" fill="black"/>
+<path d="M15.2925 14C15.567 14 15.8168 14.148 15.9332 14.3797C16.0496 14.6114 16.0117 14.885 15.836 15.0815L12.5435 18.7628C12.409 18.9131 12.2099 19 12 19C11.7901 19 11.591 18.9131 11.4565 18.7628L8.16404 15.0815C7.98826 14.885 7.95036 14.6114 8.06679 14.3797C8.18322 14.148 8.43296 14 8.70749 14H15.2925Z" fill="black"/>
+
 </svg>

package/dist/Icon/svg/Sort-Descending-order-Color.svg

@@ -1,4 +1,5 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M15.2925 10C15.567 10 15.8168 9.85199 15.9332 9.62029C16.0496 9.3886 16.0117 9.11505 15.836 8.91852L12.5435 5.23719C12.409 5.08689 12.2099 5 12 5C11.7901 5 11.591 5.08689 11.4565 5.23719L8.16404 8.91851C7.98826 9.11504 7.95036 9.3886 8.06679 9.62029C8.18322 9.85199 8.43297 10 8.7075 10L15.2925 10Z" fill="#6B7280"/>
+<path d="M15.2925 10C15.567 10 15.8168 9.85199 15.9332 9.62029C16.0496 9.3886 16.0117 9.11505 15.836 8.91852L12.5435 5.23719C12.409 5.08689 12.2099 5 12 5C11.7901 5 11.591 5.08689 11.4565 5.23719L8.16404 8.91851C7.98826 9.11504 7.95036 9.3886 8.06679 9.62029C8.18322 9.85199 8.43297 10 8.7075 10L15.2925 10Z" fill="black"/>
+
 <path d="M15.2925 14C15.567 14 15.8168 14.148 15.9332 14.3797C16.0496 14.6114 16.0117 14.885 15.836 15.0815L12.5435 18.7628C12.409 18.9131 12.2099 19 12 19C11.7901 19 11.591 18.9131 11.4565 18.7628L8.16404 15.0815C7.98826 14.885 7.95036 14.6114 8.06679 14.3797C8.18322 14.148 8.43296 14 8.70749 14H15.2925Z" fill="#2986F4"/>
 </svg>

package/dist/Icon/svg/ellipsis.svg

@@ -1,5 +1,6 @@
 <svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g id=" Icon / Light / Interface / Menu Kebab Horizontal-light-line">
-<path id="Icon" fill-rule="evenodd" clip-rule="evenodd" d="M5.00837 10.3586C5.00837 9.89836 4.63528 9.52527 4.17504 9.52527H4.16671C3.70647 9.52527 3.33337 9.89836 3.33337 10.3586V10.3669C3.33337 10.8272 3.70647 11.2003 4.16671 11.2003H4.17504C4.63528 11.2003 5.00837 10.8272 5.00837 10.3669V10.3586ZM10.0084 9.52527C10.4686 9.52527 10.8417 9.89836 10.8417 10.3586V10.3669C10.8417 10.8272 10.4686 11.2003 10.0084 11.2003H10C9.5398 11.2003 9.16671 10.8272 9.16671 10.3669V10.3586C9.16671 9.89836 9.5398 9.52527 10 9.52527H10.0084ZM15.8417 9.52527C16.3019 9.52527 16.675 9.89836 16.675 10.3586V10.3669C16.675 10.8272 16.3019 11.2003 15.8417 11.2003H15.8334C15.3731 11.2003 15 10.8272 15 10.3669V10.3586C15 9.89836 15.3731 9.52527 15.8334 9.52527H15.8417Z" fill="#6B7280"/>
+<path id="Icon" fill-rule="evenodd" clip-rule="evenodd" d="M5.00837 10.3586C5.00837 9.89836 4.63528 9.52527 4.17504 9.52527H4.16671C3.70647 9.52527 3.33337 9.89836 3.33337 10.3586V10.3669C3.33337 10.8272 3.70647 11.2003 4.16671 11.2003H4.17504C4.63528 11.2003 5.00837 10.8272 5.00837 10.3669V10.3586ZM10.0084 9.52527C10.4686 9.52527 10.8417 9.89836 10.8417 10.3586V10.3669C10.8417 10.8272 10.4686 11.2003 10.0084 11.2003H10C9.5398 11.2003 9.16671 10.8272 9.16671 10.3669V10.3586C9.16671 9.89836 9.5398 9.52527 10 9.52527H10.0084ZM15.8417 9.52527C16.3019 9.52527 16.675 9.89836 16.675 10.3586V10.3669C16.675 10.8272 16.3019 11.2003 15.8417 11.2003H15.8334C15.3731 11.2003 15 10.8272 15 10.3669V10.3586C15 9.89836 15.3731 9.52527 15.8334 9.52527H15.8417Z" fill="black"/>
+
 </g>
 </svg>

package/dist/IconButton/style/index.less

@@ -11,9 +11,9 @@
 @icon-button-icon-size-middle: 20px;
 @icon-button-icon-size-small: 16px;
 // borderRadius size
-@icon-button-border-radius-large: var(--alias-radius-100, 8px);
-@icon-button-border-radius-middle: var(--alias-radius-75, 6px);
-@icon-button-border-radius-small: var(--alias-radius-50, 4px);
+@icon-button-border-radius-large: var(--alias-radius-100);
+@icon-button-border-radius-middle: var(--alias-radius-75);
+@icon-button-border-radius-small: var(--alias-radius-50);
 
 .ald-icon-button,
 .ald-icon-button-dropdown {
@@ -25,12 +25,12 @@
   text-align: center;
   vertical-align: middle;
   cursor: pointer;
-  background: var(--alias-colors-bg-transp, rgba(0, 0, 0, 0));
+  background: var(--global-transparent-transparent);
   border: 0;
   padding: 0;
   outline: 0;
   font-size: inherit;
-  color: var(--alias-colors-icon-subtle, rgb(107, 114, 128));
+  color: var(--alias-colors-icon-subtle);
   -webkit-tap-highlight-color: transparent;
   appearance: none;
   box-sizing: border-box;
@@ -38,36 +38,36 @@
   transition: background 0.3s;
 
   &:hover {
-    background: rgba(31, 41, 55, 0.1);
+    background: var(--action-ghost-hover);
   }
 
   &.ald-icon-button-focus {
-    background: rgba(31, 41, 55, 0.1);
+    background: var(--action-ghost-hover);
   }
 
   &.ant-dropdown-open {
-    background: rgba(31, 41, 55, 0.1);
+    background: var(--action-ghost-hover);
   }
 
   &:active {
     // mouse down
-    background: rgba(31, 41, 55, 0.05);
+    background: var(--action-ghost-active);
   }
 
   &-disabled {
-    color: var(--alias-colors-icon-disabled, rgba(0, 0, 0, 0.25));
+    color: var(--alias-colors-icon-disabled);
     cursor: default;
-    background-color: var(--alias-colors-bg-transp, rgba(0, 0, 0, 0));
+    background-color: var(--global-transparent-transparent);
     opacity: 0.5;
 
     .ald-icon {
-      color: var(--alias-colors-icon-disabled, rgba(0, 0, 0, 0.25));
+      color: var(--alias-colors-icon-disabled);
     }
 
     &:hover,
     &:active,
     &:focus {
-      background-color: var(--alias-colors-bg-transp, rgba(0, 0, 0, 0));
+      background-color: var(--global-transparent-transparent);
     }
   }
 
@@ -77,18 +77,18 @@
   }
 
   &.ald-icon-button-dark {
-    color: var(--alias-colors-text-inverse-default, rgba(255, 255, 255, 0.88));
+    color: var(--content-inverted-primary);
 
     &:hover {
-      background: rgba(255, 255, 255, 0.1);
+      background: var(--action-ghost-inverted-hover);
     }
 
     &.ant-dropdown-open {
-      background: rgba(255, 255, 255, 0.1);
+      background: var(--action-ghost-inverted-hover);
     }
 
     &:active {
-      background: rgba(255, 255, 255, 0.05);
+      background: var(--action-ghost-inverted-active);
     }
   }
 }

package/dist/Input/components/Input/index.js

@@ -54,7 +54,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (props, ref) {
     allowClear: allowClear ? {
       clearIcon: /*#__PURE__*/React.createElement(CloseCircleFill, {
         size: 16,
-        color: "#9CA3AF"
+        color: "var(--alias-colors-icon-subtle)"
       })
     } : undefined,
     spellCheck: false,

package/dist/Input/components/TextArea/index.js

@@ -34,7 +34,7 @@ export default /*#__PURE__*/React.forwardRef(function (props, ref) {
       clearIcon: /*#__PURE__*/React.createElement(IconButton, {
         size: "small",
         icon: /*#__PURE__*/React.createElement(CloseCircleFill, {
-          color: "#9CA3AF"
+          color: "var(--alias-colors-icon-subtle)"
         })
       })
     } : false,

package/dist/Input/style/index.less

@@ -9,5 +9,5 @@
 .ant-input-status-error:not(.ant-input-disabled):not(
     .ant-input-borderless
   ).ant-input.ant-input {
-  border-color: var(--alias-colors-border-danger, #dc2626);
+  border-color: var(--border-negative-strong);
 }

package/dist/Input/style/size.less

@@ -1,26 +1,26 @@
 // size===large
 @input-height-large: 36px;
-@input-padding-large: var(--alias-padding-75-minus-1, 6px)
-  var(--alias-padding-150-minus-1, 12px);
+@input-padding-large: var(--alias-padding-75-minus-1)
+  var(--alias-padding-150-minus-1);
 @input-font-size-large: 14px;
 @input-border-radius-large: 8px;
-@input-prefix-margin-right-large: var(--alias-spacing-100, 8px);
+@input-prefix-margin-right-large: var(--alias-spacing-100);
 @input-clear-icon-large: 20px;
 // size===middle
 @input-height-middle: 32px;
-@input-padding-middle: var(--alias-padding-75-minus-1, 6px)
-  var(--alias-padding-150-minus-1, 12px);
+@input-padding-middle: var(--alias-padding-75-minus-1)
+  var(--alias-padding-150-minus-1);
 @input-font-size-middle: 14px;
-@input-border-radius-middle: var(--alias-radius-75, 6px);
-@input-prefix-margin-right-middle: var(--alias-spacing-75, 6px);
+@input-border-radius-middle: var(--alias-radius-75);
+@input-prefix-margin-right-middle: var(--alias-spacing-75);
 @input-clear-icon-middle: 20px;
 // size===small
 @input-height-small: 28px;
-@input-padding-small: var(--alias-padding-75-minus-1, 6px)
-  var(--alias-padding-150-minus-1, 12px);
+@input-padding-small: var(--alias-padding-75-minus-1)
+  var(--alias-padding-150-minus-1);
 @input-font-size-small: 12px;
-@input-border-radius-small: var(--alias-radius-50, 4px);
-@input-prefix-margin-right-small: var(--alias-spacing-50, 4px);
+@input-border-radius-small: var(--alias-radius-50);
+@input-prefix-margin-right-small: var(--alias-spacing-50);
 @input-clear-icon-small: 20px;
 
 .ald-input-wrap {

package/dist/Input/style/status.less

@@ -1,42 +1,27 @@
 // 光标颜色
-@input-caret-color: var(
-  --alias-colors-border-accent-gray-stronger-default,
-  #4b5563
-);
+@input-caret-color: var(--interaction-border-hover);
 // color enabled
-@input-enabled-border-color: var(
-  --alias-colors-border-accent-gray-subtle-default,
-  #d1d5db
-);
-@input-enabled-bg-color: var(--alias-colors-bg-skeleton-subtler, #fff);
-@input-enabled-text-color: var(--alias-colors-text-default, #1f2937);
-@input-enabled-placeholder-color: var(--alias-colors-text-subtlest, #9ca3af);
+@input-enabled-border-color: var(--interaction-border-neutral-normal);
+@input-enabled-bg-color: var(--interaction-background-form-field);
+@input-enabled-text-color: var(--content-primary);
+@input-enabled-placeholder-color: var(--content-tertiary);
 // color hover
-@input-hover-border-color: var(
-  --alias-colors-border-accent-gray-subtle-hover,
-  #9ca3af
-);
-@input-hover-bg-color: var(--alias-colors-bg-skeleton-subtler, #fff);
-@input-hover-text-color: var(--alias-colors-text-default, #1f2937);
-@input-hover-placeholder-color: var(--alias-colors-text-subtlest, #9ca3af);
+@input-hover-border-color: var(--interaction-border-hover);
+@input-hover-bg-color: var(--interaction-background-form-field);
+@input-hover-text-color: var(--content-primary);
+@input-hover-placeholder-color: var(--content-tertiary);
 
 //color focus
-@input-focus-border-color: var(--alias-colors-border-selected, #126fdd);
-@input-focus-bg-color: var(--alias-colors-bg-skeleton-subtler, #fff);
-@input-focus-text-color: var(--alias-colors-text-default, #1f2937);
-@input-focus-placeholder-color: var(--alias-colors-text-subtlest, #9ca3af);
+@input-focus-border-color: var(--interaction-focus-default);
+@input-focus-bg-color: var(--interaction-background-form-field);
+@input-focus-text-color: var(--content-primary);
+@input-focus-placeholder-color: var(--content-tertiary);
 
 //color disabled
-@input-disabled-border-color: #d1d5db;
-@input-disabled-bg-color: #f3f4f6;
-@input-disabled-text-color: var(
-  --alias-colors-text-disabled,
-  rgba(0, 0, 0, 0.25)
-);
-@input-disabled-placeholder-color: var(
-  --alias-colors-text-disabled,
-  rgba(0, 0, 0, 0.25)
-);
+@input-disabled-border-color: var(--interaction-border-neutral-normal);
+@input-disabled-bg-color: var(--interaction-background-form-field);
+@input-disabled-text-color: var(--content-primary);
+@input-disabled-placeholder-color: var(--content-tertiary);
 
 .input-color(@border-color,@text-color,@bg-color,@placeholder-color) {
   border-color: @border-color;
@@ -67,7 +52,7 @@
     }
 
     &.ald-input-error {
-      border-color: #dc2626 !important;
+      border-color: var(--interaction-border-alert) !important;
     }
   }
   // 带有其他内容的输入框，比如带 allowClear图标、prefix、suffix、密码图标等。
@@ -94,17 +79,17 @@
     }
     // 前缀
     .ant-input-prefix {
-      color: var(--alias-colors-text-subtle, #4b5563);
+      color: var(--alias-colors-text-subtle);
     }
     // 后缀
     .ant-input-suffix {
       .ant-input-clear-icon {
-        color: var(--alias-colors-icon-subtle, #6b7280);
+        color: var(--alias-colors-icon-subtle);
       }
     }
 
     &.ald-input-error {
-      border-color: #dc2626 !important;
+      border-color: var(--interaction-border-alert) !important;
     }
   }
 }

package/dist/InputNumber/style/index.less

@@ -16,30 +16,27 @@
 @inputNumber-border-radius-small: 4px;
 @inputNumber-padding-small: 0 7px;
 
-//默认
-@inputNumber-bg-color: var(--alias-colors-bg-skeleton-subtler, #fff);
-@inputNumber-border-color: var(
-  --alias-colors-border-accent-gray-subtle-default,
-  #d1d5db
-);
-@inputNumber-color: var(--alias-colors-text-default, #1f2937);
-@inputNumber-wrapper-bg-color: @BG95;
+//默认 - 使用CSS变量映射
+@inputNumber-bg-color: var(--background-default);
+@inputNumber-border-color: var(--border-default);
+@inputNumber-color: var(--content-primary);
+@inputNumber-wrapper-bg-color: var(--background-neutral-subtle);
 //激活
-@inputNumber-active-bg-color: var(--alias-colors-bg-skeleton-subtler, #fff);
-@inputNumber-active-border-color: var(--alias-colors-border-selected, #126fdd);
+@inputNumber-active-bg-color: var(--background-default);
+@inputNumber-active-border-color: var(--interaction-border-selected);
 
 //disable
-@inputNumber-disabled-bg-color: #f3f4f6;
-@inputNumber-disabled-border-color: #d1d5db;
-@inputNumber-disabled-color: @NL40;
+@inputNumber-disabled-bg-color: var(--background-neutral-muted);
+@inputNumber-disabled-border-color: var(--border-default);
+@inputNumber-disabled-color: var(--content-secondary);
 //光标颜色
-@inputNumber-cursor-color: @B60;
+@inputNumber-cursor-color: var(--interaction-focus-default);
 
 //前后填充
-@inputNumber-addon-bg-color: #f8f8f8;
-@inputNumber-addon-color: #858585;
-@inputNumber-addon-border-color: @BG60;
-@inputNumber-addon-disable-color: #858585;
+@inputNumber-addon-bg-color: var(--background-neutral-subtle);
+@inputNumber-addon-color: var(--content-secondary);
+@inputNumber-addon-border-color: var(--border-default);
+@inputNumber-addon-disable-color: var(--content-secondary);
 
 .ald-input-number {
   &.ant-input-number {
@@ -69,20 +66,20 @@
       }
 
       .ant-input-number-handler {
-        background-color: @BG100;
+        background-color: var(--background-neutral-subtle);
 
         .ant-input-number-handler-up-inner,
         .ant-input-number-handler-down-inner {
-          color: @NL40;
+          color: var(--content-secondary);
         }
 
         &:hover,
         &:active {
-          background-color: @BG100;
+          background-color: var(--background-neutral-subtle);
 
           .ant-input-number-handler-up-inner,
           .ant-input-number-handler-down-inner {
-            color: @NL40;
+            color: var(--content-secondary);
           }
         }
       }
@@ -93,12 +90,12 @@
 
       .ant-input-number-handler-up:hover {
         height: 50% !important; // antd中就是 !important写法，这里做覆盖
-        background: @BG80;
+        background: var(--action-ghost-hover);
       }
 
       .ant-input-number-handler-down:hover {
         height: 50% !important; // 这里的!important同上
-        background: @BG80;
+        background: var(--action-ghost-hover);
       }
     }
 
@@ -283,5 +280,5 @@
 .ant-input-number-status-error:not(.ant-input-number-disabled):not(
     .ant-input-number-borderless
   ).ant-input-number.ant-input-number {
-  border-color: @error-color;
+  border-color: var(--border-negative-strong);
 }

package/dist/InputSearch/style/index.less

@@ -4,11 +4,11 @@
 .ald-input-search {
   .ald-input.ald-input.ant-input-affix-wrapper {
     width: var(--init-width) !important;
-    background-color: var(--alias-colors-bg-skeleton-subtle, #f9fafb);
+    background-color: var(--background-neutral-subtle);
     cursor: pointer;
 
     input {
-      background-color: var(--alias-colors-bg-skeleton-subtle, #f9fafb);
+      background-color: var(--background-neutral-subtle);
     }
 
     .ant-input-suffix {
@@ -31,10 +31,10 @@
     }
 
     ::placeholder {
-      color: var(--alias-colors-text-default, #1f2937);
+      color: var(--content-primary);
       font-style: normal;
       font-weight: 500;
-      background-color: var(--alias-colors-bg-skeleton-subtle, #f9fafb);
+      background-color: var(--background-neutral-subtle);
     }
 
     &.ant-input-affix-wrapper-focused,
@@ -42,19 +42,19 @@
     &.input-search-has-value {
       width: 200px !important;
       transition: all 0.2s ease 0.1s !important;
-      background-color: var(--alias-colors-bg-skeleton-subtler, #fff);
+      background-color: var(--background-default);
 
       &.inputMode {
         width: 100% !important;
       }
 
       input {
-        background-color: #fff;
+        background-color: var(--background-default);
       }
 
       ::placeholder {
-        color: var(--alias-colors-text-subtlest, #9ca3af);
-        background-color: var(--alias-colors-bg-skeleton-subtler, #fff);
+        color: var(--content-tertiary);
+        background-color: var(--background-default);
         font-size: 14px;
         font-style: normal;
         font-weight: 400;

package/dist/List/style/index.less

@@ -14,10 +14,10 @@
 
   &-item {
     display: flex;
-    padding: var(--alias-padding-75, 6px) var(--alias-padding-100, 8px);
+    padding: var(--alias-padding-75) var(--alias-padding-100);
     align-items: center;
-    border-radius: var(--alias-radius-75, 6px);
-    gap: var(--alias-spacing-75, 6px);
+    border-radius: var(--alias-radius-75);
+    gap: var(--alias-spacing-75);
 
     &-prefix {
       display: flex;
@@ -31,7 +31,7 @@
       flex: 1;
       min-width: 0;
       display: flex;
-      gap: var(--alias-spacing-75, 6px);
+      gap: var(--alias-spacing-75);
       align-items: center;
 
       &-avatar {
@@ -47,7 +47,7 @@
         min-width: 0;
         display: flex;
         flex-direction: column;
-        gap: var(--alias-spacing-50, 4px);
+        gap: var(--alias-spacing-50);
         align-items: flex-start;
         justify-content: stretch;
 
@@ -73,21 +73,21 @@
           white-space: nowrap;
           text-overflow: ellipsis;
           max-width: 100%;
-          color: var(--alias-colors-text-subtlest, #9ca3af);
+          color: var(--alias-colors-text-subtlest);
         }
       }
     }
 
     &-action {
       display: flex;
-      gap: var(--alias-spacing-100, 8px);
+      gap: var(--alias-spacing-100);
       align-items: center;
     }
   }
 
   &-divider {
     height: 1px;
-    background-color: var(--alias-colors-border-subtle, #f3f4f6);
+    background-color: var(--alias-colors-border-subtle);
   }
 
   .ald-list-item-wrap {
@@ -99,17 +99,17 @@
 
 .ald-list-small {
   .ald-list-item {
-    gap: var(--alias-spacing-75, 6px);
+    gap: var(--alias-spacing-75);
 
     &-meta {
-      gap: var(--alias-spacing-75, 6px);
+      gap: var(--alias-spacing-75);
 
       &-avatar {
         padding: 2px 0;
       }
 
       &-content {
-        gap: var(--alias-spacing-25, 2px);
+        gap: var(--alias-spacing-25);
 
         &-title {
           font-size: 12px;

package/dist/LogicTree/style/DisplayLogicItem.less

@@ -14,7 +14,7 @@
 
     .ald-logic-tree-horizontal-line {
       position: absolute;
-      border-top: 1px solid #d1d5db;
+      border-top: 1px solid var(--border-default);
       top: 50%;
       width: @displayRecordLineWidth;
       left: -@displayRecordLineWidth;
@@ -29,14 +29,14 @@
     align-items: center;
     position: absolute;
     top: calc(50% - @displaySelectHeight / 2);
-    background-color: #fff;
+    background-color: var(--background-default);
     z-index: 1;
     left: 0;
   }
 
   .ald-logic-tree-logic-vertical-line {
     position: absolute;
-    border-left: 1px solid #d1d5db;
+    border-left: 1px solid var(--border-default);
     left: calc(@displaySelectWidth / 2);
   }
 }

package/dist/LogicTree/style/LoginItem.less

@@ -21,7 +21,7 @@
   &:hover {
     .ald-logic-tree-node-drag-icon,
     .ald-logic-tree-record-node-drag-icon {
-      background: #fff !important;
+      background: var(--background-default) !important;
     }
   }
 
@@ -35,11 +35,11 @@
   }
 
   &.is-dragging {
-    background: var(--alias-colors-bg-selected-default, #e8f2fe);
+    background: var(--background-informative-subtle);
 
     .ald-logic-tree-node-drag-icon,
     .ald-logic-tree-record-node-drag-icon {
-      background: var(--alias-colors-bg-selected-default, #e8f2fe) !important;
+      background: var(--background-informative-subtle) !important;
     }
   }
 
@@ -60,7 +60,7 @@
 
     .ald-logic-tree-horizontal-line {
       position: absolute;
-      border-top: 1px solid #d1d5db;
+      border-top: 1px solid var(--border-default);
       top: 50%;
       width: @recordLineWidth;
       left: -@recordLineWidth;
@@ -76,8 +76,8 @@
 
     .ald-logic-tree-left-bottom-dash-line {
       position: absolute;
-      border-bottom: 1px dashed #d1d5db;
-      border-left: 1px dashed #d1d5db;
+      border-bottom: 1px dashed var(--border-default);
+      border-left: 1px dashed var(--border-default);
       height: calc(50% - 16px);
       width: @recordLineWidth;
       top: calc(50% - 4px);
@@ -87,7 +87,7 @@
 
   .ald-logic-tree-logic-vertical-line {
     position: absolute;
-    border-left: 1px solid #d1d5db;
+    border-left: 1px solid var(--border-default);
     left: calc(@selectWidth / 2 + @dragIConWidth);
   }
 
@@ -97,7 +97,7 @@
     left: 16px;
     z-index: 1;
     width: @selectWidth !important;
-    background: #fff !important;
+    background: var(--background-default) !important;
 
     .ant-select-selector {
       padding-left: 8px !important;
@@ -139,10 +139,10 @@
     display: flex;
     align-items: center;
     border-radius: 6px;
-    background: var(--alias-colors-bg-selected-default, #e8f2fe);
+    background: var(--background-informative-subtle);
 
     .ald-logic-tree-record-node-drag-icon {
-      background: var(--alias-colors-bg-selected-default, #e8f2fe) !important;
+      background: var(--background-informative-subtle) !important;
     }
   }
 
@@ -161,7 +161,7 @@
     z-index: 10;
 
     .ald-logic-tree-record-node-drag-icon {
-      background-color: #fff;
+      background-color: var(--background-default);
     }
   }
 
@@ -187,7 +187,7 @@
   left: 16px;
   width: calc(100% - 16px);
   height: 2px;
-  background-color: #126fdd;
+  background-color: var(--action-primary-normal);
 }
 
 .ald-logic-tree-logic-node.is-hover-top:last-child::after,
@@ -198,7 +198,7 @@
   left: 16px;
   width: calc(100% - 16px);
   height: 2px;
-  background-color: #126fdd;
+  background-color: var(--action-primary-normal);
 }
 
 .ald-logic-tree-node-drag-icon-preview {