amis 1.10.1-beta.1 → 1.10.1

package/scss/components/_condition-builder.scss

@@ -278,3 +278,14 @@
   display: inline-block;
   user-select: none;
 }
+
+.#{$ns}CBPicker-trigger {
+  cursor: pointer;
+  transition: transform var(--animation-duration) ease-out;
+  display: flex;
+  color: var(--Form-select-caret-iconColor);
+
+  &:hover {
+    color: var(--primary);
+  }
+}

package/scss/components/_crud.scss

@@ -67,7 +67,6 @@
   }
 
   &-toolbar-item {
-    margin-left: var(--Crud-toolbar-gap);
     margin-top: var(--Crud-toolbar-gap);
     line-height: var(--Crud-toolbar-lineHeight);
     height: var(--Crud-toolbar-height);
@@ -75,6 +74,10 @@
     display: inline-flex;
     align-items: center;
 
+    &:not(:first-child) {
+      margin-left: var(--Crud-toolbar-gap);
+    }
+
     &--left {
       float: left;
     }
@@ -119,7 +122,6 @@
 @include media-breakpoint-up(sm) {
   .#{$ns}Crud {
     &-toolbar {
-      margin-left: calc(var(--Crud-toolbar-gap) * -1);
       margin-top: calc(var(--Crud-toolbar-gap) * -1);
       flex-basis: 0;
       flex-grow: 1;
@@ -127,11 +129,14 @@
     }
 
     &-toolbar-item {
-      margin-left: var(--Crud-toolbar-gap);
       line-height: var(--Crud-toolbar-lineHeight);
       height: var(--Crud-toolbar-height);
       vertical-align: middle;
 
+      &:not(:first-child) {
+        margin-left: var(--Crud-toolbar-gap);
+      }
+
       &--left {
         float: left;
       }

package/scss/components/_crud2.scss

@@ -0,0 +1,148 @@
+.#{$ns}Crud2 {
+  position: relative;
+
+  &-selection,
+  &-toolbar,
+  &-body {
+    margin-bottom: var(--gap-base);
+  }
+
+  &-selectionLabel {
+    display: inline-block;
+    vertical-align: top;
+    margin-top: var(--gap-xs);
+  }
+
+  &-value {
+    cursor: pointer;
+    vertical-align: middle;
+    user-select: none;
+    line-height: calc(
+      var(--Form-input-lineHeight) * var(--Form-input-fontSize) - #{px2rem(2px)}
+    );
+    display: inline-block;
+    font-size: var(--Form-selectValue-fontSize);
+    color: var(--Form-selectValue-color);
+    background: var(--Form-selectValue-bg);
+    border: px2rem(1px) solid var(--Form-selectValue-borderColor);
+    border-radius: 2px;
+    margin-right: var(--gap-xs);
+    margin-top: var(--gap-xs);
+
+    &:hover {
+      background: var(--Form-selectValue-onHover-bg);
+    }
+
+    &.is-disabled {
+      pointer-events: none;
+      opacity: var(--Button-onDisabled-opacity);
+    }
+  }
+
+  &-valueIcon {
+    cursor: pointer;
+    border-right: px2rem(1px) solid var(--Form-selectValue-borderColor);
+    padding: 1px 5px;
+
+    &:hover {
+      background: var(--Form-selectValue-onHover-bg);
+    }
+  }
+
+  &-valueLabel {
+    padding: 0 var(--gap-xs);
+  }
+
+  &-selectionClear {
+    display: inline-block;
+    cursor: pointer;
+    user-select: none;
+    margin-left: var(--gap-xs);
+    margin-top: var(--gap-xs);
+    vertical-align: middle;
+  }
+
+  &-toolbar-item {
+    margin-top: var(--Crud-toolbar-gap);
+    line-height: var(--Crud-toolbar-lineHeight);
+    height: var(--Crud-toolbar-height);
+    vertical-align: middle;
+    display: inline-flex;
+    align-items: center;
+
+    &:not(:first-child) {
+      margin-left: var(--Crud-toolbar-gap);
+    }
+
+    &--left {
+      float: left;
+    }
+
+    &--right {
+      float: right;
+    }
+  }
+
+  &-actions {
+    > * + .#{$ns}Button,
+    > * + .#{$ns}ButtonGroup,
+    > * + .#{$ns}ButtonToolbar {
+      margin-left: var(--Crud-toolbar-gap);
+    }
+  }
+
+  &-statistics {
+    line-height: var(--Crud-toolbar-height);
+    vertical-align: middle;
+  }
+
+  &-pageSwitch {
+    .#{$ns}Select {
+      margin-left: var(--Crud-toolbar-gap);
+    }
+  }
+
+  &-pager {
+    align-self: flex-start;
+  }
+
+  &-filter {
+    margin-bottom: var(--gap-base);
+  }
+}
+
+@include media-breakpoint-up(sm) {
+  .#{$ns}Crud {
+    &-toolbar {
+      margin-top: calc(var(--Crud-toolbar-gap) * -1);
+      flex-basis: 0;
+      flex-grow: 1;
+      @include clearfix();
+    }
+
+    &-toolbar-item {
+      line-height: var(--Crud-toolbar-lineHeight);
+      height: var(--Crud-toolbar-height);
+      vertical-align: middle;
+
+      &:not(:first-child) {
+        margin-left: var(--Crud-toolbar-gap);
+      }
+
+      &--left {
+        float: left;
+      }
+
+      &--right {
+        float: right;
+      }
+    }
+
+    &-actions {
+      > * + .#{$ns}Button,
+      > * + .#{$ns}Button--disabled-wrap {
+        margin-left: var(--Crud-toolbar-gap);
+      }
+    }
+  }
+}

package/scss/components/_result-box.scss

@@ -8,10 +8,6 @@
   border-radius: 3px;
   position: relative;
 
-  &.is-clearable {
-    padding-right: px2rem(55px);
-  }
-
   &.is-error {
     border-color: var(--Form-input-onError-borderColor);
     background: var(--Form-input-onError-bg);
@@ -60,7 +56,31 @@
     padding-left: var(--gap-base);
   }
 
+  &-value-wrap {
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+  }
+
+  &-actions {
+    display: flex;
+    align-items: center;
+    flex-shrink: 0;
+
+    > * {
+      &:first-child {
+        margin-left: px2rem(5px);
+      }
+
+      &:not(:last-child) {
+        margin-right: px2rem(5px);
+      }
+    }
+  }
+
   &-singleValue {
+    padding: 0 calc(var(--Form-input-paddingX) - #{px2rem(3px)});
+    flex-grow: 1;
     display: inline-block;
     max-width: 100%;
     overflow: hidden;
@@ -91,10 +111,7 @@
   &-clear {
     @include input-clear();
     height: 100%;
-    padding: px2rem(4px);
     margin: auto 0;
-    position: absolute;
-    right: 10px;
     background-color: unset;
 
     &-wrap {
@@ -168,6 +185,7 @@
 
   &-placeholder {
     color: var(--Form-input-placeholderColor);
+    flex-grow: 1;
     user-select: none;
   }
 

package/scss/components/_steps.scss

@@ -93,15 +93,14 @@
       overflow: hidden !important;
       &-container {
         &Icon:after {
-            content: '';
-            position: absolute;
-            right: 0;
-            top: px2rem(32px);
-            height: 9999px;
-            left: px2rem(11px);
-            width: 1px;
-            background-color: var(--Steps-line-bg);
-        
+          content: '';
+          position: absolute;
+          right: 0;
+          top: px2rem(32px);
+          height: 9999px;
+          left: px2rem(11px);
+          width: 1px;
+          background-color: var(--Steps-line-bg);
         }
         &Wrapper > .#{$ns}StepsItem-body > .#{$ns}StepsItem-title {
           &:after {
@@ -146,9 +145,8 @@
               }
             }
           }
-          &-title>span {
+          &-title > span {
             display: inline-block !important;
-            
           }
           &-vertical-ProgressDot {
             right: px2rem(10px);
@@ -159,8 +157,8 @@
         }
         &:last-child {
           .#{$ns}StepsItem {
-            &-containerProgressDot:after{
-                display: none;
+            &-containerProgressDot:after {
+              display: none;
             }
           }
         }
@@ -181,8 +179,8 @@
     padding: 0;
     .#{$ns}StepsItem {
       flex: 1;
-      padding: 0; 
-      overflow: visible ;
+      padding: 0;
+      overflow: visible;
       &-container {
         display: flex;
         flex-direction: column;
@@ -197,7 +195,7 @@
           width: calc(100% - 55px);
           background-color: var(--Steps-line-bg);
         }
-        &Icon{
+        &Icon {
           margin-left: px2rem(90px);
         }
         &Wrapper {
@@ -207,7 +205,7 @@
             .#{$ns}StepsItem-title {
               padding: 0 px2rem(10px);
               width: 100%;
-              >span {
+              > span {
                 display: block;
                 position: relative;
                 left: px2rem(10px);
@@ -219,7 +217,7 @@
                 left: px2rem(10px);
               }
             }
-            .#{$ns}StepsItem-title:after  {
+            .#{$ns}StepsItem-title:after {
               display: none;
             }
             .#{$ns}StepsItem-description {
@@ -242,10 +240,10 @@
           }
         }
       }
-    } 
+    }
     .is-finish {
       .#{$ns}StepsItem {
-        &-containerTail:after{
+        &-containerTail:after {
           background: var(--Steps-status-success);
         }
       }
@@ -266,7 +264,7 @@
           height: px2rem(8px);
           margin-left: px2rem(96px);
           border: 1px solid var(--Steps-line-success-bg);
-          border-radius: 100% ;
+          border-radius: 100%;
         }
       }
     }
@@ -302,7 +300,6 @@
       }
     }
   }
-  
 
   .#{$ns}StepsItem.is-wait {
     .#{$ns}StepsItem-icon {
@@ -333,10 +330,8 @@
   }
 }
 
-
 .#{$ns}Steps-mobile.#{$ns}Steps--horizontal {
   .#{$ns}StepsItem {
-
     &-container {
       &Wrapper {
         .#{$ns}StepsItem-body {
@@ -347,7 +342,7 @@
           }
         }
 
-        .#{$ns}StepsItem-body{
+        .#{$ns}StepsItem-body {
           .#{$ns}StepsItem-title {
             .#{$ns}StepsItem-subTitle {
               padding-left: px2rem(5px);
@@ -391,4 +386,4 @@
       }
     }
   }
-}
+}

package/scss/components/_table-v2.scss

@@ -645,7 +645,7 @@
 
         .#{$ns}Table-thead-resizable {
           position: absolute;
-          width: 1px;
+          width: 3px;
           right: 0;
           top: 0;
           bottom: 0;
@@ -712,8 +712,6 @@
 
   .#{$ns}TableCell-searchBtn {
     cursor: pointer;
-    position: static;
-    transform: translateY(-50%);
     color: var(--text--muted-color);
     margin-left: var(--TableCell-icon-gap);
 

package/scss/themes/_common.scss

@@ -48,6 +48,7 @@
 @import '../components/context-menu';
 @import '../components/wizard';
 @import '../components/crud';
+@import '../components/crud2';
 @import '../components/table';
 @import '../components/table-v2';
 @import '../components/column-toggler';

package/sdk/ang-ie11.css

@@ -13451,7 +13451,6 @@ readers do not read off random characters that represent icons */
   outline: none;
   /* Prevent dragging from highlighting the element */
   position: relative;
-  z-index: 0;
 }
 
 .amis-scope .CodeMirror-sizer {
@@ -31936,6 +31935,17 @@ readers do not read off random characters that represent icons */
   user-select: none;
 }
 
+.amis-scope .a-CBPicker-trigger {
+  cursor: pointer;
+  transition: transform 0s ease-out;
+  display: flex;
+  color: #4b5563;
+}
+
+.amis-scope .a-CBPicker-trigger:hover {
+  color: #7266ba;
+}
+
 @keyframes contextMenuInSpecial {
   from {
     transform: scale3d(1, 1, 1);
@@ -32455,7 +32465,6 @@ readers do not read off random characters that represent icons */
 }
 
 .amis-scope .a-Crud-toolbar-item {
-  margin-left: 0.25rem;
   margin-top: 0.25rem;
   line-height: 1.5;
   height: 1.875rem;
@@ -32464,6 +32473,10 @@ readers do not read off random characters that represent icons */
   align-items: center;
 }
 
+.amis-scope .a-Crud-toolbar-item:not(:first-child) {
+  margin-left: 0.25rem;
+}
+
 .amis-scope .a-Crud-toolbar-item--left {
   float: left;
 }
@@ -32503,7 +32516,6 @@ readers do not read off random characters that represent icons */
 
 @media (min-width: 576px) {
   .amis-scope .a-Crud-toolbar {
-    margin-left: calc(0.25rem * -1);
     margin-top: calc(0.25rem * -1);
     flex-basis: 0;
     flex-grow: 1;
@@ -32520,12 +32532,163 @@ readers do not read off random characters that represent icons */
   }
 
   .amis-scope .a-Crud-toolbar-item {
+    line-height: 1.5;
+    height: 1.875rem;
+    vertical-align: middle;
+  }
+
+  .amis-scope .a-Crud-toolbar-item:not(:first-child) {
     margin-left: 0.25rem;
+  }
+
+  .amis-scope .a-Crud-toolbar-item--left {
+    float: left;
+  }
+
+  .amis-scope .a-Crud-toolbar-item--right {
+    float: right;
+  }
+
+  .amis-scope .a-Crud-actions > * + .a-Button,
+  .amis-scope .a-Crud-actions > * + .a-Button--disabled-wrap {
+    margin-left: 0.25rem;
+  }
+}
+
+.amis-scope .a-Crud2 {
+  position: relative;
+}
+
+.amis-scope .a-Crud2-selection,
+.amis-scope .a-Crud2-toolbar,
+.amis-scope .a-Crud2-body {
+  margin-bottom: 0.75rem;
+}
+
+.amis-scope .a-Crud2-selectionLabel {
+  display: inline-block;
+  vertical-align: top;
+  margin-top: 0.25rem;
+}
+
+.amis-scope .a-Crud2-value {
+  cursor: pointer;
+  vertical-align: middle;
+  user-select: none;
+  line-height: calc( 1.4285714286 * 0.875rem - 0.125rem );
+  display: inline-block;
+  font-size: 0.75rem;
+  color: #23b7e5;
+  background: #d9f3fb;
+  border: 0.0625rem solid #abe4f6;
+  border-radius: 2px;
+  margin-right: 0.25rem;
+  margin-top: 0.25rem;
+}
+
+.amis-scope .a-Crud2-value:hover {
+  background: #c2ecf9;
+}
+
+.amis-scope .a-Crud2-value.is-disabled {
+  pointer-events: none;
+  opacity: 0.65;
+}
+
+.amis-scope .a-Crud2-valueIcon {
+  cursor: pointer;
+  border-right: 0.0625rem solid #abe4f6;
+  padding: 1px 5px;
+}
+
+.amis-scope .a-Crud2-valueIcon:hover {
+  background: #c2ecf9;
+}
+
+.amis-scope .a-Crud2-valueLabel {
+  padding: 0 0.25rem;
+}
+
+.amis-scope .a-Crud2-selectionClear {
+  display: inline-block;
+  cursor: pointer;
+  user-select: none;
+  margin-left: 0.25rem;
+  margin-top: 0.25rem;
+  vertical-align: middle;
+}
+
+.amis-scope .a-Crud2-toolbar-item {
+  margin-top: 0.25rem;
+  line-height: 1.5;
+  height: 1.875rem;
+  vertical-align: middle;
+  display: inline-flex;
+  align-items: center;
+}
+
+.amis-scope .a-Crud2-toolbar-item:not(:first-child) {
+  margin-left: 0.25rem;
+}
+
+.amis-scope .a-Crud2-toolbar-item--left {
+  float: left;
+}
+
+.amis-scope .a-Crud2-toolbar-item--right {
+  float: right;
+}
+
+.amis-scope .a-Crud2-actions > * + .a-Button,
+.amis-scope .a-Crud2-actions > * + .a-ButtonGroup,
+.amis-scope .a-Crud2-actions > * + .a-ButtonToolbar {
+  margin-left: 0.25rem;
+}
+
+.amis-scope .a-Crud2-statistics {
+  line-height: 1.875rem;
+  vertical-align: middle;
+}
+
+.amis-scope .a-Crud2-pageSwitch .a-Select {
+  margin-left: 0.25rem;
+}
+
+.amis-scope .a-Crud2-pager {
+  align-self: flex-start;
+}
+
+.amis-scope .a-Crud2-filter {
+  margin-bottom: 0.75rem;
+}
+
+@media (min-width: 576px) {
+  .amis-scope .a-Crud-toolbar {
+    margin-top: calc(0.25rem * -1);
+    flex-basis: 0;
+    flex-grow: 1;
+  }
+
+  .amis-scope .a-Crud-toolbar::before,
+  .amis-scope .a-Crud-toolbar::after {
+    display: table;
+    content: "";
+  }
+
+  .amis-scope .a-Crud-toolbar::after {
+    clear: both;
+  }
+
+  .amis-scope .a-Crud-toolbar-item {
     line-height: 1.5;
     height: 1.875rem;
     vertical-align: middle;
   }
 
+  .amis-scope .a-Crud-toolbar-item:not(:first-child) {
+    margin-left: 0.25rem;
+  }
+
   .amis-scope .a-Crud-toolbar-item--left {
     float: left;
   }
@@ -35588,7 +35751,7 @@ readers do not read off random characters that represent icons */
 
 .amis-scope .a-Table-v2.a-Table-resizable .a-Table-table > thead > tr > th .a-Table-thead-resizable {
   position: absolute;
-  width: 1px;
+  width: 3px;
   right: 0;
   top: 0;
   bottom: 0;
@@ -35652,8 +35815,6 @@ readers do not read off random characters that represent icons */
 
 .amis-scope .a-Table-v2 .a-TableCell-searchBtn {
   cursor: pointer;
-  position: static;
-  transform: translateY(-50%);
   color: #99a6ad;
   margin-left: 0.5rem;
 }
@@ -38656,10 +38817,6 @@ readers do not read off random characters that represent icons */
   border-color: transparent !important;
 }
 
-.amis-scope .a-ResultBox.is-clearable {
-  padding-right: 3.4375rem;
-}
-
 .amis-scope .a-ResultBox.is-error {
   border-color: #f05050;
   background: #fff;
@@ -38708,7 +38865,29 @@ readers do not read off random characters that represent icons */
   padding-left: 0.75rem;
 }
 
+.amis-scope .a-ResultBox-value-wrap {
+  flex-grow: 1;
+  display: flex;
+  align-items: center;
+}
+
+.amis-scope .a-ResultBox-actions {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+
+.amis-scope .a-ResultBox-actions > *:first-child {
+  margin-left: 0.3125rem;
+}
+
+.amis-scope .a-ResultBox-actions > *:not(:last-child) {
+  margin-right: 0.3125rem;
+}
+
 .amis-scope .a-ResultBox-singleValue {
+  padding: 0 calc(0.5rem - 0.1875rem);
+  flex-grow: 1;
   display: inline-block;
   max-width: 100%;
   overflow: hidden;
@@ -38746,10 +38925,7 @@ readers do not read off random characters that represent icons */
   margin-left: auto;
   text-decoration: none;
   height: 100%;
-  padding: 0.25rem;
   margin: auto 0;
-  position: absolute;
-  right: 10px;
   background-color: unset;
 }
 
@@ -38840,6 +39016,7 @@ readers do not read off random characters that represent icons */
 
 .amis-scope .a-ResultBox-placeholder {
   color: #99a6ad;
+  flex-grow: 1;
   user-select: none;
 }