@kdcloudjs/kdesign 1.6.13 → 1.6.15

package/dist/kdesign-complete.less

@@ -1115,6 +1115,10 @@
     padding: 0;
     min-width: auto;
 
+    .@{btn-prefix-cls}-iconWrapper-left {
+      margin-right: @btn-text-icon-margin-right;
+    }
+
     &:hover {
       color: @btn-text-g-text-color-hover;
     }
@@ -1415,6 +1419,7 @@
 @btn-large-padding-horizontal: var(~'@{button-custom-prefix}-spacing-padding-horizontal-large', 8px); // 大号 内间距 横向
 @btn-group-dropdown-item-horizontal: var(~'@{button-custom-prefix}-group-dropdown-item-horizonta', 12px);
 @btn-icon-padding-horizontal: var(~'@{button-custom-prefix}-icon-spacing-padding-horizontal', 4px);
+@btn-text-icon-margin-right: var(~'@{button-custom-prefix}-text-icon-spacing-margin-right', 4px);
 
 
 
@@ -1697,6 +1702,46 @@
       }
     }
   }
+
+  &-jump {
+    position: absolute;
+    top: 50%;
+    left: unset;
+    right: 16px;
+    transform: translateY(-50%);
+
+    &-left {
+      left: 16px;
+      right: unset;
+    }
+
+    &:not(.@{carousel-prefix-cls}-jump-disabled) {
+      cursor: pointer;
+    }
+
+    > *:first-child {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    &-icon {
+      font-size: 20px;
+      color: @carousel-jump-icon-color;
+
+      &:hover {
+        color: @carousel-jump-icon-color-hover;
+      }
+    }
+
+    &-disabled {
+      cursor: not-allowed;
+
+      .@{carousel-prefix-cls}-jump-icon:hover {
+        color: @carousel-jump-icon-color;
+      }
+    }
+  }
 }
 .vertical {
   display: flex;
@@ -1729,6 +1774,8 @@
 // color
 @carousel-dots-color-background: var(~'@{carousel-prefix}-dots-color-background', #D8D8D8); // 面板指示点的背景色
 @carousel-dots-color-background-active: var(~'@{carousel-prefix}-dots-color-hover', #666666); // 面板指示点的背景色
+@carousel-jump-icon-color: var(~'@{carousel-prefix}-jump-icon-color', #D9D9D9);
+@carousel-jump-icon-color-hover: var(~'@{carousel-prefix}-jump-icon-color-hover', #666666);
 
 // radius
 @carousel-dots-boder-radius: var(~'@{carousel-prefix}-dots-border-radius', 2px); // 面板指示点的圆角
@@ -2781,7 +2828,7 @@
       }
 
       &::placeholder {
-        color: @date-input-color-disabled;
+        color: @date-input-color-placeholder;
       }
     }
 
@@ -3643,7 +3690,7 @@
 @date-color-background-checked: var(~'@{date-picker-custom-prefix}-color-background-checked', @color-theme);
 @date-wrapper-color-background: var(~'@{date-picker-custom-prefix}-wrapper-color-background', @color-background);
 @date-input-color: var(~'@{date-picker-custom-prefix}-input-color', @color-text-primary);
-@date-input-color-placeholder: var(~'@{date-picker-custom-prefix}-input-color-placeholder', @color-text-secondary);
+@date-input-color-placeholder: var(~'@{date-picker-custom-prefix}-input-color-placeholder', #f2f2f2);
 @date-input-underline-color: var(~'@{date-picker-custom-prefix}-input-underline-color', #999);
 @date-input-color-border: var(~'@{date-picker-custom-prefix}-input-color-border', @color-border-strong);
 @date-input-color-disabled: var(~'@{date-picker-custom-prefix}-input-color-disabled', @color-disabled);
@@ -5012,260 +5059,263 @@
 @input-prefix-cls: ~'@{kd-prefix}-input';
 @wrapper-prefix-cls: ~'@{input-prefix-cls}-wrapper';
 
-
 textarea {
-	margin: 0;
-	padding: 0;
-    color: inherit;
-    font-size: inherit;
-    font-family: inherit;
-	line-height: inherit;
-	-webkit-appearance: none;
-	overflow: auto;
-    resize: vertical;
+  margin: 0;
+  padding: 0;
+  color: inherit;
+  font-size: inherit;
+  font-family: inherit;
+  line-height: inherit;
+  -webkit-appearance: none;
+  overflow: auto;
+  resize: vertical;
 }
 .@{input-prefix-cls} {
-	.input(@input-prefix-cls);
-	transition: border-color @transition-duration-inner;
-	&-countWrapper {
-		position: relative;
-		display: inline-block;
-		width: 100%;
-	}
-	&-textarea {
-		.input(@input-prefix-cls);
-		transition: border-color @transition-duration-inner;
-		max-width: 100%;
-		height: auto;
-		vertical-align: bottom;
-		&-mark{
-			position: absolute;
-			right: 0;
-			top: ~'calc(100% + 1px)';
-			z-index: 1;
-			color: @input-placeholder-color-inner;
-			font-size: @input-small-font-size-inner;
+  .input(@input-prefix-cls);
+  transition: border-color @transition-duration-inner;
+  &-countWrapper {
+    position: relative;
+    display: inline-block;
+    width: 100%;
+  }
+  &-textarea {
+    .input(@input-prefix-cls);
+    transition: border-color @transition-duration-inner;
+    max-width: 100%;
+    height: auto;
+    vertical-align: bottom;
+    &-mark {
+      position: absolute;
+      right: 0;
+      top: ~'calc(100% + 1px)';
+      z-index: 1;
+      color: @input-placeholder-color-inner;
+      font-size: @input-small-font-size-inner;
       line-height: 18px;
       background-color: #fff;
-		}
+    }
     &-mark-inner {
       top: auto;
       bottom: 5px;
       right: 8px;
     }
-	}
-	&-no-resize {
-		resize: none;
-	}
-	&-borderless {
-		border: 0;
-		padding-left: 0 !important;
-		&:focus{
-			border: 0;
-		}
-	}
-	&-underline {
-		border: none;
-		border-bottom: 1px solid @input-color-border;
-		border-radius: 0;
-		padding-left: 0 !important;
-	}
-	&-disabled {
-		background-color: @input-background-color-disabled-inner;
-		border-color: @input-border-color-disabled-inner;
+  }
+  &-no-resize {
+    resize: none;
+  }
+  &-borderless {
+    border: 0;
+    padding-left: 0 !important;
+    &:focus {
+      border: 0;
+    }
+  }
+  &-underline {
+    border: none;
+    border-bottom: 1px solid @input-color-border;
+    border-radius: 0;
+    padding-left: 0 !important;
+  }
+  &-disabled {
+    background-color: @input-background-color-disabled-inner;
+    border-color: @input-border-color-disabled-inner;
     color: @input-affix-color;
-		cursor: not-allowed;
-	}
-	&-underline&-disabled {
+    cursor: not-allowed;
+  }
+  &-underline&-disabled {
     color: @input-color-disabled-inner;
-		background-color: @input-background-color-inner;
-		border-color: @input-underline-border-color-disabled-inner;
-	}
-	&-size-small {
-		.input-size(@input-small-height-inner, @input-small-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
-	}
-	&-size-middle {
-		.input-size(@input-middle-height-inner, @input-middle-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
-	}
-	&-size-large {
-		.input-size(@input-large-height-inner, @input-large-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
-	}
-	&-wrapper {
-		.input(@wrapper-prefix-cls);
-		transition: border-color @transition-duration-inner;
-		display: inline-flex;
-		position: relative;
-		padding-top: 0 !important;
-		padding-bottom: 0 !important;
-		overflow: hidden;
-		.@{input-prefix-cls} {
-			border: none;
-			padding-left: 0;
-			padding-right: 0;
-			height: 100%;
-			&-suffix, &-prefix {
-				display: flex;
-				flex: 0;
-				align-items: center;
-				justify-content: center;
-				word-break: keep-all;
+    background-color: @input-background-color-inner;
+    border-color: @input-underline-border-color-disabled-inner;
+  }
+  &-size-small {
+    .input-size(@input-small-height-inner, @input-small-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
+  }
+  &-size-middle {
+    .input-size(@input-middle-height-inner, @input-middle-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
+  }
+  &-size-large {
+    .input-size(@input-large-height-inner, @input-large-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
+  }
+  &-wrapper {
+    padding-left: @input-wrapper-padding-left !important;
+    .input(@wrapper-prefix-cls);
+    transition: border-color @transition-duration-inner;
+    display: inline-flex;
+    position: relative;
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+    overflow: hidden;
+    .@{input-prefix-cls} {
+      border: none;
+      padding-left: @input-padding-left;
+      padding-right: 0;
+      height: 100%;
+      &-suffix,
+      &-prefix {
+        display: flex;
+        flex: 0;
+        align-items: center;
+        justify-content: center;
+        word-break: keep-all;
         color: @input-affix-color;
-			}
-			&-suffix {
-				margin-left: 4px;
-			}
-			&-prefix {
-				margin-right: 4px;
-			}
-		}
-		&-size-small {
-			.input-size(@input-small-height-inner, @input-small-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
-		}
-		&-size-middle {
-			.input-size(@input-middle-height-inner, @input-middle-font-size-inner, @input-small-padding-vertical-inner, @input-middle-padding-horizontal-inner);
-		}
-		&-size-large {
-			.input-size(@input-large-height-inner, @input-large-font-size-inner, @input-small-padding-vertical-inner, @input-large-padding-horizontal-inner);
-		}
-		&-borderless {
-			.border-less;
-		}
-		&-underline {
-			.underline;
-		}
+      }
+      &-suffix {
+        margin-left: 4px;
+      }
+      &-prefix {
+        margin-right: 4px;
+      }
+    }
+    &-size-small {
+      .input-size(@input-small-height-inner, @input-small-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
+    }
+    &-size-middle {
+      .input-size(@input-middle-height-inner, @input-middle-font-size-inner, @input-small-padding-vertical-inner, @input-middle-padding-horizontal-inner);
+    }
+    &-size-large {
+      .input-size(@input-large-height-inner, @input-large-font-size-inner, @input-small-padding-vertical-inner, @input-large-padding-horizontal-inner);
+    }
+    &-borderless {
+      .border-less;
+    }
+    &-underline {
+      .underline;
+    }
 
-		&-focused {
-			border-color: @input-border-color-focused;
-		}
+    &-focused {
+      border-color: @input-border-color-focused;
+    }
 
     &-disabled {
       background-color: @input-background-color-disabled-inner;
       border-color: @input-border-color-disabled-inner;
       cursor: not-allowed;
 
-      .@{input-prefix-cls}-suffix, .@{input-prefix-cls}-prefix {
+      .@{input-prefix-cls}-suffix,
+      .@{input-prefix-cls}-prefix {
         color: @input-color-disabled-inner;
       }
     }
-	}
-	&-wrapper-textarea {
-		.input(@input-prefix-cls);
-		border: none !important;
-		padding: 0 !important;
-		position: relative;
-		display: inline-block;
-		.@{input-prefix-cls} {
-			&-textarea-clear-icon {
-				position: absolute;
+  }
+  &-wrapper-textarea {
+    .input(@input-prefix-cls);
+    border: none !important;
+    padding: 0 !important;
+    position: relative;
+    display: inline-block;
+    .@{input-prefix-cls} {
+      &-textarea-clear-icon {
+        position: absolute;
         z-index: 2;
-				right: 8px;
-				top: 3px;
-			}
-		}
-	}
-	&-clear-icon, &-textarea-clear-icon {
-		.input-clear-icon;
-	}
-	&-clear-icon-hidden {
-		visibility: hidden;
-	}
-	&-clear-icon-rightSpace {
-		margin-right: 4px;
-	}
+        right: 8px;
+        top: 3px;
+      }
+    }
+  }
+  &-clear-icon,
+  &-textarea-clear-icon {
+    .input-clear-icon;
+  }
+  &-clear-icon-hidden {
+    visibility: hidden;
+  }
+  &-clear-icon-rightSpace {
+    margin-right: 4px;
+  }
 
-	&-group-wrapper {
-		display: inline-block;
-		width: 100%;
-		text-align: start;
-		vertical-align: top;
-		.@{input-prefix-cls} {
-			&-group {
-				box-sizing: border-box;
-				margin: 0;
-				padding: 0;
-				color: rgba(0,0,0,.85);
-				font-size: 14px;
-				font-variant: tabular-nums;
-				// line-height: 1.5715;
-				list-style: none;
-				font-feature-settings: "tnum";
-				position: relative;
-				display: flex;
-				width: 100%;
-				border-collapse: separate;
-				border-spacing: 0;
-				& > .@{input-prefix-cls}-wrapper {
-					&:not(:first-child):not(:last-child) {
-						border-radius: 0;
-					}
-					&:first-child:not(:last-child) {
-						border-top-right-radius: 0;
-						border-bottom-right-radius: 0;
-					}
-					&:not(:first-child):last-child {
-						border-top-left-radius: 0;
-						border-bottom-left-radius: 0;
-					}
-				}
-				.@{input-prefix-cls}-group-addon {
-					position: relative;
-					color: @input-affix-color;
-					padding: 0 9px;
-					font-weight: 400;
-					font-size: 14px;
-					text-align: center;
-					border: 1px solid @input-border-color-disabled-inner;
-					border-radius: @input-border-radius-inner;
-					white-space: nowrap;
-					box-sizing: border-box;
-					display: flex;
-					align-items: center;
-					height: @input-middle-height-inner;
-					&:first-child {
-						border-top-right-radius: 0;
-						border-bottom-right-radius: 0;
-						border-right: none;
-					}
-					&:last-child {
-						border-top-left-radius: 0;
-						border-bottom-left-radius: 0;
-						border-left: none;
-					}
-
-					&-borderless {
-						.border-less;
-					}
-					&-underline {
-						.underline;
-					}
-					&-disabled {
-						background-color: @input-background-color-disabled-inner;
-						border-color: @input-border-color-disabled-inner;
+  &-group-wrapper {
+    display: inline-block;
+    width: 100%;
+    text-align: start;
+    vertical-align: top;
+    .@{input-prefix-cls} {
+      &-group {
+        box-sizing: border-box;
+        margin: 0;
+        padding: 0;
+        color: rgba(0, 0, 0, 0.85);
+        font-size: 14px;
+        font-variant: tabular-nums;
+        // line-height: 1.5715;
+        list-style: none;
+        font-feature-settings: 'tnum';
+        position: relative;
+        display: flex;
+        width: 100%;
+        border-collapse: separate;
+        border-spacing: 0;
+        & > .@{input-prefix-cls}-wrapper {
+          &:not(:first-child):not(:last-child) {
+            border-radius: 0;
+          }
+          &:first-child:not(:last-child) {
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
+          }
+          &:not(:first-child):last-child {
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
+          }
+        }
+        .@{input-prefix-cls}-group-addon {
+          position: relative;
+          color: @input-affix-color;
+          padding: 0 9px;
+          font-weight: 400;
+          font-size: 14px;
+          text-align: center;
+          border: 1px solid @input-border-color-disabled-inner;
+          border-radius: @input-border-radius-inner;
+          white-space: nowrap;
+          box-sizing: border-box;
+          display: flex;
+          align-items: center;
+          height: @input-middle-height-inner;
+          &:first-child {
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
+            border-right: none;
+          }
+          &:last-child {
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
+            border-left: none;
+          }
+
+          &-borderless {
+            .border-less;
+          }
+          &-underline {
+            .underline;
+          }
+          &-disabled {
+            background-color: @input-background-color-disabled-inner;
+            border-color: @input-border-color-disabled-inner;
             color: @input-color-disabled-inner;
-						cursor: not-allowed;
-					}
-				}
-			}
-			&-group-size-small {
-				.@{input-prefix-cls}-group-addon {
-					height: @input-small-height-inner;
-				}
-			}
-			&-group-middle-small {
-				.@{input-prefix-cls}-group-addon {
-					height: @input-middle-height-inner;
-				}
-			}
-			&-group-large-small {
-				.@{input-prefix-cls}-group-addon {
-					height: @input-large-height-inner;
-				}
-			}
-		}
-	}
-	&-allowClear-spacing {
-		padding-right: 20px;
-	}
+            cursor: not-allowed;
+          }
+        }
+      }
+      &-group-size-small {
+        .@{input-prefix-cls}-group-addon {
+          height: @input-small-height-inner;
+        }
+      }
+      &-group-middle-small {
+        .@{input-prefix-cls}-group-addon {
+          height: @input-middle-height-inner;
+        }
+      }
+      &-group-large-small {
+        .@{input-prefix-cls}-group-addon {
+          height: @input-large-height-inner;
+        }
+      }
+    }
+  }
+  &-allowClear-spacing {
+    padding-right: 20px;
+  }
 }
 
 
@@ -5345,7 +5395,6 @@ textarea {
 
 @input-prefix: '--@{kd-prefix}-c-input';
 
-
 // color
 @input-font-color-inner: var(~'@{input-prefix}-color-text', @color-text-primary);
 @input-placeholder-color-inner: var(~'@{input-prefix}-placeholder-color-text', @color-text-placeholder);
@@ -5353,10 +5402,16 @@ textarea {
 @input-clear-color: var(~'@{input-prefix}-clear-color', #d9d9d9);
 @input-clear-color-hover: var(~'@{input-prefix}-clear-color-hover', #999);
 @input-background-color-inner: var(~'@{input-prefix}-color-background', @color-white);
-@input-background-color-disabled-inner: var(~'@{input-prefix}-color-background-disabled', @color-background-contain-disabled);
+@input-background-color-disabled-inner: var(
+  ~'@{input-prefix}-color-background-disabled',
+  @color-background-contain-disabled
+);
 @input-border-color-focused: var(~'@{input-prefix}-color-border-focused', @color-theme);
 @input-border-color-disabled-inner: var(~'@{input-prefix}-color-border-disabled', @color-border-strong);
-@input-underline-border-color-disabled-inner: var(~'@{input-prefix}-underline-color-border-disabled', @color-border-weak);
+@input-underline-border-color-disabled-inner: var(
+  ~'@{input-prefix}-underline-color-border-disabled',
+  @color-border-weak
+);
 @input-color-disabled-inner: var(~'@{input-prefix}-color-disabled', @color-disabled);
 @input-affix-color: var(~'@{input-prefix}-affix-color-text', #666);
 
@@ -5376,6 +5431,8 @@ textarea {
 @input-middle-height-inner: var(~'@{input-prefix}-sizing-height-middle', 30px);
 @input-large-height-inner: var(~'@{input-prefix}-sizing-height-large', 36px);
 @input-border-width-inner: var(~'@{input-prefix}-sizing-border', 1px);
+@input-wrapper-padding-left: var(~'@{input-prefix}-wrapper-padding-left', 0px);
+@input-padding-left: var(~'@{input-prefix}-padding-left', 9px);
 
 // spacing
 @input-small-padding-vertical-inner: var(~'@{input-prefix}-spacing-padding-vertical-small', 3px);
@@ -5387,14 +5444,6 @@ textarea {
 
 
 
-
-
-
-
-
-
-
-
 @inputNumber-prefix-cls: ~'@{kd-prefix}-inputNumber';
 .@{inputNumber-prefix-cls} {
   &-baseStep {
@@ -6381,6 +6430,14 @@ textarea {
   &-container {
     position: relative;
     z-index: @modal-z-index-dialog;
+
+    &-show {
+      animation: kdModalEffect calc(@transition-duration - 0.1s) @ease both;
+    }
+
+    &-hidden {
+      display: none
+    }
   }
   &-mask {
     .overlay(@modal-mask-color-background, 0);
@@ -8908,8 +8965,8 @@ textarea {
 
   &-bordered {
     border: 1px solid @select-border-g-color-border;
-    padding-left: 8px !important;
-    border-radius: 2px;
+    padding-left: @select-bordered !important;
+    border-radius: @select-border-radius-border;
     &:hover:not(.@{select-prefix-cls}-multiple-disabled):not(.@{select-prefix-cls}-single-disabled) {
       border: 1px solid @select-g-color-border-hover;
     }
@@ -8917,11 +8974,17 @@ textarea {
     .@{select-prefix-cls}-suffix {
       padding-right: 8px;
     }
+
+    &.@{select-prefix-cls}-single {
+      .@{select-prefix-cls}-selection-search {
+        left: @select-bordered;
+      }
+    }
   }
 
   &-wrapper {
     transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
-    padding: 1px 28px 1px 0;
+    padding: @select-wrapper-padding;
     max-width: 100%;
     color: #212121;
     display: flex;
@@ -9335,20 +9398,25 @@ textarea {
 @select-middle-font-size: var(~'@{select-custom-prefix}-font-size-middle', 14px); // 中号高度
 @select-small-font-size: var(~'@{select-custom-prefix}-font-size-small', 12px); // 小号高度
 
+// line-height
+@select-dropdown-line-height: var(~'@{select-custom-prefix}-dropdown-line-height', 22px);
+@select-large-line-height: var(~'@{select-custom-prefix}-line-height-large', 28px);
+@select-middle-line-height: var(~'@{select-custom-prefix}-line-height-middle', 22px);
+@select-small-line-height: var(~'@{select-custom-prefix}-line-height-small', 14px);
+
 // sizing
 @select-dropdown-height: var(~'@{select-custom-prefix}-item-sizing-height', 22px);
 @select-large-height: var(~'@{select-custom-prefix}-sizing-height-large', 36px); // 大号高度 lh:28px
 @select-middle-height: var(~'@{select-custom-prefix}-sizing-height-middle', 30px); // 中号高度lh:22px
 @select-small-height: var(~'@{select-custom-prefix}-sizing-height-small', 24px); // 小号高度lh:12px
 
-// line-height
-@select-dropdown-line-height: var(~'@{select-custom-prefix}-dropdown-line-height', 22px);
-@select-large-line-height: var(~'@{select-custom-prefix}-line-height-large', 28px);
-@select-middle-line-height: var(~'@{select-custom-prefix}-line-height-middle', 22px);
-@select-small-line-height: var(~'@{select-custom-prefix}-line-height-small', 14px);
+// spacing
+@select-bordered: var(~'@{select-custom-prefix}-bordered-spacing-padding-left', 8px);
+@select-wrapper-padding: var(~'@{select-custom-prefix}-wrapper-spacing-padding', 1px 28px 1px 0);
 
 // radius
 @select-g-radius-border: var(~'@{select-custom-prefix}-radius-border', @radius-border);
+@select-border-radius-border: var(~'@{select-custom-prefix}-bordered-radius-border', 2px);
 
 // z-index
 @select-z-index: var(~'@{select-custom-prefix}-z-index', @z-index-popper);
@@ -10598,6 +10666,15 @@ textarea {
     opacity: 0;
   }
 }
+
+@keyframes kdModalEffect {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
 .slide-motion(@className, @keyframeName, @componentName, @duration: calc(@transition-duration - 0.1s)) {
   .@{className} {
     .@{componentName}&-active {