bkui-vue 2.0.1-beta.7 → 2.0.1-beta.70.search.1

package/lib/sideslider/sideslider.less

@@ -1,34 +1,31 @@
 @import '../styles/themes/themes.less';
 
 .@{bk-prefix}-sideslider {
-  &.is-position-right {
-    .@{bk-prefix}-modal-wrapper {
-      right: 0;
-    }
-  }
-
-  &.is-position-left {
-    .@{bk-prefix}-modal-wrapper {
-      left: 0;
-    }
-
-    .@{bk-prefix}-sideslider-header {
-      flex-direction: row-reverse;
-    }
-  }
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
 
   .@{bk-prefix}-modal-wrapper {
-    position: fixed;
+    position: absolute;
     top: 0;
     bottom: 0;
-  }
+    left: auto;
+    transform: initial;
 
+    &.scroll-able {
+      .@{bk-prefix}-modal-content {
+        overflow: auto;
+      }
+    }
+  }
   .@{bk-prefix}-modal-footer {
     &.is-fixed {
       .@{bk-prefix}-sideslider-footer {
+        height: 54px;
         margin: 0;
-        background: #fafbfd;
-        box-shadow: 0 -1px 0 0 #dcdee5;
+        border-top: 1px solid transparent;
         box-shadow: rgb(0 0 0 / 6%) 0 -2px 4px 0;
       }
     }
@@ -36,38 +33,121 @@
 }
 
 .@{bk-prefix}-sideslider-header {
-  display: flex;
+  width: 100%;
   height: 52px;
   background: #fff;
   border-bottom: 1px solid #dcdee5;
 }
 
 .@{bk-prefix}-sideslider-close {
-  display: flex;
-  align-items: center;
-  justify-content: center;
+  position: absolute;
+  top: 0;
   width: 30px;
-  font-size: 26px;
+  height: 52px;
+  font-size: 24px;
+  line-height: 52px;
   color: #fff;
+  text-align: center;
   cursor: pointer;
   background-color: @primary-color;
+
+  &.right {
+    left: 0;
+
+    &::before {
+      top: 50%;
+      left: 50%;
+      display: inline-block;
+      width: 8px;
+      height: 8px;
+      border-top: solid 2px #fff;
+      border-right: solid 2px #fff;
+      content: '';
+      transform: translate(-50%, -50%) rotate(45deg);
+    }
+  }
+
+  &.left {
+    right: 0;
+
+    &::before {
+      top: 50%;
+      left: 50%;
+      display: inline-block;
+      width: 8px;
+      height: 8px;
+      border-top: solid 2px #fff;
+      border-left: solid 2px #fff;
+      content: '';
+      transform: translate(50%, -50%) rotate(-45deg);
+    }
+  }
 }
 
 .@{bk-prefix}-sideslider-title {
   display: flex;
-  padding-left: 16px;
+  height: 52px;
+  padding-left: 30px;
   font-size: 16px;
   color: #313238;
   align-items: center;
-  flex: 1;
+
+  &.right {
+    width: 100%;
+    padding: 0 0 0 30+16px;
+  }
 }
 
+// .@{bk-prefix}-sideslider-content {
+// }
+
 .@{bk-prefix}-sideslider-footer {
   display: flex;
   width: 100%;
-  height: 48px;
+  height: 54px;
   padding: 0 24px;
   margin-top: 24px;
   background: #fff;
   align-items: center;
 }
+
+/* fade-center */
+
+/* slide过渡动画 */
+.slide-enter-active,
+.slide-leave-active,
+.@{bk-prefix}-modal-body {
+  transform: translateX(0);
+  transition: transform 0.25s;
+}
+
+.slide-enter-active {
+  animation: slider-fade-in 0.25s;
+}
+
+.slide-leave-active {
+  animation: slider-fade-in 0.25s reverse;
+}
+
+.slide-enter-from,
+.slide-leave-to {
+  &.left {
+    transform: translateX(-100%);
+    transition: transform 0.25s;
+  }
+
+  &.right {
+    transform: translateX(100%);
+    transition: transform 0.25s;
+  }
+}
+
+@keyframes slider-fade-in {
+  0% {
+    opacity: 0;
+  }
+
+  100% {
+    opacity: 1;
+  }
+}

package/lib/sideslider/sideslider.variable.css

@@ -127,56 +127,125 @@
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
 }
-.bk-sideslider.is-position-right .bk-modal-wrapper {
+.bk-sideslider {
+  position: fixed;
+  top: 0;
   right: 0;
-}
-.bk-sideslider.is-position-left .bk-modal-wrapper {
+  bottom: 0;
   left: 0;
 }
-.bk-sideslider.is-position-left .bk-sideslider-header {
-  flex-direction: row-reverse;
-}
 .bk-sideslider .bk-modal-wrapper {
-  position: fixed;
+  position: absolute;
   top: 0;
   bottom: 0;
+  left: auto;
+  transform: initial;
+}
+.bk-sideslider .bk-modal-wrapper.scroll-able .bk-modal-content {
+  overflow: auto;
 }
 .bk-sideslider .bk-modal-footer.is-fixed .bk-sideslider-footer {
+  height: 54px;
   margin: 0;
-  background: #fafbfd;
-  box-shadow: 0 -1px 0 0 #dcdee5;
+  border-top: 1px solid transparent;
   box-shadow: rgba(0, 0, 0, 0.06) 0 -2px 4px 0;
 }
 .bk-sideslider-header {
-  display: flex;
+  width: 100%;
   height: 52px;
   background: #fff;
   border-bottom: 1px solid #dcdee5;
 }
 .bk-sideslider-close {
-  display: flex;
-  align-items: center;
-  justify-content: center;
+  position: absolute;
+  top: 0;
   width: 30px;
-  font-size: 26px;
+  height: 52px;
+  font-size: 24px;
+  line-height: 52px;
   color: #fff;
+  text-align: center;
   cursor: pointer;
   background-color: var(--primary-color);
 }
+.bk-sideslider-close.right {
+  left: 0;
+}
+.bk-sideslider-close.right::before {
+  top: 50%;
+  left: 50%;
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-top: solid 2px #fff;
+  border-right: solid 2px #fff;
+  content: '';
+  transform: translate(-50%, -50%) rotate(45deg);
+}
+.bk-sideslider-close.left {
+  right: 0;
+}
+.bk-sideslider-close.left::before {
+  top: 50%;
+  left: 50%;
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-top: solid 2px #fff;
+  border-left: solid 2px #fff;
+  content: '';
+  transform: translate(50%, -50%) rotate(-45deg);
+}
 .bk-sideslider-title {
   display: flex;
-  padding-left: 16px;
+  height: 52px;
+  padding-left: 30px;
   font-size: 16px;
   color: #313238;
   align-items: center;
-  flex: 1;
+}
+.bk-sideslider-title.right {
+  width: 100%;
+  padding: 0 0 0 46px;
 }
 .bk-sideslider-footer {
   display: flex;
   width: 100%;
-  height: 48px;
+  height: 54px;
   padding: 0 24px;
   margin-top: 24px;
   background: #fff;
   align-items: center;
 }
+/* fade-center */
+/* slide过渡动画 */
+.slide-enter-active,
+.slide-leave-active,
+.bk-modal-body {
+  transform: translateX(0);
+  transition: transform 0.25s;
+}
+.slide-enter-active {
+  animation: slider-fade-in 0.25s;
+}
+.slide-leave-active {
+  animation: slider-fade-in 0.25s reverse;
+}
+.slide-enter-from.left,
+.slide-leave-to.left {
+  transform: translateX(-100%);
+  transition: transform 0.25s;
+}
+.slide-enter-from.right,
+.slide-leave-to.right {
+  transform: translateX(100%);
+  transition: transform 0.25s;
+}
+@keyframes slider-fade-in {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}

package/lib/slider/index.d.ts

@@ -98,10 +98,6 @@ declare const Slider: {
             type: FunctionConstructor;
             default: (value: number) => number;
         };
-        labelClick: {
-            type: (BooleanConstructor | FunctionConstructor)[];
-            default: boolean;
-        };
     }>> & {
         onChange?: (...args: any[]) => any;
         "onUpdate:modelValue"?: (...args: any[]) => any;
@@ -181,10 +177,6 @@ declare const Slider: {
             type: FunctionConstructor;
             default: (value: number) => number;
         };
-        labelClick: {
-            type: (BooleanConstructor | FunctionConstructor)[];
-            default: boolean;
-        };
     }>> & {
         onChange?: (...args: any[]) => any;
         "onUpdate:modelValue"?: (...args: any[]) => any;
@@ -207,7 +199,6 @@ declare const Slider: {
         formatterLabel: Function;
         formatterButtonLabel: Function;
         formatterTipLabel: Function;
-        labelClick: boolean | Function;
     }, true, {}, {}, {
         P: {};
         B: {};
@@ -289,10 +280,6 @@ declare const Slider: {
             type: FunctionConstructor;
             default: (value: number) => number;
         };
-        labelClick: {
-            type: (BooleanConstructor | FunctionConstructor)[];
-            default: boolean;
-        };
     }>> & {
         onChange?: (...args: any[]) => any;
         "onUpdate:modelValue"?: (...args: any[]) => any;
@@ -317,7 +304,6 @@ declare const Slider: {
         formatterLabel: Function;
         formatterButtonLabel: Function;
         formatterTipLabel: Function;
-        labelClick: boolean | Function;
     }>;
     __isFragment?: never;
     __isTeleport?: never;
@@ -396,10 +382,6 @@ declare const Slider: {
         type: FunctionConstructor;
         default: (value: number) => number;
     };
-    labelClick: {
-        type: (BooleanConstructor | FunctionConstructor)[];
-        default: boolean;
-    };
 }>> & {
     onChange?: (...args: any[]) => any;
     "onUpdate:modelValue"?: (...args: any[]) => any;
@@ -424,6 +406,5 @@ declare const Slider: {
     formatterLabel: Function;
     formatterButtonLabel: Function;
     formatterTipLabel: Function;
-    labelClick: boolean | Function;
 }, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("vue").Plugin<any[]>;
 export default Slider;

package/lib/slider/index.js

@@ -817,11 +817,7 @@ var off = function off(element, event, handler) {
       "default": function _default(value) {
         return value;
       }
-    },
-    labelClick: {
-      type: [Boolean, Function],
-      "default": false
-    }
+    } // 自定义tip格式
   },
   emits: ['update:modelValue', 'change'],
   setup: function setup(props, _ref) {
@@ -1159,30 +1155,6 @@ var off = function off(element, event, handler) {
     };
     var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
       resolveClassName = _usePrefix.resolveClassName;
-    var handleStepLabelClick = function handleStepLabelClick(e, step) {
-      var _ref3, _step$stepWidth;
-      var percent = (_ref3 = (_step$stepWidth = step.stepWidth) !== null && _step$stepWidth !== void 0 ? _step$stepWidth : step.percent) !== null && _ref3 !== void 0 ? _ref3 : step;
-      if (props.labelClick) {
-        e.stopPropagation();
-        e.stopImmediatePropagation();
-        e.preventDefault();
-        var fnResult;
-        if (typeof props.labelClick === 'function') {
-          var args = {
-            percent: percent,
-            step: step
-          };
-          fnResult = props.labelClick(e, args);
-          if (fnResult === false) {
-            return;
-          }
-        }
-        percent = typeof fnResult === 'number' ? fnResult : percent;
-        console.log('handleStepLabelClick', percent);
-        setPosition(percent);
-        return;
-      }
-    };
     var renderDom = function renderDom() {
       var _slots$start, _slots$end;
       return (0,external_vue_namespaceObject.createVNode)("div", {
@@ -1206,10 +1178,7 @@ var off = function off(element, event, handler) {
           "class": ["".concat(resolveClassName('slider-interval')), {
             vertical: props.vertical
           }],
-          "style": getIntervalStyle(interval),
-          "onClick": function onClick(e) {
-            return handleStepLabelClick(e, interval);
-          }
+          "style": getIntervalStyle(interval)
         }, null);
       }) : null, props.customContent ? customList.value.map(function (custom, index) {
         if (index === 0 || index === customList.value.length - 1) {
@@ -1220,10 +1189,7 @@ var off = function off(element, event, handler) {
           "class": ["".concat(resolveClassName('slider-interval')), {
             vertical: props.vertical
           }],
-          "style": getIntervalStyle(custom.percent),
-          "onClick": function onClick(e) {
-            return handleStepLabelClick(e, custom);
-          }
+          "style": getIntervalStyle(custom.percent)
         }, null);
       }) : undefined, props.showBetweenLabel || props.showIntervalLabel || props.customContent ? (0,external_vue_namespaceObject.createVNode)("div", {
         "class": ["".concat(resolveClassName('slider-labels')), props.vertical ? 'vertical' : 'horizontal']
@@ -1246,10 +1212,7 @@ var off = function off(element, event, handler) {
             return (0,external_vue_namespaceObject.createVNode)("div", {
               "class": ["".concat(resolveClassName('slider-label')), props.vertical ? 'vertical' : 'horizontal'],
               "key": index,
-              "style": getIntervalStyle(intervalLabel.stepWidth),
-              "onClick": function onClick(e) {
-                return handleStepLabelClick(e, intervalLabel);
-              }
+              "style": getIntervalStyle(intervalLabel.stepWidth)
             }, [intervalLabel.stepLabel]);
           });
         }
@@ -1258,10 +1221,7 @@ var off = function off(element, event, handler) {
             return (0,external_vue_namespaceObject.createVNode)("div", {
               "class": ["".concat(resolveClassName('slider-label')), props.vertical ? 'vertical' : 'horizontal'],
               "key": index,
-              "style": getIntervalStyle(item.percent),
-              "onClick": function onClick(e) {
-                return handleStepLabelClick(e, item);
-              }
+              "style": getIntervalStyle(item.percent)
             }, [item.label]);
           });
         }

package/lib/slider/slider.css

@@ -76,20 +76,6 @@
   border-radius: 100%;
   transform: translateX(-50%);
 }
-.bk-slider .bk-slider-interval:hover {
-  cursor: pointer;
-}
-.bk-slider .bk-slider-interval:hover::after {
-  content: '';
-  position: absolute;
-  left: -5px;
-  top: -4px;
-  width: 10px;
-  height: 10px;
-  border-radius: 50%;
-  background-color: #fff;
-  border: solid 1px #3a84ff;
-}
 .bk-slider .bk-slider-interval.vertical {
   left: 2px;
 }

package/lib/slider/slider.d.ts

@@ -99,10 +99,6 @@ declare const _default: import("vue").DefineComponent<{
         type: FunctionConstructor;
         default: (value: number) => number;
     };
-    labelClick: {
-        type: (BooleanConstructor | FunctionConstructor)[];
-        default: boolean;
-    };
 }, {
     renderDom: () => JSX.Element;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
@@ -179,10 +175,6 @@ declare const _default: import("vue").DefineComponent<{
         type: FunctionConstructor;
         default: (value: number) => number;
     };
-    labelClick: {
-        type: (BooleanConstructor | FunctionConstructor)[];
-        default: boolean;
-    };
 }>> & {
     onChange?: (...args: any[]) => any;
     "onUpdate:modelValue"?: (...args: any[]) => any;
@@ -205,6 +197,5 @@ declare const _default: import("vue").DefineComponent<{
     formatterLabel: Function;
     formatterButtonLabel: Function;
     formatterTipLabel: Function;
-    labelClick: boolean | Function;
 }, {}>;
 export default _default;

package/lib/slider/slider.less

@@ -89,21 +89,6 @@
     border-radius: 100%;
     transform: translateX(-50%);
 
-    &:hover {
-      cursor: pointer;
-      &::after {
-        content: '';
-        position: absolute;
-        left: -5px;
-        top: -4px;
-        width: 10px;
-        height: 10px;
-        border-radius: 50%;
-        background-color: #fff;
-        border: solid 1px @primary-color;
-      }
-    }
-
     &.vertical {
       left: 2px;
     }

package/lib/slider/slider.variable.css

@@ -205,20 +205,6 @@
   border-radius: 100%;
   transform: translateX(-50%);
 }
-.bk-slider .bk-slider-interval:hover {
-  cursor: pointer;
-}
-.bk-slider .bk-slider-interval:hover::after {
-  content: '';
-  position: absolute;
-  left: -5px;
-  top: -4px;
-  width: 10px;
-  height: 10px;
-  border-radius: 50%;
-  background-color: #fff;
-  border: solid 1px var(--primary-color);
-}
 .bk-slider .bk-slider-interval.vertical {
   left: 2px;
 }

package/lib/styles/index.d.ts

@@ -20,6 +20,7 @@ import '../modal/modal.less';
 import '../progress/progress.less';
 import '../radio/radio.less';
 import '../rate/rate.less';
+import '../rate/star.less';
 import '../swiper/swiper.less';
 import '../select/select.less';
 import '../sideslider/sideslider.less';

package/lib/table/components/table-cell.d.ts

@@ -1,6 +1,5 @@
-import { Column } from '../props';
 declare const _default: import("vue").DefineComponent<{
-    column: import("vue-types").VueTypeDef<Column>;
+    column: import("vue-types").VueTypeDef<import("../props").Column>;
     row: import("vue-types").VueTypeValidableDef<any> & {
         default: any;
     };
@@ -25,7 +24,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     resizerWay: import("vue-types").VueTypeDef<"debounce" | "throttle">;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    column: import("vue-types").VueTypeDef<Column>;
+    column: import("vue-types").VueTypeDef<import("../props").Column>;
     row: import("vue-types").VueTypeValidableDef<any> & {
         default: any;
     };