Merging in latest from upstream (VISUAL/fineui:refs/heads/master)

* commit 'd33b3e9fe2e0dcd1a3137c7cb981b485d20d5b7c':
  auto upgrade version to 2.0.20220109145409
  动画
  auto upgrade version to 2.0.20220109143158
  动画
  动画
  auto upgrade version to 2.0.20220109135245
  样式

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fineui",
-  "version": "2.0.20220106142259",
+  "version": "2.0.20220109145409",
   "description": "fineui",
   "main": "dist/fineui.min.js",
   "types": "dist/lib/index.d.ts",

src/case/combo/bubblecombo/combo.bubble.js

@@ -55,9 +55,9 @@ BI.BubbleCombo = BI.inherit(BI.Widget, {
             el: o.el,
             popup: BI.extend({
                 type: "bi.bubble_popup_view",
-            }, o.popup, {
+                animation: "bi-zoom-big",
-                cls: (o.popup.cls || "") + " bi-zoom-big-enter bi-zoom-big-enter-active"
+                animationDuring: 200,
-            })
+            }, o.popup)
         });
         this.combo.on(BI.Combo.EVENT_TRIGGER_CHANGE, function () {
             self.fireEvent(BI.BubbleCombo.EVENT_TRIGGER_CHANGE, arguments);

src/core/4.widget.js

@@ -7,6 +7,15 @@
  */
 
 !(function () {
+    var cancelAnimationFrame =
+        _global.cancelAnimationFrame ||
+        _global.webkitCancelAnimationFrame ||
+        _global.mozCancelAnimationFrame ||
+        _global.oCancelAnimationFrame ||
+        _global.msCancelAnimationFrame ||
+        _global.clearTimeout;
+
+    var requestAnimationFrame = _global.requestAnimationFrame || _global.webkitRequestAnimationFrame || _global.mozRequestAnimationFrame || _global.oRequestAnimationFrame || _global.msRequestAnimationFrame || _global.setTimeout;
     function callLifeHook (self, life) {
         var hooks = [], hook;
         hook = self[life];
@@ -34,6 +43,8 @@
                 tag: null,
                 disabled: false,
                 invisible: false,
+                animation: "",
+                animationDuring: 0,
                 invalid: false,
                 baseCls: "",
                 extraCls: "",
@@ -467,14 +478,50 @@
         },
 
         setVisible: function (visible) {
+            var self = this, o = this.options;
+            var lastVisible = !o.invisible;
             this._setVisible(visible);
             if (visible === true) {
                 // 用this.element.show()会把display属性改成block
                 this.element.css("display", "");
                 this._mount();
+                if (o.animation && !lastVisible) {
+                    this.element.removeClass(o.animation + "-leave").removeClass(o.animation + "-leave-active").addClass(o.animation + "-enter");
+                    if (this._requestAnimationFrame) {
+                        cancelAnimationFrame(this._requestAnimationFrame);
+                    }
+                    this._requestAnimationFrame = function () {
+                        self.element.addClass(o.animation + "-enter-active");
+                    };
+                    requestAnimationFrame(this._requestAnimationFrame);
+                    if (this._animationDuring){
+                        clearTimeout(this._animationDuring);
+                    }
+                    this._animationDuring = setTimeout(function () {
+                        self.element.removeClass(o.animation + "-enter").removeClass(o.animation + "-enter-active");
+                    }, o.animationDuring);
+                }
             } else if (visible === false) {
+                if (o.animation && lastVisible) {
+                    this.element.removeClass(o.animation + "-enter").removeClass(o.animation + "-enter-active").addClass(o.animation + "-leave");
+                    if (this._requestAnimationFrame) {
+                        cancelAnimationFrame(this._requestAnimationFrame);
+                    }
+                    this._requestAnimationFrame = function () {
+                        self.element.addClass(o.animation + "-leave-active");
+                    };
+                    requestAnimationFrame(this._requestAnimationFrame);
+                    if (this._animationDuring){
+                        clearTimeout(this._animationDuring);
+                    }
+                    this._animationDuring = setTimeout(function () {
+                        self.element.removeClass(o.animation + "-leave").removeClass(o.animation + "-leave-active");
+                        self.element.css("display", "none");
+                    }, o.animationDuring);
+                } else {
                     this.element.css("display", "none");
                 }
+            }
             this.fireEvent(BI.Events.VIEW, visible);
         },
 

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

@@ -84,6 +84,19 @@ body .bi-button, #body .bi-button {
       background-color: transparent;
       border-width: 0;
     }
+    &.ghost {
+      &, & .b-font:before {
+        color: @color-bi-text-success-ghost-button;
+      }
+      background-color: transparent;
+      &:hover {
+        color: @color-bi-text;
+        background-color: @color-bi-background-success-button;
+      }
+      &:active {
+        background-color: @color-bi-background-success-button;
+      }
+    }
   }
   &.button-warning {
     & {
@@ -100,6 +113,19 @@ body .bi-button, #body .bi-button {
       background-color: transparent;
       border-width: 0;
     }
+    &.ghost {
+      &, & .b-font:before {
+        color: @color-bi-text-warning-ghost-button;
+      }
+      background-color: transparent;
+      &:hover {
+        color: @color-bi-text;
+        background-color: @color-bi-background-warning-button;
+      }
+      &:active {
+        background-color: @color-bi-background-warning-button;
+      }
+    }
   }
   &.button-error {
     & {
@@ -111,11 +137,24 @@ body .bi-button, #body .bi-button {
     }
     &.clear {
       &, & .b-font:before {
-        color: @color-bi-text-clear-error-button;
+        color: @color-bi-text-error-clear-button;
       }
       background-color: transparent;
       border-width: 0;
     }
+    &.ghost {
+      &, & .b-font:before {
+        color: @color-bi-text-error-ghost-button;
+      }
+      background-color: transparent;
+      &:hover {
+        color: @color-bi-text;
+        background-color: @color-bi-background-error-button;
+      }
+      &:active {
+        background-color: @color-bi-background-error-button;
+      }
+    }
   }
   &.button-common.disabled,
   &.button-success.disabled,
@@ -161,13 +200,45 @@ body .bi-button, #body .bi-button {
     }
     &.ghost {
       &, & .b-font:before {
-        color: @color-bi-text-disabled-ignore-ghost-button !important;
+        // color: @color-bi-text-disabled-ignore-ghost-button !important;
       }
       background: transparent !important;
-      border-color: @color-bi-border-disabled-ignore-ghost-button !important;
+      // border-color: @color-bi-border-disabled-ignore-ghost-button !important;
       .opacity(0.5);
     }
   }
+  &.button-common.disabled {
+    &.ghost {
+      &, & .b-font:before {
+        color: @color-bi-text-disabled-common-ghost-button !important;
+      }
+      border-color: @color-bi-border-disabled-common-ghost-button !important;
+    }
+  }
+  &.button-success.disabled {
+    &.ghost {
+      &, & .b-font:before {
+        color: @color-bi-text-disabled-success-ghost-button !important;
+      }
+      border-color: @color-bi-border-disabled-success-ghost-button !important;
+    }
+  }
+  &.button-warning.disabled {
+    &.ghost {
+      &, & .b-font:before {
+        color: @color-bi-text-disabled-warning-ghost-button !important;
+      }
+      border-color: @color-bi-border-disabled-warning-ghost-button !important;
+    }
+  }
+  &.button-error.disabled {
+    &.ghost {
+      &, & .b-font:before {
+        color: @color-bi-text-disabled-error-ghost-button !important;
+      }
+      border-color: @color-bi-border-disabled-error-ghost-button !important;
+    }
+  }
 }
 
 .bi-basic-button {

src/less/lib/theme.less

@@ -77,14 +77,17 @@
 @color-bi-background-success-button: @color-bi-background-success;
 @color-bi-border-success-button: @color-bi-border-success;
 @color-bi-text-success-clear-button: @color-bi-text-success;
+@color-bi-text-success-ghost-button: @color-bi-text-success;
 @color-bi-text-warning-button: @color-bi-text;
 @color-bi-background-warning-button: @color-bi-background-warning;
 @color-bi-border-warning-button: @color-bi-border-warning;
 @color-bi-text-warning-clear-button: @color-bi-text-redmark;
+@color-bi-text-warning-ghost-button: @color-bi-text-redmark;
 @color-bi-text-error-button: @color-bi-text;
 @color-bi-background-error-button: @color-bi-background-failure;
 @color-bi-border-error-button: @color-bi-border-failure;
-@color-bi-text-clear-error-button: @color-bi-text-failure;
+@color-bi-text-error-clear-button: @color-bi-text-failure;
+@color-bi-text-error-ghost-button: @color-bi-text-failure;
 @color-bi-text-disabled-button: @color-bi-text-disabled;
 @color-bi-background-disabled-button: @color-bi-background-light-disabled;
 @color-bi-border-disabled-button: @color-bi-border-disabled;
@@ -92,8 +95,14 @@
 @color-bi-background-disabled-ignore-button: @color-bi-background-default;
 @color-bi-border-disabled-ignore-button: @color-bi-border-line;
 @color-bi-text-disabled-ignore-clear-button: @color-bi-text-disabled;
-@color-bi-text-disabled-ignore-ghost-button: @color-bi-text-highlight;
+@color-bi-text-disabled-common-ghost-button: @color-bi-text-highlight;
-@color-bi-border-disabled-ignore-ghost-button: @color-bi-border-highlight;
+@color-bi-border-disabled-common-ghost-button: @color-bi-border-highlight;
+@color-bi-text-disabled-success-ghost-button: @color-bi-text-success;
+@color-bi-border-disabled-success-ghost-button: @color-bi-border-success;
+@color-bi-text-disabled-warning-ghost-button: @color-bi-text-redmark;
+@color-bi-border-disabled-warning-ghost-button: @color-bi-border-warning;
+@color-bi-text-disabled-error-ghost-button: @color-bi-text-failure;
+@color-bi-border-disabled-error-ghost-button: @color-bi-border-failure;
 @color-bi-background-disabled-button-theme-dark: @color-bi-background-light-disabled-theme-dark;
 
 // 单选按钮

src/less/motion.less

@@ -52,27 +52,3 @@
     pointer-events: none;
   }
 }
-
-.zoom-big-motion-enter() {
-  transform: scale(0);
-  opacity: 0;
-  animation-timing-function: @ease-out-circ;
-
-  .motion-common(@animation-duration-base);
-  animation-play-state: paused;
-}
-.zoom-big-motion-enter-active() {
-  animation-name: biZoomBigIn;
-  animation-play-state: running;
-}
-
-.zoom-big-motion-leave() {
-  animation-timing-function: @ease-in-out-circ;
-
-  .motion-common-leave(@animation-duration-base);
-}
-.zoom-big-motion-leave-active() {
-  animation-name: biZoomBigOut;
-  animation-play-state: running;
-  pointer-events: none;
-}