amis-ui 2.2.0 → 2.3.0

package/package.json

@@ -3,7 +3,7 @@
   "main": "lib/index.js",
   "module": "esm/index.js",
   "types": "lib/index.d.ts",
-  "version": "2.2.0",
+  "version": "2.3.0",
   "description": "",
   "scripts": {
     "build": "npm run clean-dist && NODE_ENV=production rollup -c ",
@@ -33,12 +33,12 @@
     }
   },
   "dependencies": {
-    "amis-core": "^2.2.0",
-    "amis-formula": "^2.1.0",
+    "amis-core": "^2.3.0",
+    "amis-formula": "^2.3.0",
     "classnames": "2.3.1",
     "codemirror": "^5.63.0",
-    "downshift": "6.1.7",
-    "echarts": "5.3.3",
+    "downshift": "6.1.12",
+    "echarts": "5.4.0",
     "froala-editor": "3.1.1",
     "hoist-non-react-statics": "^3.3.2",
     "jsbarcode": "^3.11.5",
@@ -53,7 +53,7 @@
     "moment": "^2.19.4",
     "monaco-editor": "0.30.1",
     "prop-types": "^15.6.1",
-    "rc-input-number": "^7.3.4",
+    "rc-input-number": "^7.3.9",
     "rc-progress": "^3.1.4",
     "react-color": "^2.19.3",
     "react-hook-form": "7.30.0",
@@ -62,7 +62,7 @@
     "react-textarea-autosize": "8.3.3",
     "react-transition-group": "4.4.2",
     "react-visibility-sensor": "5.1.1",
-    "sortablejs": "1.14.0",
+    "sortablejs": "1.15.0",
     "tinymce": "^6.1.2",
     "tslib": "^2.3.1",
     "uncontrollable": "7.2.1"
@@ -70,7 +70,7 @@
   "devDependencies": {
     "@rollup/plugin-commonjs": "^22.0.2",
     "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^13.3.0",
+    "@rollup/plugin-node-resolve": "^14.1.0",
     "@rollup/plugin-typescript": "^8.3.4",
     "@svgr/rollup": "^6.2.1",
     "@testing-library/jest-dom": "^5.16.4",
@@ -78,21 +78,21 @@
     "@types/jest": "^28.1.0",
     "@types/react": "^17.0.39",
     "@types/react-dom": "^17.0.11",
-    "autoprefixer": "^10.4.7",
-    "jest": "^28.1.0",
-    "jest-environment-jsdom": "^28.1.0",
+    "autoprefixer": "^10.4.12",
+    "jest": "^29.0.3",
+    "jest-environment-jsdom": "^29.0.3",
     "moment-timezone": "^0.5.34",
     "postcss-import": "^14.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "rimraf": "^3.0.2",
-    "rollup": "^2.73.0",
+    "rollup": "^2.79.1",
     "rollup-plugin-auto-external": "^2.0.0",
     "rollup-plugin-license": "^2.7.0",
     "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-scss": "^3.0.0",
-    "sass": "^1.54.0",
-    "ts-jest": "^28.0.3",
+    "sass": "^1.54.9",
+    "ts-jest": "^29.0.2",
     "typescript": "^4.6.4"
   },
   "peerDependencies": {
@@ -112,7 +112,12 @@
       "js"
     ],
     "transform": {
-      "\\.(ts|tsx)$": "ts-jest"
+      "\\.(ts|tsx)$": [
+        "ts-jest",
+        {
+          "diagnostics": false
+        }
+      ]
     },
     "setupFiles": [
       "jest-canvas-mock"
@@ -129,12 +134,7 @@
     "testPathIgnorePatterns": [
       "/node_modules/",
       "/.rollup.cache/"
-    ],
-    "globals": {
-      "ts-jest": {
-        "diagnostics": false
-      }
-    }
+    ]
   },
-  "gitHead": "8e92bd5c8ec412e9730ac424ab38d248aa122c8b"
+  "gitHead": "b68c3c583c6744b1538a1a6865d3a33e51cddd5d"
 }

package/scss/_mixins.scss

@@ -409,6 +409,10 @@
     background: var(--Form-input-onDisabled-bg);
     border-color: var(--Form-input-onDisabled-borderColor);
     transition: all var(--animation-duration);
+
+    & > input {
+      color: var(--text--muted-color);
+    }
   }
 
   &-spinner {
@@ -471,3 +475,9 @@
     color: var(--icon-onHover-color);
   }
 }
+
+@mixin truncate {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}

package/scss/_thirds.scss

@@ -1,8 +1,8 @@
-@import url('codemirror/lib/codemirror.css');
-@import url('froala-editor/css/froala_style.min.css');
-@import url('froala-editor/css/froala_editor.pkgd.min.css');
-@import url('tinymce/skins/ui/oxide/skin.css');
-@import url('video-react/dist/video-react.css');
-@import url('cropperjs/dist/cropper.css');
+@import '../../../node_modules/codemirror/lib/codemirror';
+@import '../../../node_modules/froala-editor/css/froala_style.min';
+@import '../../../node_modules/froala-editor/css/froala_editor.pkgd.min';
+@import '../../../node_modules/tinymce/skins/ui/oxide/skin';
+@import '../../../node_modules/video-react/dist/video-react';
+@import '../../../node_modules/cropperjs/dist/cropper';
 
 @import './components/react-datetime';

package/scss/components/_anchor-nav.scss

@@ -30,6 +30,8 @@
           margin-left: px2rem(-2px);
           height: px2rem(32px);
           line-height: px2rem(32px);
+          @include truncate();
+          max-width: var(--Tabs--vertical-width);
 
           &:hover {
             color: var(--primary);
@@ -46,8 +48,8 @@
             border-color: var(--primary);
           }
           > a:hover {
-            color: #528EFF;
-            border-color: #528EFF;
+            color: #528eff;
+            border-color: #528eff;
           }
           > a:active {
             color: #144bcc;
@@ -72,6 +74,11 @@
         display: inline-block;
         position: relative;
 
+        > a {
+          @include truncate();
+          max-width: var(--Tabs--vertical-width);
+        }
+
         > a:first-child {
           font-size: var(--Tabs-linkFontSize);
           outline: 0;

package/scss/components/_collapse.scss

@@ -61,15 +61,15 @@
     display: inline-block;
   }
 
-  &.is-active &-arrow:before {
+  &.is-active > * > &-arrow:before {
     transform: rotate(135deg);
     transform-origin: 50% 30%;
   }
-  &.is-active &-icon-tranform {
+  &.is-active > * > &-icon-tranform {
     transform: rotate(90deg);
   }
 
-  &--disabled &-header {
+  &--disabled > &-header {
     cursor: not-allowed;
     user-select: none;
     color: var(--text--muted-color);
@@ -78,7 +78,7 @@
     }
   }
 
-  &--disabled &-arrow:before {
+  &--disabled > * > &-arrow:before {
     border-color: var(--text--muted-color);
   }
 

package/scss/components/_spinner.scss

@@ -174,3 +174,9 @@
     transform: translate3d(-50%, -50%, 0);
   }
 }
+
+.#{$ns}Spinner-mark {
+  position: absolute;
+  z-index: -999;
+  opacity: 0;
+}

package/scss/components/_table.scss

@@ -420,7 +420,7 @@
         }
       }
 
-      @if var(--Table-strip-bg) !=transparent {
+      @if $Table-strip-bg != transparent {
         background: transparent;
 
         &.#{$ns}Table-tr--odd {

package/scss/components/form/_fieldset.scss

@@ -61,6 +61,10 @@ fieldset.#{$ns}Collapse {
       font-size: var(--fontSizeXs);
       padding: 0 3px;
       margin: 0 0 0 -3px;
+
+      &:hover {
+        background-color: var(--white);
+      }
     }
 
     &:after {
@@ -78,6 +82,10 @@ fieldset.#{$ns}Collapse {
       font-size: var(--fontSizeSm);
       padding: 0 5px;
       margin: 0 0 0 -5px;
+
+      &:hover {
+        background-color: var(--white);
+      }
     }
 
     &:after {
@@ -95,6 +103,10 @@ fieldset.#{$ns}Collapse {
       font-size: var(--fontSizeBase);
       padding: 0 8px;
       margin: 0 0 0 -8px;
+
+      &:hover {
+        background-color: var(--white);
+      }
     }
 
     &:after {
@@ -111,6 +123,10 @@ fieldset.#{$ns}Collapse {
       font-size: var(--fontSizeMd);
       padding: 0 10px;
       margin: 0 0 0 -10px;
+
+      &:hover {
+        background-color: var(--white);
+      }
     }
 
     &:after {
@@ -127,6 +143,10 @@ fieldset.#{$ns}Collapse {
       font-size: var(--fontSizeLg);
       padding: 0 var(--gap-md);
       margin: 0 0 0 calc(var(--gap-md) * -1);
+
+      &:hover {
+        background-color: var(--white);
+      }
     }
 
     &:after {

package/scss/components/form/_input-group.scss

@@ -27,6 +27,11 @@
     box-sizing: border-box;
     padding: var(--InputGroup-paddingY) var(--InputGroup-paddingX);
 
+    svg {
+      width: px2rem(12px);
+      height: px2rem(12px);
+    }
+
     &:not(:last-child) {
       border-right: 0;
     }

package/scss/components/form/_selection.scss

@@ -173,10 +173,15 @@
     bottom: 0;
   }
 
-  &-item.is-disabled {
+  &-item.is-disabled > .#{$ns}TreeSelection-itemInner {
+    cursor: not-allowed;
     color: var(--text--muted-color);
   }
 
+  &-item .#{$ns}TreeSelection-itemLabel {
+    white-space: nowrap;
+  }
+
   &-itemInner {
     display: flex;
     align-items: center;

package/scss/components/form/_textarea.scss

@@ -16,6 +16,8 @@
     border-radius: var(--Form-input-borderRadius);
     background: var(--Form-input-bg);
     padding: var(--Form-input-paddingY) var(--Form-input-paddingX);
+    /* 避免和clear btn 重叠 */
+    padding-right: calc(var(--Form-input-paddingX) + var(--Form-fontSize));
     font-size: var(--Form-input-fontSize);
     display: block;
     width: 100%;
@@ -54,13 +56,13 @@
   }
 
   .has-error--maxLength &-counter {
-    background: var(--danger);
+    color: var(--danger);
   }
 
   &-clear {
     @include input-clear();
     position: absolute;
-    right: var(--Form-input-paddingX);
+    right: var(--Form-input-paddingY);
     top: var(--Form-input-paddingY);
   }
 }

package/scss/components/form/_user-select.scss

@@ -13,10 +13,11 @@
 
   &-searchBox {
     height: px2rem(52px);
-    margin: 0 px2rem(16px);
+    padding: 0 px2rem(16px);
     flex: none;
     display: flex;
     align-items: center;
+    background: var(--white);
   }
 
   &-search {
@@ -30,6 +31,7 @@
     overflow-x: hidden;
     overflow-y: auto;
     background: var(--UserSelect--content-bg);
+    margin-bottom: px2rem(16px);
   }
 
   &-wrap {
@@ -38,6 +40,17 @@
     display: flex;
     flex-direction: column;
     text-align: left;
+    margin-bottom: px2rem(16px);
+    background: var(--UserSelect--content-bg);
+  }
+
+  &-footer {
+    background: var(--white);
+    padding: px2rem(10px) px2rem(16px) 0;
+
+    .#{$ns}Button {
+      width: 100%;
+    }
   }
 
   &-navbar {
@@ -73,6 +86,7 @@
     flex: none;
     white-space: nowrap;
     overflow-x: auto;
+    background: var(--white);
 
     &-item {
       cursor: pointer;
@@ -95,6 +109,8 @@
     position: relative;
     flex: 1;
     background: var(--UserSelect--content-bg);
+    margin-top: px2rem(16px);
+    margin-bottom: px2rem(16px);
   }
 
   &-scroll {
@@ -108,7 +124,6 @@
 
   &-memberList-box {
     width: 100vw;
-    margin-top: px2rem(16px);
   }
 
   &-memberList,
@@ -238,6 +253,7 @@
     flex: none;
     overflow: hidden;
     box-sizing: border-box;
+    background: var(--white);
   }
 
   &-selectNum {
@@ -396,11 +412,28 @@
     flex-direction: column;
   }
 
+  .#{$ns}UserSelect-wrap {
+    height: calc(100% - 16px);
+  }
+
+  &-footer {
+    padding: px2rem(16px) px2rem(16px) 0;
+    background: var(--white);
+
+    .#{$ns}Button {
+      width: 100%;
+    }
+  }
+
   &-tabs {
     flex: 1;
     display: flex;
     flex-direction: column;
 
+    .#{$ns}Tabs-content {
+      background-color: var(--UserSelect--content-bg);
+    }
+
     > div {
       &:first-child {
         flex: none;

package/scss/themes/_antd-variables.scss

@@ -36,6 +36,9 @@ $link-color: $info;
 @import '../variables';
 @import '../properties';
 
+/* 此处放置需要override的变量，因为部分变量已经在variables.scss中定义 */
+$Table-strip-bg: transparent;
+
 :root {
   --fontFamilyBase: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
     'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
@@ -158,8 +161,7 @@ $link-color: $info;
   --Tabs--vertical-onActive-container-bg: #fff;
   --Tabs--vertical-onActive-container-borderRight: 1px solid #f0f0f0;
 
-  $Table-strip-bg: transparent;
-  --Table-strip-bg: transparent;
+  --Table-strip-bg: #{$Table-strip-bg};
   --Table-thead-bg: #fafafa;
   --Table-onHover-bg: rgb(250, 250, 250);
   --Table-onHover-borderColor: var(--Table-borderColor);

package/scss/themes/_cxd-variables.scss

@@ -28,6 +28,9 @@ $Wizard-steps-liAfterBorder: none !important;
 @import '../variables';
 @import '../properties';
 
+/* 此处放置需要override的变量，因为部分变量已经在variables.scss中定义 */
+$Table-strip-bg: transparent;
+
 // yunshe4.0 font-size
 $T1: 10px;
 $T2: 12px;
@@ -186,6 +189,7 @@ $L1: 0px 4px 6px 0px rgba(8, 14, 26, 0.06),
   --Form-select-valueIcon-color--dark: #{$G8};
   --Form-select-multiple-bgColor: #{$G10};
   --Form-select-value-bgColor--dark: #{$G4};
+  --Form-selectValue-onDisabled-color: #{$G6};
 
   --InputGroup-select-borderWidth: #{px2rem(1px)};
   --InputGroup-select-onFocused-bg: #eaf6fe;
@@ -391,7 +395,7 @@ $L1: 0px 4px 6px 0px rgba(8, 14, 26, 0.06),
   --Table-thead-bg: #{$G10};
   --Table-thead-borderColor: #fff;
   --Table-thead-iconColor: #999;
-  --Table-strip-bg: transparent;
+  --Table-strip-bg: #{$Table-strip-bg};
   --Table-onHover-bg: #{$B1};
   --Table-onHover-bg-rgb: 245, 251, 255;
   --Table-onHover-borderColor: #eceff8;

package/scss/themes/_dark-variables.scss

@@ -35,6 +35,9 @@ $link-color: $info;
 @import '../variables';
 @import '../properties';
 
+/* 此处放置需要override的变量，因为部分变量已经在variables.scss中定义 */
+$Table-strip-bg: $Panel-bg;
+
 :root {
   --Panel-bg: #{$Panel-bg};
   --background-head: #191c22;