@fle-ui/next 1.0.5-alpha.5 → 1.0.5-alpha.6

package/lib/dropdown/style/index.css

@@ -2,6 +2,48 @@
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
 /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+html {
+  --ant-primary-color: #1890ff;
+  --ant-primary-color-hover: #40a9ff;
+  --ant-primary-color-active: #096dd9;
+  --ant-primary-color-outline: rgba(24, 144, 255, 0.2);
+  --ant-primary-1: #e6f7ff;
+  --ant-primary-2: #bae7ff;
+  --ant-primary-3: #91d5ff;
+  --ant-primary-4: #69c0ff;
+  --ant-primary-5: #40a9ff;
+  --ant-primary-6: #1890ff;
+  --ant-primary-7: #096dd9;
+  --ant-primary-color-deprecated-pure: ;
+  --ant-primary-color-deprecated-l-35: #cbe6ff;
+  --ant-primary-color-deprecated-l-20: #7ec1ff;
+  --ant-primary-color-deprecated-t-20: #46a6ff;
+  --ant-primary-color-deprecated-t-50: #8cc8ff;
+  --ant-primary-color-deprecated-f-12: rgba(24, 144, 255, 0.12);
+  --ant-primary-color-active-deprecated-f-30: rgba(230, 247, 255, 0.3);
+  --ant-primary-color-active-deprecated-d-02: #dcf4ff;
+  --ant-success-color: #36c626;
+  --ant-success-color-hover: #5cd44a;
+  --ant-success-color-active: #20a116;
+  --ant-success-color-outline: rgba(54, 198, 38, 0.2);
+  --ant-success-color-deprecated-bg: #f4fff0;
+  --ant-success-color-deprecated-border: #afed9f;
+  --ant-error-color: #ff5c57;
+  --ant-error-color-hover: #ff8880;
+  --ant-error-color-active: #d93f3f;
+  --ant-error-color-outline: rgba(255, 92, 87, 0.2);
+  --ant-error-color-deprecated-bg: #fff3f0;
+  --ant-error-color-deprecated-border: #ffd7d1;
+  --ant-warning-color: #ffab00;
+  --ant-warning-color-hover: #ffbf29;
+  --ant-warning-color-active: #d98900;
+  --ant-warning-color-outline: rgba(255, 171, 0, 0.2);
+  --ant-warning-color-deprecated-bg: #fffbe6;
+  --ant-warning-color-deprecated-border: #ffe07a;
+  --ant-info-color: #1890ff;
+  --ant-info-color-deprecated-bg: #e6f7ff;
+  --ant-info-color-deprecated-border: #91d5ff;
+}
 .ant-dropdown-menu-item.ant-dropdown-menu-item-danger {
   color: #f42d2d;
 }
@@ -69,7 +111,7 @@
   width: 11.3137085px;
   height: 11.3137085px;
   background: linear-gradient(135deg, transparent 40%, #fff 40%);
-  border-radius: 0 0 2px;
+  border-radius: 0 0 4px;
   pointer-events: none;
 }
 .ant-dropdown-arrow::before {
@@ -82,8 +124,8 @@
   background-repeat: no-repeat;
   background-position: -10px -10px;
   content: '';
-  -webkit-clip-path: path('M 9.849242404917499 24.091883092036785 A 5 5 0 0 1 13.384776310850237 22.627416997969522 L 20.627416997969522 22.627416997969522 A 2 2 0 0 0 22.627416997969522 20.627416997969522 L 22.627416997969522 13.384776310850237 A 5 5 0 0 1 24.091883092036785 9.849242404917499 L 23.091883092036785 9.849242404917499 L 9.849242404917499 23.091883092036785 Z');
-          clip-path: path('M 9.849242404917499 24.091883092036785 A 5 5 0 0 1 13.384776310850237 22.627416997969522 L 20.627416997969522 22.627416997969522 A 2 2 0 0 0 22.627416997969522 20.627416997969522 L 22.627416997969522 13.384776310850237 A 5 5 0 0 1 24.091883092036785 9.849242404917499 L 23.091883092036785 9.849242404917499 L 9.849242404917499 23.091883092036785 Z');
+  -webkit-clip-path: path('M 9.849242404917499 24.091883092036785 A 5 5 0 0 1 13.384776310850237 22.627416997969522 L 18.627416997969522 22.627416997969522 A 4 4 0 0 0 22.627416997969522 18.627416997969522 L 22.627416997969522 13.384776310850237 A 5 5 0 0 1 24.091883092036785 9.849242404917499 L 23.091883092036785 9.849242404917499 L 9.849242404917499 23.091883092036785 Z');
+          clip-path: path('M 9.849242404917499 24.091883092036785 A 5 5 0 0 1 13.384776310850237 22.627416997969522 L 18.627416997969522 22.627416997969522 A 4 4 0 0 0 22.627416997969522 18.627416997969522 L 22.627416997969522 13.384776310850237 A 5 5 0 0 1 24.091883092036785 9.849242404917499 L 23.091883092036785 9.849242404917499 L 9.849242404917499 23.091883092036785 Z');
 }
 .ant-dropdown-placement-top > .ant-dropdown-arrow,
 .ant-dropdown-placement-topLeft > .ant-dropdown-arrow,
@@ -194,7 +236,7 @@
 .ant-dropdown-menu-item-selected,
 .ant-dropdown-menu-submenu-title-selected {
   color: #2c68ff;
-  background-color: #f0f7ff;
+  background-color: var(--ant-primary-1);
 }
 .ant-dropdown-menu-item:hover,
 .ant-dropdown-menu-submenu-title:hover,

package/lib/empty/style/index.css

@@ -2,6 +2,48 @@
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
 /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+html {
+  --ant-primary-color: #1890ff;
+  --ant-primary-color-hover: #40a9ff;
+  --ant-primary-color-active: #096dd9;
+  --ant-primary-color-outline: rgba(24, 144, 255, 0.2);
+  --ant-primary-1: #e6f7ff;
+  --ant-primary-2: #bae7ff;
+  --ant-primary-3: #91d5ff;
+  --ant-primary-4: #69c0ff;
+  --ant-primary-5: #40a9ff;
+  --ant-primary-6: #1890ff;
+  --ant-primary-7: #096dd9;
+  --ant-primary-color-deprecated-pure: ;
+  --ant-primary-color-deprecated-l-35: #cbe6ff;
+  --ant-primary-color-deprecated-l-20: #7ec1ff;
+  --ant-primary-color-deprecated-t-20: #46a6ff;
+  --ant-primary-color-deprecated-t-50: #8cc8ff;
+  --ant-primary-color-deprecated-f-12: rgba(24, 144, 255, 0.12);
+  --ant-primary-color-active-deprecated-f-30: rgba(230, 247, 255, 0.3);
+  --ant-primary-color-active-deprecated-d-02: #dcf4ff;
+  --ant-success-color: #36c626;
+  --ant-success-color-hover: #5cd44a;
+  --ant-success-color-active: #20a116;
+  --ant-success-color-outline: rgba(54, 198, 38, 0.2);
+  --ant-success-color-deprecated-bg: #f4fff0;
+  --ant-success-color-deprecated-border: #afed9f;
+  --ant-error-color: #ff5c57;
+  --ant-error-color-hover: #ff8880;
+  --ant-error-color-active: #d93f3f;
+  --ant-error-color-outline: rgba(255, 92, 87, 0.2);
+  --ant-error-color-deprecated-bg: #fff3f0;
+  --ant-error-color-deprecated-border: #ffd7d1;
+  --ant-warning-color: #ffab00;
+  --ant-warning-color-hover: #ffbf29;
+  --ant-warning-color-active: #d98900;
+  --ant-warning-color-outline: rgba(255, 171, 0, 0.2);
+  --ant-warning-color-deprecated-bg: #fffbe6;
+  --ant-warning-color-deprecated-border: #ffe07a;
+  --ant-info-color: #1890ff;
+  --ant-info-color-deprecated-bg: #e6f7ff;
+  --ant-info-color-deprecated-border: #91d5ff;
+}
 .ant-empty {
   margin: 0 8px;
   font-size: 14px;

package/lib/form/style/index.css

@@ -2,6 +2,48 @@
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
 /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+html {
+  --ant-primary-color: #1890ff;
+  --ant-primary-color-hover: #40a9ff;
+  --ant-primary-color-active: #096dd9;
+  --ant-primary-color-outline: rgba(24, 144, 255, 0.2);
+  --ant-primary-1: #e6f7ff;
+  --ant-primary-2: #bae7ff;
+  --ant-primary-3: #91d5ff;
+  --ant-primary-4: #69c0ff;
+  --ant-primary-5: #40a9ff;
+  --ant-primary-6: #1890ff;
+  --ant-primary-7: #096dd9;
+  --ant-primary-color-deprecated-pure: ;
+  --ant-primary-color-deprecated-l-35: #cbe6ff;
+  --ant-primary-color-deprecated-l-20: #7ec1ff;
+  --ant-primary-color-deprecated-t-20: #46a6ff;
+  --ant-primary-color-deprecated-t-50: #8cc8ff;
+  --ant-primary-color-deprecated-f-12: rgba(24, 144, 255, 0.12);
+  --ant-primary-color-active-deprecated-f-30: rgba(230, 247, 255, 0.3);
+  --ant-primary-color-active-deprecated-d-02: #dcf4ff;
+  --ant-success-color: #36c626;
+  --ant-success-color-hover: #5cd44a;
+  --ant-success-color-active: #20a116;
+  --ant-success-color-outline: rgba(54, 198, 38, 0.2);
+  --ant-success-color-deprecated-bg: #f4fff0;
+  --ant-success-color-deprecated-border: #afed9f;
+  --ant-error-color: #ff5c57;
+  --ant-error-color-hover: #ff8880;
+  --ant-error-color-active: #d93f3f;
+  --ant-error-color-outline: rgba(255, 92, 87, 0.2);
+  --ant-error-color-deprecated-bg: #fff3f0;
+  --ant-error-color-deprecated-border: #ffd7d1;
+  --ant-warning-color: #ffab00;
+  --ant-warning-color-hover: #ffbf29;
+  --ant-warning-color-active: #d98900;
+  --ant-warning-color-outline: rgba(255, 171, 0, 0.2);
+  --ant-warning-color-deprecated-bg: #fffbe6;
+  --ant-warning-color-deprecated-border: #ffe07a;
+  --ant-info-color: #1890ff;
+  --ant-info-color-deprecated-bg: #e6f7ff;
+  --ant-info-color-deprecated-border: #91d5ff;
+}
 .ant-form-item .ant-input-number + .ant-form-text {
   margin-left: 8px;
 }
@@ -326,7 +368,7 @@
 .ant-form-item-label > label.ant-form-item-required:not(.ant-form-item-required-mark-optional)::before {
   display: inline-block;
   margin-right: 4px;
-  color: #ff4d4f;
+  color: #ff5c57;
   font-size: 14px;
   font-family: SimSun, sans-serif;
   line-height: 1;

package/lib/grid/style/index.css

@@ -2,6 +2,48 @@
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
 /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+html {
+  --ant-primary-color: #1890ff;
+  --ant-primary-color-hover: #40a9ff;
+  --ant-primary-color-active: #096dd9;
+  --ant-primary-color-outline: rgba(24, 144, 255, 0.2);
+  --ant-primary-1: #e6f7ff;
+  --ant-primary-2: #bae7ff;
+  --ant-primary-3: #91d5ff;
+  --ant-primary-4: #69c0ff;
+  --ant-primary-5: #40a9ff;
+  --ant-primary-6: #1890ff;
+  --ant-primary-7: #096dd9;
+  --ant-primary-color-deprecated-pure: ;
+  --ant-primary-color-deprecated-l-35: #cbe6ff;
+  --ant-primary-color-deprecated-l-20: #7ec1ff;
+  --ant-primary-color-deprecated-t-20: #46a6ff;
+  --ant-primary-color-deprecated-t-50: #8cc8ff;
+  --ant-primary-color-deprecated-f-12: rgba(24, 144, 255, 0.12);
+  --ant-primary-color-active-deprecated-f-30: rgba(230, 247, 255, 0.3);
+  --ant-primary-color-active-deprecated-d-02: #dcf4ff;
+  --ant-success-color: #36c626;
+  --ant-success-color-hover: #5cd44a;
+  --ant-success-color-active: #20a116;
+  --ant-success-color-outline: rgba(54, 198, 38, 0.2);
+  --ant-success-color-deprecated-bg: #f4fff0;
+  --ant-success-color-deprecated-border: #afed9f;
+  --ant-error-color: #ff5c57;
+  --ant-error-color-hover: #ff8880;
+  --ant-error-color-active: #d93f3f;
+  --ant-error-color-outline: rgba(255, 92, 87, 0.2);
+  --ant-error-color-deprecated-bg: #fff3f0;
+  --ant-error-color-deprecated-border: #ffd7d1;
+  --ant-warning-color: #ffab00;
+  --ant-warning-color-hover: #ffbf29;
+  --ant-warning-color-active: #d98900;
+  --ant-warning-color-outline: rgba(255, 171, 0, 0.2);
+  --ant-warning-color-deprecated-bg: #fffbe6;
+  --ant-warning-color-deprecated-border: #ffe07a;
+  --ant-info-color: #1890ff;
+  --ant-info-color-deprecated-bg: #e6f7ff;
+  --ant-info-color-deprecated-border: #91d5ff;
+}
 .ant-row {
   display: flex;
   flex-flow: row wrap;

package/lib/icon/style/index.css

@@ -2,3 +2,45 @@
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
 /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+html {
+  --ant-primary-color: #1890ff;
+  --ant-primary-color-hover: #40a9ff;
+  --ant-primary-color-active: #096dd9;
+  --ant-primary-color-outline: rgba(24, 144, 255, 0.2);
+  --ant-primary-1: #e6f7ff;
+  --ant-primary-2: #bae7ff;
+  --ant-primary-3: #91d5ff;
+  --ant-primary-4: #69c0ff;
+  --ant-primary-5: #40a9ff;
+  --ant-primary-6: #1890ff;
+  --ant-primary-7: #096dd9;
+  --ant-primary-color-deprecated-pure: ;
+  --ant-primary-color-deprecated-l-35: #cbe6ff;
+  --ant-primary-color-deprecated-l-20: #7ec1ff;
+  --ant-primary-color-deprecated-t-20: #46a6ff;
+  --ant-primary-color-deprecated-t-50: #8cc8ff;
+  --ant-primary-color-deprecated-f-12: rgba(24, 144, 255, 0.12);
+  --ant-primary-color-active-deprecated-f-30: rgba(230, 247, 255, 0.3);
+  --ant-primary-color-active-deprecated-d-02: #dcf4ff;
+  --ant-success-color: #36c626;
+  --ant-success-color-hover: #5cd44a;
+  --ant-success-color-active: #20a116;
+  --ant-success-color-outline: rgba(54, 198, 38, 0.2);
+  --ant-success-color-deprecated-bg: #f4fff0;
+  --ant-success-color-deprecated-border: #afed9f;
+  --ant-error-color: #ff5c57;
+  --ant-error-color-hover: #ff8880;
+  --ant-error-color-active: #d93f3f;
+  --ant-error-color-outline: rgba(255, 92, 87, 0.2);
+  --ant-error-color-deprecated-bg: #fff3f0;
+  --ant-error-color-deprecated-border: #ffd7d1;
+  --ant-warning-color: #ffab00;
+  --ant-warning-color-hover: #ffbf29;
+  --ant-warning-color-active: #d98900;
+  --ant-warning-color-outline: rgba(255, 171, 0, 0.2);
+  --ant-warning-color-deprecated-bg: #fffbe6;
+  --ant-warning-color-deprecated-border: #ffe07a;
+  --ant-info-color: #1890ff;
+  --ant-info-color-deprecated-bg: #e6f7ff;
+  --ant-info-color-deprecated-border: #91d5ff;
+}

package/lib/image/style/index.css

@@ -2,6 +2,48 @@
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
 /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+html {
+  --ant-primary-color: #1890ff;
+  --ant-primary-color-hover: #40a9ff;
+  --ant-primary-color-active: #096dd9;
+  --ant-primary-color-outline: rgba(24, 144, 255, 0.2);
+  --ant-primary-1: #e6f7ff;
+  --ant-primary-2: #bae7ff;
+  --ant-primary-3: #91d5ff;
+  --ant-primary-4: #69c0ff;
+  --ant-primary-5: #40a9ff;
+  --ant-primary-6: #1890ff;
+  --ant-primary-7: #096dd9;
+  --ant-primary-color-deprecated-pure: ;
+  --ant-primary-color-deprecated-l-35: #cbe6ff;
+  --ant-primary-color-deprecated-l-20: #7ec1ff;
+  --ant-primary-color-deprecated-t-20: #46a6ff;
+  --ant-primary-color-deprecated-t-50: #8cc8ff;
+  --ant-primary-color-deprecated-f-12: rgba(24, 144, 255, 0.12);
+  --ant-primary-color-active-deprecated-f-30: rgba(230, 247, 255, 0.3);
+  --ant-primary-color-active-deprecated-d-02: #dcf4ff;
+  --ant-success-color: #36c626;
+  --ant-success-color-hover: #5cd44a;
+  --ant-success-color-active: #20a116;
+  --ant-success-color-outline: rgba(54, 198, 38, 0.2);
+  --ant-success-color-deprecated-bg: #f4fff0;
+  --ant-success-color-deprecated-border: #afed9f;
+  --ant-error-color: #ff5c57;
+  --ant-error-color-hover: #ff8880;
+  --ant-error-color-active: #d93f3f;
+  --ant-error-color-outline: rgba(255, 92, 87, 0.2);
+  --ant-error-color-deprecated-bg: #fff3f0;
+  --ant-error-color-deprecated-border: #ffd7d1;
+  --ant-warning-color: #ffab00;
+  --ant-warning-color-hover: #ffbf29;
+  --ant-warning-color-active: #d98900;
+  --ant-warning-color-outline: rgba(255, 171, 0, 0.2);
+  --ant-warning-color-deprecated-bg: #fffbe6;
+  --ant-warning-color-deprecated-border: #ffe07a;
+  --ant-info-color: #1890ff;
+  --ant-info-color-deprecated-bg: #e6f7ff;
+  --ant-info-color-deprecated-border: #91d5ff;
+}
 .ant-image {
   position: relative;
   display: inline-block;

package/lib/input/style/index.css

@@ -2,6 +2,48 @@
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
 /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+html {
+  --ant-primary-color: #1890ff;
+  --ant-primary-color-hover: #40a9ff;
+  --ant-primary-color-active: #096dd9;
+  --ant-primary-color-outline: rgba(24, 144, 255, 0.2);
+  --ant-primary-1: #e6f7ff;
+  --ant-primary-2: #bae7ff;
+  --ant-primary-3: #91d5ff;
+  --ant-primary-4: #69c0ff;
+  --ant-primary-5: #40a9ff;
+  --ant-primary-6: #1890ff;
+  --ant-primary-7: #096dd9;
+  --ant-primary-color-deprecated-pure: ;
+  --ant-primary-color-deprecated-l-35: #cbe6ff;
+  --ant-primary-color-deprecated-l-20: #7ec1ff;
+  --ant-primary-color-deprecated-t-20: #46a6ff;
+  --ant-primary-color-deprecated-t-50: #8cc8ff;
+  --ant-primary-color-deprecated-f-12: rgba(24, 144, 255, 0.12);
+  --ant-primary-color-active-deprecated-f-30: rgba(230, 247, 255, 0.3);
+  --ant-primary-color-active-deprecated-d-02: #dcf4ff;
+  --ant-success-color: #36c626;
+  --ant-success-color-hover: #5cd44a;
+  --ant-success-color-active: #20a116;
+  --ant-success-color-outline: rgba(54, 198, 38, 0.2);
+  --ant-success-color-deprecated-bg: #f4fff0;
+  --ant-success-color-deprecated-border: #afed9f;
+  --ant-error-color: #ff5c57;
+  --ant-error-color-hover: #ff8880;
+  --ant-error-color-active: #d93f3f;
+  --ant-error-color-outline: rgba(255, 92, 87, 0.2);
+  --ant-error-color-deprecated-bg: #fff3f0;
+  --ant-error-color-deprecated-border: #ffd7d1;
+  --ant-warning-color: #ffab00;
+  --ant-warning-color-hover: #ffbf29;
+  --ant-warning-color-active: #d98900;
+  --ant-warning-color-outline: rgba(255, 171, 0, 0.2);
+  --ant-warning-color-deprecated-bg: #fffbe6;
+  --ant-warning-color-deprecated-border: #ffe07a;
+  --ant-info-color: #1890ff;
+  --ant-info-color-deprecated-bg: #e6f7ff;
+  --ant-info-color-deprecated-border: #91d5ff;
+}
 .ant-input-affix-wrapper {
   position: relative;
   display: inline-block;
@@ -44,7 +86,7 @@
   text-overflow: ellipsis;
 }
 .ant-input-affix-wrapper:hover {
-  border-color: #548aff;
+  border-color: var(--ant-primary-5);
   border-right-width: 1px;
 }
 .ant-input-rtl .ant-input-affix-wrapper:hover {
@@ -53,8 +95,8 @@
 }
 .ant-input-affix-wrapper:focus,
 .ant-input-affix-wrapper-focused {
-  border-color: #548aff;
-  box-shadow: 0 0 0 2px rgba(44, 104, 255, 0.2);
+  border-color: var(--ant-primary-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-primary-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -116,7 +158,7 @@ textarea.ant-input-affix-wrapper {
   direction: rtl;
 }
 .ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled):hover {
-  border-color: #548aff;
+  border-color: var(--ant-primary-5);
   border-right-width: 1px;
   z-index: 1;
 }
@@ -211,8 +253,8 @@ textarea.ant-input-affix-wrapper {
 }
 .ant-input-status-error:not(.ant-input-disabled):not(.ant-input-borderless).ant-input:focus,
 .ant-input-status-error:not(.ant-input-disabled):not(.ant-input-borderless).ant-input-focused {
-  border-color: #ff5c57;
-  box-shadow: 0 0 0 2px rgba(244, 45, 45, 0.2);
+  border-color: var(--ant-error-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-error-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -226,8 +268,8 @@ textarea.ant-input-affix-wrapper {
 }
 .ant-input-status-warning:not(.ant-input-disabled):not(.ant-input-borderless).ant-input:focus,
 .ant-input-status-warning:not(.ant-input-disabled):not(.ant-input-borderless).ant-input-focused {
-  border-color: #ffbf29;
-  box-shadow: 0 0 0 2px rgba(255, 171, 0, 0.2);
+  border-color: var(--ant-warning-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-warning-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -241,8 +283,8 @@ textarea.ant-input-affix-wrapper {
 }
 .ant-input-affix-wrapper-status-error:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper:focus,
 .ant-input-affix-wrapper-status-error:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper-focused {
-  border-color: #ff5c57;
-  box-shadow: 0 0 0 2px rgba(244, 45, 45, 0.2);
+  border-color: var(--ant-error-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-error-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -256,8 +298,8 @@ textarea.ant-input-affix-wrapper {
 }
 .ant-input-affix-wrapper-status-warning:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper:focus,
 .ant-input-affix-wrapper-status-warning:not(.ant-input-affix-wrapper-disabled):not(.ant-input-affix-wrapper-borderless).ant-input-affix-wrapper-focused {
-  border-color: #ffbf29;
-  box-shadow: 0 0 0 2px rgba(255, 171, 0, 0.2);
+  border-color: var(--ant-warning-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-warning-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -325,7 +367,7 @@ textarea.ant-input-affix-wrapper {
   text-overflow: ellipsis;
 }
 .ant-input:hover {
-  border-color: #548aff;
+  border-color: var(--ant-primary-5);
   border-right-width: 1px;
 }
 .ant-input-rtl .ant-input:hover {
@@ -334,8 +376,8 @@ textarea.ant-input-affix-wrapper {
 }
 .ant-input:focus,
 .ant-input-focused {
-  border-color: #548aff;
-  box-shadow: 0 0 0 2px rgba(44, 104, 255, 0.2);
+  border-color: var(--ant-primary-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-primary-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -754,11 +796,11 @@ textarea.ant-input {
 }
 .ant-input-search .ant-input:hover,
 .ant-input-search .ant-input:focus {
-  border-color: #548aff;
+  border-color: var(--ant-primary-5);
 }
 .ant-input-search .ant-input:hover + .ant-input-group-addon .ant-input-search-button:not(.ant-btn-primary),
 .ant-input-search .ant-input:focus + .ant-input-group-addon .ant-input-search-button:not(.ant-btn-primary) {
-  border-left-color: #548aff;
+  border-left-color: var(--ant-primary-5);
 }
 .ant-input-search .ant-input-affix-wrapper {
   border-radius: 0;
@@ -833,12 +875,12 @@ textarea.ant-input {
 }
 .ant-input-search-rtl .ant-input:hover + .ant-input-group-addon .ant-input-search-button:not(.ant-btn-primary),
 .ant-input-search-rtl .ant-input:focus + .ant-input-group-addon .ant-input-search-button:not(.ant-btn-primary) {
-  border-right-color: #548aff;
+  border-right-color: var(--ant-primary-5);
   border-left-color: #d2d2d2;
 }
 .ant-input-search-rtl > .ant-input-group > .ant-input-affix-wrapper:hover,
 .ant-input-search-rtl > .ant-input-group > .ant-input-affix-wrapper-focused {
-  border-right-color: #548aff;
+  border-right-color: var(--ant-primary-5);
 }
 .ant-input-search-rtl > .ant-input-group > .ant-input-group-addon {
   right: -1px;

package/lib/input-number/style/index.css

@@ -2,6 +2,48 @@
 /* stylelint-disable no-duplicate-selectors */
 /* stylelint-disable */
 /* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
+html {
+  --ant-primary-color: #1890ff;
+  --ant-primary-color-hover: #40a9ff;
+  --ant-primary-color-active: #096dd9;
+  --ant-primary-color-outline: rgba(24, 144, 255, 0.2);
+  --ant-primary-1: #e6f7ff;
+  --ant-primary-2: #bae7ff;
+  --ant-primary-3: #91d5ff;
+  --ant-primary-4: #69c0ff;
+  --ant-primary-5: #40a9ff;
+  --ant-primary-6: #1890ff;
+  --ant-primary-7: #096dd9;
+  --ant-primary-color-deprecated-pure: ;
+  --ant-primary-color-deprecated-l-35: #cbe6ff;
+  --ant-primary-color-deprecated-l-20: #7ec1ff;
+  --ant-primary-color-deprecated-t-20: #46a6ff;
+  --ant-primary-color-deprecated-t-50: #8cc8ff;
+  --ant-primary-color-deprecated-f-12: rgba(24, 144, 255, 0.12);
+  --ant-primary-color-active-deprecated-f-30: rgba(230, 247, 255, 0.3);
+  --ant-primary-color-active-deprecated-d-02: #dcf4ff;
+  --ant-success-color: #36c626;
+  --ant-success-color-hover: #5cd44a;
+  --ant-success-color-active: #20a116;
+  --ant-success-color-outline: rgba(54, 198, 38, 0.2);
+  --ant-success-color-deprecated-bg: #f4fff0;
+  --ant-success-color-deprecated-border: #afed9f;
+  --ant-error-color: #ff5c57;
+  --ant-error-color-hover: #ff8880;
+  --ant-error-color-active: #d93f3f;
+  --ant-error-color-outline: rgba(255, 92, 87, 0.2);
+  --ant-error-color-deprecated-bg: #fff3f0;
+  --ant-error-color-deprecated-border: #ffd7d1;
+  --ant-warning-color: #ffab00;
+  --ant-warning-color-hover: #ffbf29;
+  --ant-warning-color-active: #d98900;
+  --ant-warning-color-outline: rgba(255, 171, 0, 0.2);
+  --ant-warning-color-deprecated-bg: #fffbe6;
+  --ant-warning-color-deprecated-border: #ffe07a;
+  --ant-info-color: #1890ff;
+  --ant-info-color-deprecated-bg: #e6f7ff;
+  --ant-info-color-deprecated-border: #91d5ff;
+}
 .ant-input-number-affix-wrapper {
   display: inline-block;
   width: 100%;
@@ -48,13 +90,13 @@
   text-overflow: ellipsis;
 }
 .ant-input-number-affix-wrapper:hover {
-  border-color: #548aff;
+  border-color: var(--ant-primary-5);
   border-right-width: 1px;
 }
 .ant-input-number-affix-wrapper:focus,
 .ant-input-number-affix-wrapper-focused {
-  border-color: #548aff;
-  box-shadow: 0 0 0 2px rgba(44, 104, 255, 0.2);
+  border-color: var(--ant-primary-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-primary-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -108,7 +150,7 @@ textarea.ant-input-number-affix-wrapper {
   padding: 0px 7px;
 }
 .ant-input-number-affix-wrapper:not(.ant-input-number-affix-wrapper-disabled):hover {
-  border-color: #548aff;
+  border-color: var(--ant-primary-5);
   border-right-width: 1px;
   z-index: 1;
 }
@@ -168,8 +210,8 @@ textarea.ant-input-number-affix-wrapper {
 }
 .ant-input-number-status-error:not(.ant-input-number-disabled):not(.ant-input-number-borderless).ant-input-number:focus,
 .ant-input-number-status-error:not(.ant-input-number-disabled):not(.ant-input-number-borderless).ant-input-number-focused {
-  border-color: #ff5c57;
-  box-shadow: 0 0 0 2px rgba(244, 45, 45, 0.2);
+  border-color: var(--ant-error-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-error-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -183,8 +225,8 @@ textarea.ant-input-number-affix-wrapper {
 }
 .ant-input-number-status-warning:not(.ant-input-number-disabled):not(.ant-input-number-borderless).ant-input-number:focus,
 .ant-input-number-status-warning:not(.ant-input-number-disabled):not(.ant-input-number-borderless).ant-input-number-focused {
-  border-color: #ffbf29;
-  box-shadow: 0 0 0 2px rgba(255, 171, 0, 0.2);
+  border-color: var(--ant-warning-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-warning-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -198,8 +240,8 @@ textarea.ant-input-number-affix-wrapper {
 }
 .ant-input-number-affix-wrapper-status-error:not(.ant-input-number-affix-wrapper-disabled):not(.ant-input-number-affix-wrapper-borderless).ant-input-number-affix-wrapper:focus,
 .ant-input-number-affix-wrapper-status-error:not(.ant-input-number-affix-wrapper-disabled):not(.ant-input-number-affix-wrapper-borderless).ant-input-number-affix-wrapper-focused {
-  border-color: #ff5c57;
-  box-shadow: 0 0 0 2px rgba(244, 45, 45, 0.2);
+  border-color: var(--ant-error-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-error-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -213,8 +255,8 @@ textarea.ant-input-number-affix-wrapper {
 }
 .ant-input-number-affix-wrapper-status-warning:not(.ant-input-number-affix-wrapper-disabled):not(.ant-input-number-affix-wrapper-borderless).ant-input-number-affix-wrapper:focus,
 .ant-input-number-affix-wrapper-status-warning:not(.ant-input-number-affix-wrapper-disabled):not(.ant-input-number-affix-wrapper-borderless).ant-input-number-affix-wrapper-focused {
-  border-color: #ffbf29;
-  box-shadow: 0 0 0 2px rgba(255, 171, 0, 0.2);
+  border-color: var(--ant-warning-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-warning-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -277,13 +319,13 @@ textarea.ant-input-number-affix-wrapper {
   text-overflow: ellipsis;
 }
 .ant-input-number:hover {
-  border-color: #548aff;
+  border-color: var(--ant-primary-5);
   border-right-width: 1px;
 }
 .ant-input-number:focus,
 .ant-input-number-focused {
-  border-color: #548aff;
-  box-shadow: 0 0 0 2px rgba(44, 104, 255, 0.2);
+  border-color: var(--ant-primary-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-primary-color-outline);
   border-right-width: 1px;
   outline: 0;
 }
@@ -634,7 +676,7 @@ textarea.ant-input-number {
 }
 .ant-input-number-handler:hover .ant-input-number-handler-up-inner,
 .ant-input-number-handler:hover .ant-input-number-handler-down-inner {
-  color: #548aff;
+  color: var(--ant-primary-5);
 }
 .ant-input-number-handler-up-inner,
 .ant-input-number-handler-down-inner {
@@ -679,7 +721,7 @@ textarea.ant-input-number {
   display: block;
 }
 .ant-input-number:hover {
-  border-color: #548aff;
+  border-color: var(--ant-primary-5);
   border-right-width: 1px;
 }
 .ant-input-number:hover + .ant-form-item-children-icon {
@@ -687,8 +729,8 @@ textarea.ant-input-number {
   transition: opacity 0.24s linear 0.24s;
 }
 .ant-input-number-focused {
-  border-color: #548aff;
-  box-shadow: 0 0 0 2px rgba(44, 104, 255, 0.2);
+  border-color: var(--ant-primary-color-hover);
+  box-shadow: 0 0 0 2px var(--ant-primary-color-outline);
   border-right-width: 1px;
   outline: 0;
 }