BI-34679 动效

dist/base.css

@@ -505,6 +505,15 @@
   border-right: 1px solid #2F3149;
 }
 
+.bi-combo > .bi-trigger .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
 .bi-combo.bi-combo-popup {
   display: block !important;
   visibility: visible !important;
@@ -513,6 +522,10 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-combo.bi-combo-popup > .bi-border,
 .bi-combo.bi-combo-hover > .bi-border,
@@ -543,6 +556,19 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-search-text-value-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 .bi-icon-text-value-combo.combo-error .bi-text-trigger .select-text-label {
@@ -1047,6 +1073,16 @@ body .bi-button.button-warning.disabled.base-disabled .b-font:before,
 #body .bi-button.button-warning.disabled.base-disabled .b-font:before {
   color: #9ea6b2 !important;
 }
+body .bi-button.button-common.disabled:after,
+#body .bi-button.button-common.disabled:after,
+body .bi-button.button-success.disabled:after,
+#body .bi-button.button-success.disabled:after,
+body .bi-button.button-error.disabled:after,
+#body .bi-button.button-error.disabled:after,
+body .bi-button.button-warning.disabled:after,
+#body .bi-button.button-warning.disabled:after {
+  display: none;
+}
 body .bi-button.button-ignore.disabled,
 #body .bi-button.button-ignore.disabled {
   background: #ffffff !important;
@@ -1058,6 +1094,10 @@ body .bi-button.button-ignore.disabled .b-font:before,
 #body .bi-button.button-ignore.disabled .b-font:before {
   color: #9ea6b2 !important;
 }
+body .bi-button.button-ignore.disabled:after,
+#body .bi-button.button-ignore.disabled:after {
+  display: none;
+}
 body .bi-button.button-common.disabled.clear,
 #body .bi-button.button-common.disabled.clear,
 body .bi-button.button-success.disabled.clear,
@@ -1153,6 +1193,41 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
 #body .bi-button.button-ignore.disabled.ghost .b-font:before {
   color: #3685f2 !important;
 }
+.bi-basic-button.button-common:after,
+.bi-basic-button.button-success:after,
+.bi-basic-button.button-warning:after,
+.bi-basic-button.button-error:after {
+  content: "";
+  background-color: #232E40;
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  transform: scale(1, 1);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: transform 0.5s ease, opacity 1s ease;
+  -moz-transition: transform 0.5s ease, opacity 1s ease;
+  -o-transition: transform 0.5s ease, opacity 1s ease;
+  transition: transform 0.5s ease, opacity 1s ease;
+  left: 0;
+  top: 0;
+}
+.bi-basic-button.button-common:active:after,
+.bi-basic-button.button-success:active:after,
+.bi-basic-button.button-warning:active:after,
+.bi-basic-button.button-error:active:after {
+  transform: scale(0, 1);
+  opacity: 0.1;
+  filter: alpha(opacity=10);
+  -webkit-transition: transform 0s;
+  -moz-transition: transform 0s;
+  -o-transition: transform 0s;
+  transition: transform 0s;
+}
 .bi-basic-button.button-common:hover .bi-button-mask,
 .bi-basic-button.button-success:hover .bi-button-mask,
 .bi-basic-button.button-warning:hover .bi-button-mask,
@@ -1160,20 +1235,46 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
   opacity: 0.1;
   filter: alpha(opacity=10);
   background-color: #ffffff;
+  -webkit-transition: opacity 0.3s ease;
+  -moz-transition: opacity 0.3s ease;
+  -o-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
-.bi-basic-button.button-common:active .bi-button-mask,
+.bi-basic-button.button-ignore:after {
-.bi-basic-button.button-success:active .bi-button-mask,
+  content: "";
-.bi-basic-button.button-warning:active .bi-button-mask,
+  background-color: #3685f2;
-.bi-basic-button.button-error:active .bi-button-mask {
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  transform: scale(1, 1);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: transform 0.5s ease, opacity 1s ease;
+  -moz-transition: transform 0.5s ease, opacity 1s ease;
+  -o-transition: transform 0.5s ease, opacity 1s ease;
+  transition: transform 0.5s ease, opacity 1s ease;
+  left: 0;
+  top: 0;
+}
+.bi-basic-button.button-ignore:active:after {
+  transform: scale(0, 1);
   opacity: 0.1;
   filter: alpha(opacity=10);
-  background-color: #232E40;
+  -webkit-transition: transform 0s;
+  -moz-transition: transform 0s;
+  -o-transition: transform 0s;
+  transition: transform 0s;
 }
 .bi-basic-button.button-ignore:hover {
   background-color: rgba(54, 133, 242, 0.05);
-}
+  -webkit-transition: opacity 0.3s ease;
-.bi-basic-button.button-ignore:active {
+  -moz-transition: opacity 0.3s ease;
-  background-color: rgba(54, 133, 242, 0.1);
+  -o-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
 .bi-basic-button .popup-content {
   font-size: 14px;

dist/base.js

@@ -8763,10 +8763,6 @@ BI.Editor = BI.inherit(BI.Single, {
         return this.editor.getLastValidValue();
     },
 
-    resetLastValidValue: function () {
-        this.editor.resetLastValidValue();
-    },
-
     getValue: function () {
         if (!this.isValid()) {
             return BI.trim(this.editor.getLastValidValue());

dist/bundle.css

@@ -2477,6 +2477,15 @@ textarea {
   border-right: 1px solid #2F3149;
 }
 
+.bi-combo > .bi-trigger .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
 .bi-combo.bi-combo-popup {
   display: block !important;
   visibility: visible !important;
@@ -2485,6 +2494,10 @@ textarea {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-combo.bi-combo-popup > .bi-border,
 .bi-combo.bi-combo-hover > .bi-border,
@@ -2515,6 +2528,19 @@ textarea {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-search-text-value-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 .bi-icon-text-value-combo.combo-error .bi-text-trigger .select-text-label {
@@ -3019,6 +3045,16 @@ body .bi-button.button-warning.disabled.base-disabled .b-font:before,
 #body .bi-button.button-warning.disabled.base-disabled .b-font:before {
   color: #9ea6b2 !important;
 }
+body .bi-button.button-common.disabled:after,
+#body .bi-button.button-common.disabled:after,
+body .bi-button.button-success.disabled:after,
+#body .bi-button.button-success.disabled:after,
+body .bi-button.button-error.disabled:after,
+#body .bi-button.button-error.disabled:after,
+body .bi-button.button-warning.disabled:after,
+#body .bi-button.button-warning.disabled:after {
+  display: none;
+}
 body .bi-button.button-ignore.disabled,
 #body .bi-button.button-ignore.disabled {
   background: #ffffff !important;
@@ -3030,6 +3066,10 @@ body .bi-button.button-ignore.disabled .b-font:before,
 #body .bi-button.button-ignore.disabled .b-font:before {
   color: #9ea6b2 !important;
 }
+body .bi-button.button-ignore.disabled:after,
+#body .bi-button.button-ignore.disabled:after {
+  display: none;
+}
 body .bi-button.button-common.disabled.clear,
 #body .bi-button.button-common.disabled.clear,
 body .bi-button.button-success.disabled.clear,
@@ -3125,6 +3165,41 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
 #body .bi-button.button-ignore.disabled.ghost .b-font:before {
   color: #3685f2 !important;
 }
+.bi-basic-button.button-common:after,
+.bi-basic-button.button-success:after,
+.bi-basic-button.button-warning:after,
+.bi-basic-button.button-error:after {
+  content: "";
+  background-color: #232E40;
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  transform: scale(1, 1);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: transform 0.5s ease, opacity 1s ease;
+  -moz-transition: transform 0.5s ease, opacity 1s ease;
+  -o-transition: transform 0.5s ease, opacity 1s ease;
+  transition: transform 0.5s ease, opacity 1s ease;
+  left: 0;
+  top: 0;
+}
+.bi-basic-button.button-common:active:after,
+.bi-basic-button.button-success:active:after,
+.bi-basic-button.button-warning:active:after,
+.bi-basic-button.button-error:active:after {
+  transform: scale(0, 1);
+  opacity: 0.1;
+  filter: alpha(opacity=10);
+  -webkit-transition: transform 0s;
+  -moz-transition: transform 0s;
+  -o-transition: transform 0s;
+  transition: transform 0s;
+}
 .bi-basic-button.button-common:hover .bi-button-mask,
 .bi-basic-button.button-success:hover .bi-button-mask,
 .bi-basic-button.button-warning:hover .bi-button-mask,
@@ -3132,20 +3207,46 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
   opacity: 0.1;
   filter: alpha(opacity=10);
   background-color: #ffffff;
+  -webkit-transition: opacity 0.3s ease;
+  -moz-transition: opacity 0.3s ease;
+  -o-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
-.bi-basic-button.button-common:active .bi-button-mask,
+.bi-basic-button.button-ignore:after {
-.bi-basic-button.button-success:active .bi-button-mask,
+  content: "";
-.bi-basic-button.button-warning:active .bi-button-mask,
+  background-color: #3685f2;
-.bi-basic-button.button-error:active .bi-button-mask {
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  transform: scale(1, 1);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: transform 0.5s ease, opacity 1s ease;
+  -moz-transition: transform 0.5s ease, opacity 1s ease;
+  -o-transition: transform 0.5s ease, opacity 1s ease;
+  transition: transform 0.5s ease, opacity 1s ease;
+  left: 0;
+  top: 0;
+}
+.bi-basic-button.button-ignore:active:after {
+  transform: scale(0, 1);
   opacity: 0.1;
   filter: alpha(opacity=10);
-  background-color: #232E40;
+  -webkit-transition: transform 0s;
+  -moz-transition: transform 0s;
+  -o-transition: transform 0s;
+  transition: transform 0s;
 }
 .bi-basic-button.button-ignore:hover {
   background-color: rgba(54, 133, 242, 0.05);
-}
+  -webkit-transition: opacity 0.3s ease;
-.bi-basic-button.button-ignore:active {
+  -moz-transition: opacity 0.3s ease;
-  background-color: rgba(54, 133, 242, 0.1);
+  -o-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
 .bi-basic-button .popup-content {
   font-size: 14px;
@@ -3733,6 +3834,19 @@ ul.ztree.zTreeDragUL {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-select-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 .bi-multi-select-insert-combo .multi-select-trigger-icon-button {
@@ -3742,6 +3856,19 @@ ul.ztree.zTreeDragUL {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-select-insert-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 
@@ -3787,6 +3914,19 @@ ul.ztree.zTreeDragUL {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-tree-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-multi-tree-popup .popup-view-tree {
   min-height: 170px;
@@ -3865,6 +4005,19 @@ ul.ztree.zTreeDragUL {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-single-select-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-single-slider-label {
   min-height: 50px;

dist/bundle.ie.js

@@ -43855,10 +43855,6 @@ BI.Editor = BI.inherit(BI.Single, {
         return this.editor.getLastValidValue();
     },
 
-    resetLastValidValue: function () {
-        this.editor.resetLastValidValue();
-    },
-
     getValue: function () {
         if (!this.isValid()) {
             return BI.trim(this.editor.getLastValidValue());

dist/bundle.js

@@ -44259,10 +44259,6 @@ BI.Editor = BI.inherit(BI.Single, {
         return this.editor.getLastValidValue();
     },
 
-    resetLastValidValue: function () {
-        this.editor.resetLastValidValue();
-    },
-
     getValue: function () {
         if (!this.isValid()) {
             return BI.trim(this.editor.getLastValidValue());

dist/demo.js

@@ -6158,7 +6158,30 @@ Demo.HtapeLayout = BI.inherit(BI.Widget, {
         };
     }
 });
-BI.shortcut("demo.htape", Demo.HtapeLayout);/**
+BI.shortcut("demo.htape", Demo.HtapeLayout);Demo.InlineVerticalLayout = BI.inherit(BI.Widget, {
+    props: {
+        baseCls: "demo-absolute"
+    },
+    render: function () {
+        return {
+            type: "bi.inline_vertical_adapt",
+            items: [{
+                type: "bi.label",
+                text: "绝对布局",
+                cls: "layout-bg1",
+                width: 300,
+                height: 200
+            }, {
+                type: "bi.label",
+                text: "绝对布局",
+                cls: "layout-bg1",
+                width: 300,
+                height: 100
+            }]
+        };
+    }
+});
+BI.shortcut("demo.inline_vertical", Demo.InlineVerticalLayout);/**
  * Created by User on 2017/3/22.
  */
 Demo.LeftRightVerticalAdaptLayout = BI.inherit(BI.Widget, {

dist/fineui.css

@@ -2477,6 +2477,15 @@ textarea {
   border-right: 1px solid #2F3149;
 }
 
+.bi-combo > .bi-trigger .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
 .bi-combo.bi-combo-popup {
   display: block !important;
   visibility: visible !important;
@@ -2485,6 +2494,10 @@ textarea {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-combo.bi-combo-popup > .bi-border,
 .bi-combo.bi-combo-hover > .bi-border,
@@ -2515,6 +2528,19 @@ textarea {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-search-text-value-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 .bi-icon-text-value-combo.combo-error .bi-text-trigger .select-text-label {
@@ -3019,6 +3045,16 @@ body .bi-button.button-warning.disabled.base-disabled .b-font:before,
 #body .bi-button.button-warning.disabled.base-disabled .b-font:before {
   color: #9ea6b2 !important;
 }
+body .bi-button.button-common.disabled:after,
+#body .bi-button.button-common.disabled:after,
+body .bi-button.button-success.disabled:after,
+#body .bi-button.button-success.disabled:after,
+body .bi-button.button-error.disabled:after,
+#body .bi-button.button-error.disabled:after,
+body .bi-button.button-warning.disabled:after,
+#body .bi-button.button-warning.disabled:after {
+  display: none;
+}
 body .bi-button.button-ignore.disabled,
 #body .bi-button.button-ignore.disabled {
   background: #ffffff !important;
@@ -3030,6 +3066,10 @@ body .bi-button.button-ignore.disabled .b-font:before,
 #body .bi-button.button-ignore.disabled .b-font:before {
   color: #9ea6b2 !important;
 }
+body .bi-button.button-ignore.disabled:after,
+#body .bi-button.button-ignore.disabled:after {
+  display: none;
+}
 body .bi-button.button-common.disabled.clear,
 #body .bi-button.button-common.disabled.clear,
 body .bi-button.button-success.disabled.clear,
@@ -3125,6 +3165,41 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
 #body .bi-button.button-ignore.disabled.ghost .b-font:before {
   color: #3685f2 !important;
 }
+.bi-basic-button.button-common:after,
+.bi-basic-button.button-success:after,
+.bi-basic-button.button-warning:after,
+.bi-basic-button.button-error:after {
+  content: "";
+  background-color: #232E40;
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  transform: scale(1, 1);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: transform 0.5s ease, opacity 1s ease;
+  -moz-transition: transform 0.5s ease, opacity 1s ease;
+  -o-transition: transform 0.5s ease, opacity 1s ease;
+  transition: transform 0.5s ease, opacity 1s ease;
+  left: 0;
+  top: 0;
+}
+.bi-basic-button.button-common:active:after,
+.bi-basic-button.button-success:active:after,
+.bi-basic-button.button-warning:active:after,
+.bi-basic-button.button-error:active:after {
+  transform: scale(0, 1);
+  opacity: 0.1;
+  filter: alpha(opacity=10);
+  -webkit-transition: transform 0s;
+  -moz-transition: transform 0s;
+  -o-transition: transform 0s;
+  transition: transform 0s;
+}
 .bi-basic-button.button-common:hover .bi-button-mask,
 .bi-basic-button.button-success:hover .bi-button-mask,
 .bi-basic-button.button-warning:hover .bi-button-mask,
@@ -3132,20 +3207,46 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
   opacity: 0.1;
   filter: alpha(opacity=10);
   background-color: #ffffff;
+  -webkit-transition: opacity 0.3s ease;
+  -moz-transition: opacity 0.3s ease;
+  -o-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
-.bi-basic-button.button-common:active .bi-button-mask,
+.bi-basic-button.button-ignore:after {
-.bi-basic-button.button-success:active .bi-button-mask,
+  content: "";
-.bi-basic-button.button-warning:active .bi-button-mask,
+  background-color: #3685f2;
-.bi-basic-button.button-error:active .bi-button-mask {
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  transform: scale(1, 1);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: transform 0.5s ease, opacity 1s ease;
+  -moz-transition: transform 0.5s ease, opacity 1s ease;
+  -o-transition: transform 0.5s ease, opacity 1s ease;
+  transition: transform 0.5s ease, opacity 1s ease;
+  left: 0;
+  top: 0;
+}
+.bi-basic-button.button-ignore:active:after {
+  transform: scale(0, 1);
   opacity: 0.1;
   filter: alpha(opacity=10);
-  background-color: #232E40;
+  -webkit-transition: transform 0s;
+  -moz-transition: transform 0s;
+  -o-transition: transform 0s;
+  transition: transform 0s;
 }
 .bi-basic-button.button-ignore:hover {
   background-color: rgba(54, 133, 242, 0.05);
-}
+  -webkit-transition: opacity 0.3s ease;
-.bi-basic-button.button-ignore:active {
+  -moz-transition: opacity 0.3s ease;
-  background-color: rgba(54, 133, 242, 0.1);
+  -o-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
 .bi-basic-button .popup-content {
   font-size: 14px;
@@ -3733,6 +3834,19 @@ ul.ztree.zTreeDragUL {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-select-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 .bi-multi-select-insert-combo .multi-select-trigger-icon-button {
@@ -3742,6 +3856,19 @@ ul.ztree.zTreeDragUL {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-select-insert-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 
@@ -3787,6 +3914,19 @@ ul.ztree.zTreeDragUL {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-tree-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-multi-tree-popup .popup-view-tree {
   min-height: 170px;
@@ -3865,6 +4005,19 @@ ul.ztree.zTreeDragUL {
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-single-select-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-single-slider-label {
   min-height: 50px;

dist/fineui.ie.js

@@ -44100,10 +44100,6 @@ BI.Editor = BI.inherit(BI.Single, {
         return this.editor.getLastValidValue();
     },
 
-    resetLastValidValue: function () {
-        this.editor.resetLastValidValue();
-    },
-
     getValue: function () {
         if (!this.isValid()) {
             return BI.trim(this.editor.getLastValidValue());

dist/fineui.js

@@ -44504,10 +44504,6 @@ BI.Editor = BI.inherit(BI.Single, {
         return this.editor.getLastValidValue();
     },
 
-    resetLastValidValue: function () {
-        this.editor.resetLastValidValue();
-    },
-
     getValue: function () {
         if (!this.isValid()) {
             return BI.trim(this.editor.getLastValidValue());

dist/fineui_without_jquery_polyfill.js

@@ -32110,10 +32110,6 @@ BI.Editor = BI.inherit(BI.Single, {
         return this.editor.getLastValidValue();
     },
 
-    resetLastValidValue: function () {
-        this.editor.resetLastValidValue();
-    },
-
     getValue: function () {
         if (!this.isValid()) {
             return BI.trim(this.editor.getLastValidValue());

dist/widget.css

@@ -48,6 +48,19 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-select-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 .bi-multi-select-insert-combo .multi-select-trigger-icon-button {
@@ -57,6 +70,19 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-select-insert-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 
@@ -102,6 +128,19 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-tree-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-multi-tree-popup .popup-view-tree {
   min-height: 170px;
@@ -180,6 +219,19 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-single-select-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-single-slider-label {
   min-height: 50px;

src/base/single/editor/editor.js

@@ -298,10 +298,6 @@ BI.Editor = BI.inherit(BI.Single, {
         return this.editor.getLastValidValue();
     },
 
-    resetLastValidValue: function () {
-        this.editor.resetLastValidValue();
-    },
-
     getValue: function () {
         if (!this.isValid()) {
             return BI.trim(this.editor.getLastValidValue());

src/css/base/combo/combo.css

@@ -84,6 +84,15 @@
   border-right: 1px solid #2F3149;
 }
 
+.bi-combo > .bi-trigger .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
 .bi-combo.bi-combo-popup {
   display: block !important;
   visibility: visible !important;
@@ -92,6 +101,10 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 .bi-combo.bi-combo-popup > .bi-border,
 .bi-combo.bi-combo-hover > .bi-border,
@@ -122,6 +135,19 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-search-text-value-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 .bi-icon-text-value-combo.combo-error .bi-text-trigger .select-text-label {

src/css/base/single/button/button.css

@@ -208,6 +208,16 @@ body .bi-button.button-warning.disabled.base-disabled .b-font:before,
 #body .bi-button.button-warning.disabled.base-disabled .b-font:before {
   color: #9ea6b2 !important;
 }
+body .bi-button.button-common.disabled:after,
+#body .bi-button.button-common.disabled:after,
+body .bi-button.button-success.disabled:after,
+#body .bi-button.button-success.disabled:after,
+body .bi-button.button-error.disabled:after,
+#body .bi-button.button-error.disabled:after,
+body .bi-button.button-warning.disabled:after,
+#body .bi-button.button-warning.disabled:after {
+  display: none;
+}
 body .bi-button.button-ignore.disabled,
 #body .bi-button.button-ignore.disabled {
   background: #ffffff !important;
@@ -219,6 +229,10 @@ body .bi-button.button-ignore.disabled .b-font:before,
 #body .bi-button.button-ignore.disabled .b-font:before {
   color: #9ea6b2 !important;
 }
+body .bi-button.button-ignore.disabled:after,
+#body .bi-button.button-ignore.disabled:after {
+  display: none;
+}
 body .bi-button.button-common.disabled.clear,
 #body .bi-button.button-common.disabled.clear,
 body .bi-button.button-success.disabled.clear,
@@ -314,6 +328,41 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
 #body .bi-button.button-ignore.disabled.ghost .b-font:before {
   color: #3685f2 !important;
 }
+.bi-basic-button.button-common:after,
+.bi-basic-button.button-success:after,
+.bi-basic-button.button-warning:after,
+.bi-basic-button.button-error:after {
+  content: "";
+  background-color: #232E40;
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  transform: scale(1, 1);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: transform 0.5s ease, opacity 1s ease;
+  -moz-transition: transform 0.5s ease, opacity 1s ease;
+  -o-transition: transform 0.5s ease, opacity 1s ease;
+  transition: transform 0.5s ease, opacity 1s ease;
+  left: 0;
+  top: 0;
+}
+.bi-basic-button.button-common:active:after,
+.bi-basic-button.button-success:active:after,
+.bi-basic-button.button-warning:active:after,
+.bi-basic-button.button-error:active:after {
+  transform: scale(0, 1);
+  opacity: 0.1;
+  filter: alpha(opacity=10);
+  -webkit-transition: transform 0s;
+  -moz-transition: transform 0s;
+  -o-transition: transform 0s;
+  transition: transform 0s;
+}
 .bi-basic-button.button-common:hover .bi-button-mask,
 .bi-basic-button.button-success:hover .bi-button-mask,
 .bi-basic-button.button-warning:hover .bi-button-mask,
@@ -321,20 +370,46 @@ body .bi-button.button-ignore.disabled.ghost .b-font:before,
   opacity: 0.1;
   filter: alpha(opacity=10);
   background-color: #ffffff;
+  -webkit-transition: opacity 0.3s ease;
+  -moz-transition: opacity 0.3s ease;
+  -o-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
-.bi-basic-button.button-common:active .bi-button-mask,
+.bi-basic-button.button-ignore:after {
-.bi-basic-button.button-success:active .bi-button-mask,
+  content: "";
-.bi-basic-button.button-warning:active .bi-button-mask,
+  background-color: #3685f2;
-.bi-basic-button.button-error:active .bi-button-mask {
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  transform: scale(1, 1);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: transform 0.5s ease, opacity 1s ease;
+  -moz-transition: transform 0.5s ease, opacity 1s ease;
+  -o-transition: transform 0.5s ease, opacity 1s ease;
+  transition: transform 0.5s ease, opacity 1s ease;
+  left: 0;
+  top: 0;
+}
+.bi-basic-button.button-ignore:active:after {
+  transform: scale(0, 1);
   opacity: 0.1;
   filter: alpha(opacity=10);
-  background-color: #232E40;
+  -webkit-transition: transform 0s;
+  -moz-transition: transform 0s;
+  -o-transition: transform 0s;
+  transition: transform 0s;
 }
 .bi-basic-button.button-ignore:hover {
   background-color: rgba(54, 133, 242, 0.05);
-}
+  -webkit-transition: opacity 0.3s ease;
-.bi-basic-button.button-ignore:active {
+  -moz-transition: opacity 0.3s ease;
-  background-color: rgba(54, 133, 242, 0.1);
+  -o-transition: opacity 0.3s ease;
+  transition: opacity 0.3s ease;
 }
 .bi-basic-button .popup-content {
   font-size: 14px;

src/css/widget/multiselect/multiselect.css

@@ -5,6 +5,19 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-select-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 .bi-multi-select-insert-combo .multi-select-trigger-icon-button {
@@ -14,6 +27,19 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-select-insert-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }
 
 

src/css/widget/multitree/multi.css

@@ -5,4 +5,17 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-multi-tree-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }

src/css/widget/singleselect/singleselect.css

@@ -5,4 +5,17 @@
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   transform: rotate(180deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
+}
+.bi-single-select-combo .bi-combo + .bi-trigger-icon-button .x-icon {
+  -webkit-transform: rotate(0deg);
+  -moz-transform: rotate(0deg);
+  transform: rotate(0deg);
+  -webkit-transition: transform 0.3s ease;
+  -moz-transition: transform 0.3s ease;
+  -o-transition: transform 0.3s ease;
+  transition: transform 0.3s ease;
 }

src/less/base/combo/combo.less

@@ -1,5 +1,14 @@
 @import "../../index";
+@val: transform .3s ease;
 .bi-combo {
+  & > .bi-trigger {
+    & .bi-trigger-icon-button{
+      & .x-icon {
+        .rotate(0deg);
+        .transition(@val);
+      }
+    }
+  }
   &.bi-combo-popup {
     display: block !important;
     visibility: visible !important;
@@ -7,6 +16,7 @@
       & .bi-trigger-icon-button{
         & .x-icon {
           .rotate(180deg);
+          .transition(@val);
         }
       }
     }

src/less/base/combo/combo.searchtextvalue.less

@@ -1,5 +1,5 @@
 @import "../../index";
-
+@val: transform .3s ease;
 .bi-search-text-value-combo{
   & .trigger-icon-button{
     font-size: 16px;
@@ -18,6 +18,13 @@
   & .bi-combo.bi-combo-popup + .bi-trigger-icon-button {
     & .x-icon {
       .rotate(180deg);
+      .transition(@val);
+    }
+  }
+  & .bi-combo + .bi-trigger-icon-button {
+    & .x-icon {
+      .rotate(0deg);
+      .transition(@val);
     }
   }
 }

src/less/base/single/button/button.less

@@ -1,5 +1,7 @@
 @import "../../../index";
-
+@hoverVal: opacity .3s ease;
+@activeVal: transform .5s ease, opacity 1s ease;
+@activeStopVal: transform 0s;
 body .bi-button, #body .bi-button {
   .border-radius(2px);
   border: 1px solid @color-bi-border-highlight;
@@ -120,6 +122,9 @@ body .bi-button, #body .bi-button {
       background: @color-bi-background-disabled !important;
       border-color: @color-bi-border-disabled !important;
     }
+    &:after {
+      display: none;
+    }
   }
   &.button-ignore.disabled {
     &, & .b-font:before {
@@ -127,6 +132,9 @@ body .bi-button, #body .bi-button {
     }
     background: @color-bi-background-default !important;
     border-color: @color-bi-border-line !important;
+    &:after {
+      display: none;
+    }
   }
   &.button-common.disabled,
   &.button-success.disabled,
@@ -156,25 +164,56 @@ body .bi-button, #body .bi-button {
 
 .bi-basic-button {
   &.button-common, &.button-success, &.button-warning, &.button-error {
-    &:hover{
+    &:after {
-      & .bi-button-mask {
+      content: "";
+      background-color: @color-bi-button-mask;
+      .border-radius(10px);
+      display: block;
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      transform: scale(1, 1);
+      .opacity(0);
+      .transition(@activeVal);
+      left: 0;
+      top: 0;
+    }
+    &:active:after {
+      transform: scale(0, 1);
       .opacity(0.1);
-        background-color: @color-bi-background-default;
+      .transition(@activeStopVal)
     }
-    }
+    &:hover{
-    &:active{
       & .bi-button-mask {
         .opacity(0.1);
-        background-color: @color-bi-button-mask;
+        background-color: @color-bi-background-default;
+        .transition(@hoverVal);
       }
     }
   }
   &.button-ignore {
+    &:after {
+      content: "";
+      background-color: @color-bi-background-highlight;
+      .border-radius(10px);
+      display: block;
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      transform: scale(1, 1);
+      .opacity(0);
+      .transition(@activeVal);
+      left: 0;
+      top: 0;
+    }
+    &:active:after {
+      transform: scale(0, 1);
+      .opacity(0.1);
+      .transition(@activeStopVal)
+    }
     &:hover{
       background-color: @color-bi-blue-5;
-    }
+      .transition(@hoverVal);
-    &:active{
-      background-color: @color-bi-blue-10;
     }
   }
   & .popup-content{

src/less/widget/multiselect/multiselect.combo.less

@@ -1,5 +1,5 @@
 @import "../../index";
-
+@val: transform .3s ease;
 .bi-multi-select-combo{
   & .multi-select-trigger-icon-button{
     font-size: 16px;
@@ -8,6 +8,13 @@
   & .bi-combo.bi-combo-popup + .bi-trigger-icon-button {
     & .x-icon {
       .rotate(180deg);
+      .transition(@val);
+    }
+  }
+  & .bi-combo + .bi-trigger-icon-button {
+    & .x-icon {
+      .rotate(0deg);
+      .transition(@val);
     }
   }
 }

src/less/widget/multiselect/multiselect.insert.combo.less

@@ -1,5 +1,5 @@
 @import "../../index";
-
+@val: transform .3s ease;
 .bi-multi-select-insert-combo{
   & .multi-select-trigger-icon-button{
     font-size: 16px;
@@ -8,6 +8,13 @@
   & .bi-combo.bi-combo-popup + .bi-trigger-icon-button {
     & .x-icon {
       .rotate(180deg);
+      .transition(@val);
+    }
+  }
+  & .bi-combo + .bi-trigger-icon-button {
+    & .x-icon {
+      .rotate(0deg);
+      .transition(@val);
     }
   }
 }

src/less/widget/multitree/multi.tree.combo.less

@@ -1,5 +1,5 @@
 @import "../../index";
-
+@val: transform .3s ease;
 .bi-multi-tree-combo{
   & .multi-select-trigger-icon-button{
     font-size: 16px;
@@ -8,6 +8,13 @@
   & .bi-combo.bi-combo-popup + .bi-trigger-icon-button {
     & .x-icon {
       .rotate(180deg);
+      .transition(@val);
+    }
+  }
+  & .bi-combo + .bi-trigger-icon-button {
+    & .x-icon {
+      .rotate(0deg);
+      .transition(@val);
     }
   }
 }

src/less/widget/singleselect/singleselect.combo.less

@@ -1,5 +1,5 @@
 @import "../../index";
-
+@val: transform .3s ease;
 .bi-single-select-combo{
   & .single-select-trigger-icon-button{
     font-size: 16px;
@@ -8,6 +8,13 @@
   & .bi-combo.bi-combo-popup + .bi-trigger-icon-button {
     & .x-icon {
       .rotate(180deg);
+      .transition(@val);
+    }
+  }
+  & .bi-combo + .bi-trigger-icon-button {
+    & .x-icon {
+      .rotate(0deg);
+      .transition(@val);
     }
   }
 }