bkui-vue 0.0.1-beta.61 → 0.0.1-beta.62

package/lib/sideslider/sideslider.less

@@ -1,14 +1,63 @@
 @import '../styles/themes/themes.less';
 
+.bk-sideslider {
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+
+/* fade-center */
+
+/* slide过渡动画 */
+.slide-enter-active,
+.slide-leave-active,
+.bk-modal-body {
+  transform: translateX(0);
+  transition: transform .25s;
+}
+
+.slide-enter-active {
+  animation: slider-fade-in .25s;
+}
+
+.slide-leave-active {
+  animation: slider-fade-in .25s reverse;
+}
+
+.slide-enter-from,
+.slide-leave-to {
+  &.left {
+    transform: translateX(-100%);
+    transition: transform .25s;
+  }
+
+  &.right {
+    transform: translateX(100%);
+    transition: transform .25s;
+  }
+}
+
+@keyframes slider-fade-in {
+  0% {
+    opacity: 0;
+  }
+
+  100% {
+    opacity: 1;
+  }
+}
+
 .bk-modal-wrapper {
   &.bk-sideslider-wrapper {
-    position: fixed;
+    position: absolute;
     top: 0;
     bottom: 0;
     left: auto;
-    background: #fff;
+    //background: #fff;
     transform: initial;
-    box-shadow: -5px 0 8px -5px rgb(0 0 0 / 20%);
+    //box-shadow: -5px 0 8px -5px rgb(0 0 0 / 20%);
 
     &.scroll-able {
       .bk-modal-content {
@@ -23,7 +72,7 @@
       border-bottom: 1px solid #dcdee5;
 
       .bk-sideslider-close {
-        position: absolute;        
+        position: absolute;
         top: 0;
         width: 30px;
         height: 60px;
@@ -66,7 +115,7 @@
           }
         }
 
-        
+
       }
 
       .bk-sideslider-title {
@@ -82,5 +131,15 @@
         }
       }
     }
+
+    .bk-sideslider-footer {
+      display: flex;
+      width: 100%;
+      height: 54px;
+      background: #fff;
+      border-top: 1px solid transparent;
+      align-items: center;
+    }
   }
-}
+}
+

package/lib/sideslider/sideslider.variable.css

@@ -9,6 +9,7 @@
   --gray-color: #979ba5;
   --light-gray: #c4c6cc;
   --white-color: white;
+  --whitesmoke-color: #fafbfd;
   --disable-color: #dcdee5;
   --font-size-base: 12px;
   --font-size-medium: 14px;
@@ -91,15 +92,56 @@
   --table-body-font-color: #575961;
   --table-row-hover-bg-color: #f5f7fa;
   --table-row-active-bg-color: #f0f1f5;
+  --cascader-panel-border-color: #dcdee5;
+  --cascader-panel-hover: #eaf3ff;
+  --cascader-panel-active: #f4f6fa;
+  --cascader-panel-disabled-bg: #fff;
 }
-.bk-modal-wrapper.bk-sideslider-wrapper {
+.bk-sideslider {
   position: fixed;
   top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+/* 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;
+  }
+}
+.bk-modal-wrapper.bk-sideslider-wrapper {
+  position: absolute;
+  top: 0;
   bottom: 0;
   left: auto;
-  background: #fff;
   transform: initial;
-  box-shadow: -5px 0 8px -5px rgba(0, 0, 0, 0.2);
 }
 .bk-modal-wrapper.bk-sideslider-wrapper.scroll-able .bk-modal-content {
   overflow: auto;
@@ -161,3 +203,11 @@
 .bk-modal-wrapper.bk-sideslider-wrapper .bk-sideslider-header .bk-sideslider-title.right {
   padding: 0px 0px 0px 50px;
 }
+.bk-modal-wrapper.bk-sideslider-wrapper .bk-sideslider-footer {
+  display: flex;
+  width: 100%;
+  height: 54px;
+  background: #fff;
+  border-top: 1px solid transparent;
+  align-items: center;
+}

package/lib/slider/index.d.ts

@@ -23,5 +23,418 @@
  * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
  * IN THE SOFTWARE.
  */
-import Slider from './slider';
+declare const Slider: {
+    new (...args: any[]): {
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            height: string;
+            step: number;
+            vertical: boolean;
+            extCls: string;
+            range: boolean;
+            showInput: boolean;
+            disable: boolean;
+            showTip: boolean;
+            maxValue: number;
+            minValue: number;
+            showInterval: boolean;
+            showIntervalLabel: boolean;
+            showButtonLabel: boolean;
+            showBetweenLabel: boolean;
+            customContent: Record<string, any>;
+            formatterLabel: Function;
+            formatterButtonLabel: Function;
+            formatterTipLabel: Function;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            modelValue: import("vue-types").VueTypeDef<number | unknown[]>;
+            extCls: {
+                type: StringConstructor;
+                default: string;
+            };
+            vertical: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            height: {
+                type: StringConstructor;
+                default: string;
+            };
+            disable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showTip: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            maxValue: {
+                type: NumberConstructor[];
+                default: number;
+            };
+            minValue: {
+                type: NumberConstructor[];
+                default: number;
+            };
+            step: {
+                type: NumberConstructor[];
+                default: number;
+            };
+            range: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showInterval: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showIntervalLabel: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showButtonLabel: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showBetweenLabel: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showInput: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            customContent: {
+                type: ObjectConstructor;
+                default: any;
+            };
+            formatterLabel: {
+                type: FunctionConstructor;
+                default: (value: number) => number;
+            };
+            formatterButtonLabel: {
+                type: FunctionConstructor;
+                default: (value: number) => number;
+            };
+            formatterTipLabel: {
+                type: FunctionConstructor;
+                default: (value: number) => number;
+            };
+        }>> & {
+            onChange?: (...args: any[]) => any;
+            "onUpdate:modelValue"?: (...args: any[]) => any;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "height" | "step" | "vertical" | "extCls" | "range" | "showInput" | "disable" | "showTip" | "maxValue" | "minValue" | "showInterval" | "showIntervalLabel" | "showButtonLabel" | "showBetweenLabel" | "customContent" | "formatterLabel" | "formatterButtonLabel" | "formatterTipLabel">;
+        $attrs: {
+            [x: string]: unknown;
+        };
+        $refs: {
+            [x: string]: unknown;
+        };
+        $slots: Readonly<{
+            [name: string]: import("vue").Slot;
+        }>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>;
+        $emit: (event: "change" | "update:modelValue", ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            modelValue: import("vue-types").VueTypeDef<number | unknown[]>;
+            extCls: {
+                type: StringConstructor;
+                default: string;
+            };
+            vertical: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            height: {
+                type: StringConstructor;
+                default: string;
+            };
+            disable: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showTip: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            maxValue: {
+                type: NumberConstructor[];
+                default: number;
+            };
+            minValue: {
+                type: NumberConstructor[];
+                default: number;
+            };
+            step: {
+                type: NumberConstructor[];
+                default: number;
+            };
+            range: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showInterval: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showIntervalLabel: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showButtonLabel: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showBetweenLabel: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            showInput: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            customContent: {
+                type: ObjectConstructor;
+                default: any;
+            };
+            formatterLabel: {
+                type: FunctionConstructor;
+                default: (value: number) => number;
+            };
+            formatterButtonLabel: {
+                type: FunctionConstructor;
+                default: (value: number) => number;
+            };
+            formatterTipLabel: {
+                type: FunctionConstructor;
+                default: (value: number) => number;
+            };
+        }>> & {
+            onChange?: (...args: any[]) => any;
+            "onUpdate:modelValue"?: (...args: any[]) => any;
+        }, {
+            renderDom: () => JSX.Element;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], string, {
+            height: string;
+            step: number;
+            vertical: boolean;
+            extCls: string;
+            range: boolean;
+            showInput: boolean;
+            disable: boolean;
+            showTip: boolean;
+            maxValue: number;
+            minValue: number;
+            showInterval: boolean;
+            showIntervalLabel: boolean;
+            showButtonLabel: boolean;
+            showBetweenLabel: boolean;
+            customContent: Record<string, any>;
+            formatterLabel: Function;
+            formatterButtonLabel: Function;
+            formatterTipLabel: Function;
+        }> & {
+            beforeCreate?: (() => void) | (() => void)[];
+            created?: (() => void) | (() => void)[];
+            beforeMount?: (() => void) | (() => void)[];
+            mounted?: (() => void) | (() => void)[];
+            beforeUpdate?: (() => void) | (() => void)[];
+            updated?: (() => void) | (() => void)[];
+            activated?: (() => void) | (() => void)[];
+            deactivated?: (() => void) | (() => void)[];
+            beforeDestroy?: (() => void) | (() => void)[];
+            beforeUnmount?: (() => void) | (() => void)[];
+            destroyed?: (() => void) | (() => void)[];
+            unmounted?: (() => void) | (() => void)[];
+            renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
+            errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}>>, info: string) => boolean | void)[];
+        };
+        $forceUpdate: () => void;
+        $nextTick: typeof import("vue").nextTick;
+        $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean>): import("vue").WatchStopHandle;
+    } & Readonly<import("vue").ExtractPropTypes<{
+        modelValue: import("vue-types").VueTypeDef<number | unknown[]>;
+        extCls: {
+            type: StringConstructor;
+            default: string;
+        };
+        vertical: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        height: {
+            type: StringConstructor;
+            default: string;
+        };
+        disable: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        showTip: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        maxValue: {
+            type: NumberConstructor[];
+            default: number;
+        };
+        minValue: {
+            type: NumberConstructor[];
+            default: number;
+        };
+        step: {
+            type: NumberConstructor[];
+            default: number;
+        };
+        range: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        showInterval: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        showIntervalLabel: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        showButtonLabel: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        showBetweenLabel: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        showInput: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        customContent: {
+            type: ObjectConstructor;
+            default: any;
+        };
+        formatterLabel: {
+            type: FunctionConstructor;
+            default: (value: number) => number;
+        };
+        formatterButtonLabel: {
+            type: FunctionConstructor;
+            default: (value: number) => number;
+        };
+        formatterTipLabel: {
+            type: FunctionConstructor;
+            default: (value: number) => number;
+        };
+    }>> & {
+        onChange?: (...args: any[]) => any;
+        "onUpdate:modelValue"?: (...args: any[]) => any;
+    } & import("vue").ShallowUnwrapRef<{
+        renderDom: () => JSX.Element;
+    }> & {} & {} & import("vue").ComponentCustomProperties;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    modelValue: import("vue-types").VueTypeDef<number | unknown[]>;
+    extCls: {
+        type: StringConstructor;
+        default: string;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    height: {
+        type: StringConstructor;
+        default: string;
+    };
+    disable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showTip: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    maxValue: {
+        type: NumberConstructor[];
+        default: number;
+    };
+    minValue: {
+        type: NumberConstructor[];
+        default: number;
+    };
+    step: {
+        type: NumberConstructor[];
+        default: number;
+    };
+    range: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showInterval: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showIntervalLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showButtonLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showBetweenLabel: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showInput: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    customContent: {
+        type: ObjectConstructor;
+        default: any;
+    };
+    formatterLabel: {
+        type: FunctionConstructor;
+        default: (value: number) => number;
+    };
+    formatterButtonLabel: {
+        type: FunctionConstructor;
+        default: (value: number) => number;
+    };
+    formatterTipLabel: {
+        type: FunctionConstructor;
+        default: (value: number) => number;
+    };
+}>> & {
+    onChange?: (...args: any[]) => any;
+    "onUpdate:modelValue"?: (...args: any[]) => any;
+}, {
+    renderDom: () => JSX.Element;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", {
+    height: string;
+    step: number;
+    vertical: boolean;
+    extCls: string;
+    range: boolean;
+    showInput: boolean;
+    disable: boolean;
+    showTip: boolean;
+    maxValue: number;
+    minValue: number;
+    showInterval: boolean;
+    showIntervalLabel: boolean;
+    showButtonLabel: boolean;
+    showBetweenLabel: boolean;
+    customContent: Record<string, any>;
+    formatterLabel: Function;
+    formatterButtonLabel: Function;
+    formatterTipLabel: Function;
+}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("@vue/runtime-core").Plugin;
 export default Slider;