@arco-themes/react-aiux2026 0.0.11 → 0.0.12

package/theme.less

@@ -1530,342 +1530,501 @@
   }
 // Button Icon
 .arco-btn-size-default {
-    svg.arco-icon {
-        font-size: 16px;
-    }
+  svg.arco-icon {
+    font-size: 16px;
+  }
 }
 .arco-btn-size-large {
-    svg.arco-icon {
-        font-size: 16px;
-    }
+  svg.arco-icon {
+    font-size: 16px;
+  }
 }
 .arco-btn-size-small {
-    svg.arco-icon {
-        font-size: 16px;
-    }
+  svg.arco-icon {
+    font-size: 16px;
+  }
 }
 
 .arco-btn-size-mini {
-    svg.arco-icon {
-        font-size: 14px;
-    }
+  svg.arco-icon {
+    font-size: 14px;
+  }
 }
 
 // Link
 .arco-link.arco-link-dark:not(:hover) {
-    color: var(--color-text-2);
+  color: var(--color-text-2);
 }
 
 // Table remove border
 .arco-table.arco-table-border {
-    .arco-table-container {
-        border-top: none;
-    }
+  .arco-table-container {
+    border-top: none;
+  }
 
-    thead>.arco-table-tr>.arco-table-th {
-        border: none;
-        border-bottom: 1px solid var(--color-border-2);
-    }
+  thead>.arco-table-tr>.arco-table-th {
+    border: none;
+    border-bottom: 1px solid var(--color-border-2);
+  }
 
-    .arco-table-td:first-child {
-        border-left: none;
-    }
+  .arco-table-td:first-child {
+    border-left: none;
+  }
 
-    .arco-table-container {
-        border-right: none;
-    }
+  .arco-table-container {
+    border-right: none;
+  }
 }
 
 // tooltip
 .arco-tooltip-content {
-    background-color: var(--color-bg-5);
-    color: var(--color-text-2);
-    border-width: 0 !important;
-    box-shadow: 0 4px 12px 2px rgba(0, 0, 0, 0.1);
-    padding: 8px 12px;
-    font-size: 12px;
-    border-radius: 4px;
-    line-height: 1.5715;
+  background-color: var(--color-bg-5);
+  color: var(--color-text-2);
+  border-width: 0 !important;
+  box-shadow: 0 4px 12px 2px rgba(0, 0, 0, 0.1);
+  padding: 8px 12px;
+  font-size: 12px;
+  border-radius: 4px;
+  line-height: 1.5715;
 }
 
 .arco-tooltip .arco-trigger-arrow {
-    z-index: 999;
+  z-index: 999;
 }
 
 .arco-trigger-arrow.arco-tooltip-arrow {
-    background-color: var(--color-bg-5);
+  background-color: var(--color-bg-5);
+}
+
+// Tree
+.arco-tree {
+  .arco-tree-node {
+    border-radius: 2px;
+
+    .arco-tree-node-switcher {
+      width: 24px;
+      margin-right: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    /*&:hover {
+      background-color: rgb(var(--primary-1));
+	  .arco-tree-node-indent {
+		background-color: var(--color-bg-1);
+	  }
+	  .arco-tree-node-switcher:empty {
+	    background-color: var(--color-bg-1);
+	  }
+    }*/
+
+    &:not(.arco-tree-node-disabled):active {
+      background-color: rgb(var(--primary-1));
+      color: rgb(var(--primary-6));
+    }
+  }
 }
 
 // Form required mark
 .arco-form-label-item .arco-form-item-symbol svg {
-    margin-top: 2px;
+  margin-top: 2px;
 }
 
 // Cascader Icon
-.arco-cascader.arco-cascader-size-default {
-    .arco-cascader-suffix {
-        svg.arco-icon {
-            font-size: 16px
-        }
+.arco-cascader {
+  .arco-cascader-suffix {
+    svg.arco-icon {
+      font-size: 16px
     }
+  }
+}
+.arco-cascader.arco-cascader-size-mini {
+  .arco-cascader-suffix {
+    svg.arco-icon {
+      font-size: 14px
+    }
+  }
+}
+.arco-cascader-popup {
+  border: 1px solid var(--color-border-2);
+  .arco-cascader-popup-inner {
+    .arco-cascader-list-column:not(:last-child) {
+	  border-right: 1px solid var(--color-border-2);
+	}
+  }
 }
 
 // Form Icon
 .arco-form.arco-form-size-default {
-    .arco-form-item-feedback {
-        svg.arco-icon {
-            font-size: 16px;
-        }
+  .arco-form-item-feedback {
+    svg.arco-icon {
+      font-size: 16px;
     }
+  }
+}
+.arco-form.arco-form-horizontal:has(.arco-form-item-symbol) {
+  .arco-form-label-item.arco-form-label-item-left:not(:has(.arco-form-item-symbol)) {
+    label {
+      margin-left: 16px;
+	}
+  }
 }
 
-// Input Icon
-.arco-input-inner-wrapper.arco-input-inner-wrapper-default {
+// Input
+.arco-input-group > :first-child.arco-input-inner-wrapper.arco-input-inner-wrapper-focus:not(:only-child) {
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.arco-input-group > .arco-input-inner-wrapper.arco-input-inner-wrapper-focus:not(:first-child):not(:last-child) {
+  border-radius: 0;
+}
+.arco-input-group > :last-child.arco-input-inner-wrapper.arco-input-inner-wrapper-focus:not(:only-child) {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
 
-    .arco-input-group-prefix>svg.arco-icon,
-    .arco-input-group-suffix>svg.arco-icon {
-        font-size: 16px;
-    }
+.arco-input-inner-wrapper,
+.arco-input-inner-wrapper.arco-input-inner-wrapper-large,
+.arco-input-inner-wrapper.arco-input-inner-wrapper-small {
+  .arco-input-group-prefix>svg.arco-icon,
+  .arco-input-group-suffix>svg.arco-icon {
+    font-size: 16px;
+  }
 }
 
-.arco-input-group-wrapper.arco-input-group-wrapper-default {
-    .arco-input-group-addafter>svg.arco-icon {
-        font-size: 16px;
-    }
+.arco-input-group-wrapper {
+  .arco-input-group-addafter>svg.arco-icon {
+    font-size: 16px;
+  }
 }
 
 .arco-input-inner-wrapper.arco-input-inner-wrapper-mini {
-
-    .arco-input-group-prefix>svg.arco-icon,
-    .arco-input-group-suffix>svg.arco-icon {
-        font-size: 14px;
-    }
+  .arco-input-group-prefix>svg.arco-icon,
+  .arco-input-group-suffix>svg.arco-icon {
+    font-size: 14px;
+  }
 }
 
 .arco-input-group-wrapper.arco-input-group-wrapper-mini {
-    .arco-input-group-addafter>svg.arco-icon {
-        font-size: 14px;
-    }
-}
-
-.arco-input-group-wrapper {
-    .arco-input-inner-wrapper.arco-input-inner-wrapper-focus {
-        border-top-left-radius: 0;
-        border-bottom-left-radius: 0;
-    }
+  .arco-input-group-addafter>svg.arco-icon {
+    font-size: 14px;
+  }
 }
 
 // DataPicker Icon
-.arco-picker.arco-picker-size-default {
-    .arco-picker-suffix>.arco-picker-suffix-icon>svg.arco-icon {
-        font-size: 16px;
+.arco-picker {
+  .arco-picker-suffix>.arco-picker-suffix-icon>svg.arco-icon {
+    font-size: 16px;
+  }
+}
+.arco-picker.arco-picker-size-mini {
+  .arco-picker-suffix>.arco-picker-suffix-icon>svg.arco-icon {
+    font-size: 14px;
+  }
+}
+.arco-picker {
+  .arco-picker-clear-icon {
+    svg {
+      font-size: 16px;
     }
+  }
+  &.arco-picker-size-mini {
+	.arco-picker-clear-icon {
+      svg {
+        font-size: 14px;
+      }
+    }
+  }
 }
 
 // TimePicker Icon
 .arco-picker.arco-picker-size-default.arco-picker-has-prefix {
-    .arco-picker-prefix {
-        display: flex;
-        align-items: center;
+  .arco-picker-prefix {
+    display: flex;
+    align-items: center;
 
-        svg.arco-icon {
-            font-size: 16px;
-        }
+    svg.arco-icon {
+      font-size: 16px;
     }
+  }
 
-    .arco-picker-suffix {
-        display: flex;
-        align-items: center;
-    }
+  .arco-picker-suffix {
+    display: flex;
+    align-items: center;
+  }
 }
 
 // TreeSelect
 .arco-tree-select {
-    &.arco-tree-select-size-default {
-        .arco-tree-select-suffix {
-            .arco-tree-select-arrow-icon>svg.arco-icon {
-                font-size: 16px;
-            }
-        }
+  .arco-tree-select-suffix {
+    .arco-tree-select-arrow-icon>svg.arco-icon {
+      font-size: 16px;
     }
+  }
 
-    &.arco-tree-select-size-mini {
-        .arco-tree-select-suffix {
-            .arco-tree-select-arrow-icon>svg.arco-icon {
-                font-size: 14px;
-            }
-        }
+  &.arco-tree-select-size-mini {
+    .arco-tree-select-suffix {
+      .arco-tree-select-arrow-icon>svg.arco-icon {
+        font-size: 14px;
+      }
     }
+  }
 }
 
-// InputTag Icon
-.arco-input-tag.arco-input-tag-size-default {
-    .arco-input-tag-tag>.arco-tag-close-btn>svg.arco-icon {
-        font-size: 16px;
-    }
+// InputTag
+.arco-tag .arco-icon-hover.arco-tag-icon-hover::before {
+  display: none;
 }
+.arco-input-tag:not(.arco-input-tag-disabled) {
+  .arco-tag .arco-tag-close-btn > svg  {
+    &:hover {
+      color: rgb(var(--primary-5));
+    }
 
-.arco-input-tag.arco-input-tag-size-small {
-    .arco-input-tag-tag>.arco-tag-close-btn>svg.arco-icon {
-        font-size: 14px;
+    &:active {
+      color: rgb(var(--primary-6));
     }
+  }
+}
+.arco-input-tag-wrapper {
+  .arco-input-tag-addbefore {
+    border-left: 1px solid var(--color-border-3);
+    border-top: 1px solid var(--color-border-3);
+    border-bottom: 1px solid var(--color-border-3);
+    border-right: none;
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+  }
+  .arco-input-tag-addafter {
+    border-left: none;
+    border-right: 1px solid var(--color-border-3);
+    border-top: 1px solid var(--color-border-3);
+    border-bottom: 1px solid var(--color-border-3);
+    border-top-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+  }
 }
 
 // InputNumber Icon
-.arco-input-group-wrapper.arco-input-group-wrapper-default {
+.arco-input-number {
+  .arco-input-group-wrapper {
+    .arco-input-number-step-layer {
+      .arco-input-number-step-button {
+        font-size: 10px;
+      }
+    }
+  }
+  .arco-input-group-addbefore, .arco-input-group-addafter {
     .arco-input-number-step-button {
-        font-size: 16px;
+		font-size: 16px;
+	}
+  }
+  &.arco-input-number-size-mini {
+    .arco-input-group-addbefore, .arco-input-group-addafter {
+      .arco-input-number-step-button {
+		  font-size: 14px;
+	  }
     }
+  }
 }
 
 .arco-input-group> :first-child {
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+
+  .arco-input-number-step-button {
     border-top-left-radius: 4px;
     border-bottom-left-radius: 4px;
-
-    .arco-input-number-step-button {
-        border-top-left-radius: 4px;
-        border-bottom-left-radius: 4px;
-    }
+  }
 }
 
 .arco-input-group> :last-child {
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+
+  .arco-input-number-step-button {
     border-top-right-radius: 4px;
     border-bottom-right-radius: 4px;
-
-    .arco-input-number-step-button {
-        border-top-right-radius: 4px;
-        border-bottom-right-radius: 4px;
-    }
+  }
 }
 
 .arco-input-number>.arco-input-group {
+  .arco-input-inner-wrapper.arco-input-inner-wrapper-focus {
+    border-radius: 4px;
+  }
+
+  &:has(.arco-input-group-addbefore) {
     .arco-input-inner-wrapper.arco-input-inner-wrapper-focus {
-        border-radius: 4px;
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
     }
+  }
 
-    &:has(.arco-input-group-addbefore) {
-        .arco-input-inner-wrapper.arco-input-inner-wrapper-focus {
-            border-top-left-radius: 0;
-            border-bottom-left-radius: 0;
-        }
+  &:has(.arco-input-group-addafter) {
+    .arco-input-inner-wrapper.arco-input-inner-wrapper-focus {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
     }
+  }
+}
 
-    &:has(.arco-input-group-addafter) {
-        .arco-input-inner-wrapper.arco-input-inner-wrapper-focus {
-            border-top-right-radius: 0;
-            border-bottom-right-radius: 0;
-        }
-    }
+// Select
+.arco-input-group > :first-child.arco-select > .arco-select-view {
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+}
+.arco-input-group > :last-child.arco-input,
+.arco-input-group > :last-child.arco-select > .arco-select-view {
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px;
 }
 
-// Select Icon
-.arco-select.arco-select-size-default {
-    .arco-select-suffix {
-        svg.arco-icon {
-            font-size: 16px;
-        }
-    }
+.arco-select-wrapper > .arco-select-addbefore {
+  border-left: 1px solid var(--color-border-3);
+  border-top: 1px solid var(--color-border-3);
+  border-bottom: 1px solid var(--color-border-3);
+  border-right: none;
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+}
+.arco-select-wrapper:has(.arco-select-addbefore) {
+  .arco-select.arco-select-focused > .arco-select-view {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
 }
 
+// Select Icon
+.arco-icon-hover.arco-select-clear-icon::before {
+  display: none;
+}
+.arco-select {
+  .arco-select-suffix svg.arco-icon {
+    font-size: 16px;
+  }
+}
 .arco-select.arco-select-size-mini {
-    .arco-select-suffix {
-        svg.arco-icon {
-            font-size: 14px;
-        }
-    }
+  .arco-select-suffix svg.arco-icon {
+    font-size: 14px;
+  }
 }
 
 // Alert
 .arco-alert {
-    display: flex;
-    align-items: start;
+  display: flex;
+  align-items: start;
 
-    .arco-alert-close-btn {
-        margin-top: 6px;
-    }
+  .arco-alert-close-btn {
+    margin-top: 6px;
+  }
 }
 
 // TimePicker
 .arco-timepicker-cell:not(.arco-timepicker-cell-selected):not(.arco-timepicker-cell-disabled):hover .arco-timepicker-cell-inner {
-    background-color: rgb(var(--primary-1));
+  background-color: rgb(var(--primary-1));
 }
 
 .arco-timepicker-cell-selected:not(.arco-timepicker-cell-disabled) .arco-timepicker-cell-inner {
-    background-color: rgb(var(--primary-1));
-    color: rgb(var(--primary-6))
+  background-color: rgb(var(--primary-1));
+  color: rgb(var(--primary-6))
 }
 
 // Transfer
 .arco-transfer {
-    .arco-transfer-view-header {
-        border-radius: 4px;
-    }
+  .arco-transfer-view-header {
+    border-radius: 4px;
+  }
 
-    .arco-transfer-operations>svg.arco-icon {
+  .arco-transfer-operations {
+    .arco-btn {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      svg.arco-icon {
         font-size: 16px;
+      }
     }
+  }
 
-    .arco-transfer-view-header {
-        .arco-transfer-view-icon-clear>svg.arco-icon {
-            font-size: 16px;
-        }
+  .arco-transfer-view-header {
+    .arco-transfer-view-icon-clear>svg.arco-icon {
+      font-size: 16px;
     }
+  }
 
-    .arco-icon-hover {
-        &::before {
-            display: none;
-        }
+  .arco-icon-hover {
+    &::before {
+      display: none;
+    }
 
-        &:not(.arco-icon-hover-disabled):hover>.arco-checkbox-mask {
-            border-color: rgb(var(--primary-5));
-        }
+    &:not(.arco-icon-hover-disabled):hover>.arco-checkbox-mask {
+      border-color: rgb(var(--primary-5));
+    }
 
-        &:not(.arco-icon-hover-disabled):active>.arco-checkbox-mask {
-            border-color: rgb(var(--primary-7));
-        }
+    &:not(.arco-icon-hover-disabled):active>.arco-checkbox-mask {
+      border-color: rgb(var(--primary-7));
     }
+	
+	&:not(.arco-icon-hover-disabled) {
+	  &.arco-transfer-view-icon-clear, &.arco-transfer-view-item-icon-remove {
+		&:hover {
+		  color: rgb(var(--primary-5));
+		}
+		&:active {
+		  color: rgb(var(--primary-5));
+		}
+	  }
+    }
+  }
 
-    .arco-transfer-view-list {
-        .arco-transfer-view-item-icon-remove {
-            font-size: 16px;
-        }
+  .arco-transfer-view-list {
+    .arco-transfer-view-item-icon-remove {
+      font-size: 16px;
     }
+  }
 
-    .arco-transfer-view-search {
-        .arco-input-has-suffix {
-            .arco-input-group-suffix>svg.arco-icon {
-                font-size: 16px;
-            }
-        }
+  .arco-transfer-view-search {
+    .arco-input-has-suffix {
+      .arco-input-group-suffix>svg.arco-icon {
+        font-size: 16px;
+      }
     }
+  }
 }
 
 // Pagination Simple
 .arco-pagination {
-    .arco-pagination-item-simple-pager {
-        margin-right: 4px;
-
-        .arco-input.arco-pagination-jumper-input {
-            margin-right: 4px;
-            border-radius: 4px;
-            border: 1px solid var(--color-border-3);
-            background: var(--color-bg-2);
-        }
+  .arco-pagination-item-simple-pager {
+    margin-right: 4px;
+
+    .arco-input.arco-pagination-jumper-input {
+      margin-right: 4px;
+      border-radius: 4px;
+      border: 1px solid var(--color-border-3);
+      background: var(--color-bg-2);
+
+      &:hover,&:focus {
+        border-color: rgb(var(--primary-5));
+      }
     }
+  }
 
-    &.arco-pagination-size-small {
-        .arco-pagination-item-simple-pager {
-            .arco-input.arco-input-size-small.arco-pagination-jumper-input {
-                width: 28px;
-            }
-        }
+  &.arco-pagination-size-small {
+    .arco-pagination-item-simple-pager {
+      .arco-input.arco-input-size-small.arco-pagination-jumper-input {
+        width: 28px;
+      }
     }
+  }
 
-    &.arco-pagination-size-mini {
-        .arco-pagination-item-simple-pager {
-            .arco-input.arco-input-size-mini.arco-pagination-jumper-input {
-                width: 24px;
-            }
-        }
+  &.arco-pagination-size-mini {
+    .arco-pagination-item-simple-pager {
+      .arco-input.arco-input-size-mini.arco-pagination-jumper-input {
+        width: 24px;
+      }
     }
+  }
 }