bkui-vue 0.0.1-beta.98 → 0.0.1

package/lib/process/process.less

@@ -6,7 +6,7 @@
   box-sizing: border-box;
 }
 
-.bk-process {
+.@{bk-prefix}-process {
   position: relative;
   display: flex;
 
@@ -16,7 +16,7 @@
     }
   }
 
-  .bk-process-toggle {
+  .@{bk-prefix}-process-toggle {
     position: relative;
     left: 15px;
     width: 24px;
@@ -37,19 +37,25 @@
     }
   }
 
-  .bk-process-icon {
+  .@{bk-prefix}-process-icon {
     &-done {
       display: inline-block;
       font-size: 22px;
       line-height: 18px;
     }
-    
+
+    &-custom {
+      padding-left: 5px;
+    }
+
   }
 
-  .bk-icon {
+  .@{bk-prefix}-icon {
     &.icon-loading {
       display: inline-block;
+      margin-left: 5px;
       font-size: @font-size-medium;
+      vertical-align: sub;
       animation: loadingCircle 1s infinite linear;
     }
   }
@@ -79,6 +85,10 @@
     background-color: #f0f1f5;
     flex: 1;
 
+    .display {
+      vertical-align: top;
+    }
+
     i {
       display: none;
     }
@@ -123,7 +133,7 @@
       content: '';
     }
 
-    .bk-process-step {
+    .@{bk-prefix}-process-step {
       font-size: 12px;
       // color: $fnMainColor;
 
@@ -170,9 +180,27 @@
         border-color: transparent transparent transparent @primary-color;
       }
 
-      >.bk-spin-loading {
+      >.@{bk-prefix}-spin-loading {
         vertical-align: -3px;
       }
     }
+
+    &.error {
+      color: #fff;
+      background: @danger-color;
+
+      &::after {
+        border-color: transparent transparent transparent @danger-color;
+      }
+
+      >.@{bk-prefix}-spin-loading {
+        vertical-align: -3px;
+      }
+
+      .icon-error {
+        font-size: 14px;
+        vertical-align: sub;
+      }
+    }
   }
-}
+}

package/lib/process/process.variable.css

@@ -19,10 +19,11 @@
   --line-height-large: 18px;
   --component-size-small: 26px;
   --component-size-base: 32px;
-  --component-size-large: 38px;
+  --component-size-large: 40px;
   --border-width-base: 1px;
   --border-style-base: solid;
   --border-radius-base: 2px;
+  --border-style-color: var(--light-gray);
   --input-disabled-bg: #fafbfd;
   --input-disabled-border: var(--disable-color);
   --input-height-base: var(--component-size-base);
@@ -32,8 +33,9 @@
   --input-broder-radius: 3px;
   --input-shadow-color: #a3c5fd;
   --input-horizontal-padding: 10px;
-  --input-block-color: #f4f6fa;
-  --input-icon-size: var(--font-size-large);
+  --input-block-color: #f5f7fa;
+  --input-block-hover-color: #eaebf0;
+  --input-icon-size: var(--font-size-medium);
   --input-maxlength-color: #979ba5;
   --button-primary-hover-color: #5594fa;
   --button-danger-hover-color: #ff5656;
@@ -44,6 +46,17 @@
   --button-danger-active-color: #db2626;
   --button-success-active-color: #1ab943;
   --button-warning-active-color: #eb9000;
+  --button-selected-bg-color: #e1ecff;
+  --button-disabled-selected-bg-color: #f0f1f5;
+  --radio-font-color: #63656e;
+  --radio-active-color: #5594fa;
+  --radio-hover-border-color: #979ba5;
+  --radio-disabled-border: #dcdee5;
+  --radio-disabled-font-color: #c4c6cc;
+  --radio-disabled-checked-bg: #a3c5fd;
+  --radio-button-checked-bg: #e1ecff;
+  --radio-button-disabled-checked-bg: #fafbfd;
+  --checkbox-disabled-checked-bg: #a3c5fd;
   --fixed-navbar-background: #fff;
   --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
   --switch-default-color: #fff;
@@ -64,12 +77,16 @@
   --message-color: var(--default-color);
   --message-primary-bg-color: #f0f8ff;
   --message-primary-border-color: #e1ecff;
+  --message-primary-shadow-color: #e1e8f4;
   --message-warning-bg-color: #fff4e2;
   --message-warning-border-color: #ffe8c3;
+  --message-warning-shadow-color: #ede6db;
   --message-success-bg-color: #f2fff4;
   --message-success-border-color: #dcffe2;
+  --message-success-shadow-color: #cef0d7;
   --message-danger-bg-color: #ffeded;
   --message-danger-border-color: #ffdddd;
+  --message-danger-shadow-color: #f6dada;
   --slider-default-bg: #dcdee5;
   --slider-disable-bar-bg: #979ba5;
   --menu-bg-color: #182132;
@@ -89,13 +106,19 @@
   --table-border-color: #dcdee5;
   --table-head-bg-color: #fafbfd;
   --table-head-font-color: #313238;
-  --table-body-font-color: #575961;
+  --table-body-font-color: #63656E;
   --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-hover: #f5f7fa;
+  --cascader-panel-active: #e1ecff;
   --cascader-panel-disabled-bg: #fff;
+  --search-select-focus-border-color: var(--primary-color);
+  --search-select-focus-color: #3c96ff;
+  --search-select-font-color: var(--default-color);
+  --search-select-placeholder-color: var(--light-gray);
+  --search-select-message-color: var(--danger-color);
+  --search-select-menu-border-color: var(--disable-color);
 }
 * {
   box-sizing: border-box;
@@ -133,9 +156,14 @@
   font-size: 22px;
   line-height: 18px;
 }
+.bk-process .bk-process-icon-custom {
+  padding-left: 5px;
+}
 .bk-process .bk-icon.icon-loading {
   display: inline-block;
+  margin-left: 5px;
   font-size: var(--font-size-medium);
+  vertical-align: sub;
   animation: loadingCircle 1s infinite linear;
 }
 .bk-process > ul {
@@ -160,6 +188,9 @@
   background-color: #f0f1f5;
   flex: 1;
 }
+.bk-process li .display {
+  vertical-align: top;
+}
 .bk-process li i {
   display: none;
 }
@@ -235,3 +266,17 @@
 .bk-process li.current > .bk-spin-loading {
   vertical-align: -3px;
 }
+.bk-process li.error {
+  color: #fff;
+  background: var(--danger-color);
+}
+.bk-process li.error::after {
+  border-color: transparent transparent transparent var(--danger-color);
+}
+.bk-process li.error > .bk-spin-loading {
+  vertical-align: -3px;
+}
+.bk-process li.error .icon-error {
+  font-size: 14px;
+  vertical-align: sub;
+}

package/lib/progress/index.d.ts

@@ -2,96 +2,69 @@ declare const BkProgress: {
     new (...args: any[]): {
         $: import("vue").ComponentInternalInstance;
         $data: {};
-        $props: Partial<{
-            fixed: number;
-            type: string;
-            theme: string;
-            width: number;
-            color: string;
-            extCls: string;
-            strokeLinecap: string;
-            strokeWidth: number;
-            format: (...args: any[]) => any;
-            percent: number;
-            bgColor: string;
-            titleStyle: {
+        $props: {
+            type?: string;
+            fixed?: number;
+            width?: number;
+            extCls?: string;
+            theme?: "success" | "warning" | "danger" | "primary";
+            color?: string;
+            strokeLinecap?: string;
+            strokeWidth?: number;
+            format?: (...args: any[]) => any;
+            percent?: number;
+            bgColor?: string;
+            titleStyle?: {
                 [key: string]: any;
             };
-            showText: boolean;
-            textInside: boolean;
-        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
-            extCls: import("vue-types").VueTypeValidableDef<string> & {
-                default: string;
-            };
-            type: import("vue-types").VueTypeValidableDef<string> & {
-                default: string;
-            } & {
-                validator: import("vue-types/dist/types").ValidatorFunction<unknown>;
-            } & {
-                default: string;
-            };
-            percent: import("vue-types").VueTypeValidableDef<number> & {
-                default: number;
-            } & {
-                default: number;
-            };
-            theme: import("vue-types").VueTypeDef<string> & {
-                default: string;
-            };
-            size: import("vue-types").VueTypeDef<string>;
-            width: import("vue-types").VueTypeValidableDef<number> & {
-                default: number;
-            } & {
-                default: number;
-            };
-            strokeWidth: import("vue-types").VueTypeValidableDef<number> & {
-                default: number;
-            };
-            strokeLinecap: import("vue-types").VueTypeValidableDef<string> & {
-                default: string;
-            } & {
-                default: string;
-            };
-            textInside: import("vue-types").VueTypeValidableDef<boolean> & {
-                default: boolean;
-            } & {
-                default: boolean;
-            };
-            showText: import("vue-types").VueTypeValidableDef<boolean> & {
-                default: boolean;
-            } & {
-                default: boolean;
-            };
-            color: import("vue-types").VueTypeValidableDef<string> & {
-                default: string;
-            };
-            bgColor: import("vue-types").VueTypeValidableDef<string> & {
-                default: string;
-            };
-            fixed: import("vue-types").VueTypeValidableDef<number> & {
-                default: number;
-            } & {
-                validator: import("vue-types/dist/types").ValidatorFunction<unknown>;
-            } & {
-                default: number;
-            };
-            format: import("vue-types").VueTypeValidableDef<(...args: any[]) => any> & {
-                default: (...args: any[]) => any;
-            } & {
-                default: (...args: any[]) => any;
-            };
-            titleStyle: import("vue-types").VueTypeValidableDef<{
+            showText?: boolean;
+            textInside?: boolean;
+            class?: unknown;
+            style?: unknown;
+            key?: string | number | symbol;
+            ref?: import("vue").VNodeRef;
+            ref_for?: boolean;
+            ref_key?: string;
+            onVnodeBeforeMount?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
                 [key: string]: any;
-            }> & {
-                default: () => {
-                    [key: string]: any;
-                };
-            } & {
-                default: () => {
-                    [key: string]: any;
-                };
-            };
-        }>> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "fixed" | "type" | "theme" | "width" | "color" | "extCls" | "strokeLinecap" | "strokeWidth" | "format" | "percent" | "bgColor" | "titleStyle" | "showText" | "textInside">;
+            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void)[];
+            onVnodeMounted?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void)[];
+            onVnodeBeforeUpdate?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void)[];
+            onVnodeUpdated?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void)[];
+            onVnodeBeforeUnmount?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void)[];
+            onVnodeUnmounted?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+                [key: string]: any;
+            }>) => void)[];
+            readonly size?: "small" | "large" | "default";
+        };
         $attrs: {
             [x: string]: unknown;
         };
@@ -99,10 +72,10 @@ declare const BkProgress: {
             [x: string]: unknown;
         };
         $slots: Readonly<{
-            [name: string]: import("vue").Slot;
+            [name: string]: import("vue").Slot<any>;
         }>;
-        $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, {}>>;
+        $root: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}>;
+        $parent: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}>;
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
         $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
@@ -121,10 +94,10 @@ declare const BkProgress: {
             } & {
                 default: number;
             };
-            theme: import("vue-types").VueTypeDef<string> & {
-                default: string;
+            theme: import("vue-types").VueTypeDef<"success" | "warning" | "danger" | "primary"> & {
+                default: "success" | "warning" | "danger" | "primary";
             };
-            size: import("vue-types").VueTypeDef<string>;
+            size: import("vue-types").VueTypeDef<"small" | "large" | "default">;
             width: import("vue-types").VueTypeValidableDef<number> & {
                 default: number;
             } & {
@@ -177,18 +150,20 @@ declare const BkProgress: {
                     [key: string]: any;
                 };
             };
-        }>>, {}, unknown, {}, {
+        }>>, {
+            resolveClassName: (cls: string) => string;
+        }, unknown, {}, {
             validPercent(percent?: number): number;
-            renderProcessInfo(): JSX.Element | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+            renderProcessInfo(): import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
                 [key: string]: any;
-            }>[];
-        }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
-            fixed: number;
+            }>[] | JSX.Element;
+        }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
             type: string;
-            theme: string;
+            fixed: number;
             width: number;
-            color: string;
             extCls: string;
+            theme: "success" | "warning" | "danger" | "primary";
+            color: string;
             strokeLinecap: string;
             strokeWidth: number;
             format: (...args: any[]) => any;
@@ -199,7 +174,7 @@ declare const BkProgress: {
             };
             showText: boolean;
             textInside: boolean;
-        }> & {
+        }, {}, string, {}> & {
             beforeCreate?: (() => void) | (() => void)[];
             created?: (() => void) | (() => void)[];
             beforeMount?: (() => void) | (() => void)[];
@@ -214,11 +189,11 @@ declare const BkProgress: {
             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)[];
+            errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}>, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, import("vue").ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}>, 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;
+        $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: import("vue").WatchOptions<boolean>): import("vue").WatchStopHandle;
     } & Readonly<import("vue").ExtractPropTypes<{
         extCls: import("vue-types").VueTypeValidableDef<string> & {
             default: string;
@@ -235,10 +210,10 @@ declare const BkProgress: {
         } & {
             default: number;
         };
-        theme: import("vue-types").VueTypeDef<string> & {
-            default: string;
+        theme: import("vue-types").VueTypeDef<"success" | "warning" | "danger" | "primary"> & {
+            default: "success" | "warning" | "danger" | "primary";
         };
-        size: import("vue-types").VueTypeDef<string>;
+        size: import("vue-types").VueTypeDef<"small" | "large" | "default">;
         width: import("vue-types").VueTypeValidableDef<number> & {
             default: number;
         } & {
@@ -291,12 +266,14 @@ declare const BkProgress: {
                 [key: string]: any;
             };
         };
-    }>> & import("vue").ShallowUnwrapRef<{}> & {} & {} & {
+    }>> & import("vue").ShallowUnwrapRef<{
+        resolveClassName: (cls: string) => string;
+    }> & {} & {
         validPercent(percent?: number): number;
-        renderProcessInfo(): JSX.Element | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        renderProcessInfo(): import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
             [key: string]: any;
-        }>[];
-    } & import("vue").ComponentCustomProperties;
+        }>[] | JSX.Element;
+    } & import("vue").ComponentCustomProperties & {};
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
@@ -316,10 +293,10 @@ declare const BkProgress: {
     } & {
         default: number;
     };
-    theme: import("vue-types").VueTypeDef<string> & {
-        default: string;
+    theme: import("vue-types").VueTypeDef<"success" | "warning" | "danger" | "primary"> & {
+        default: "success" | "warning" | "danger" | "primary";
     };
-    size: import("vue-types").VueTypeDef<string>;
+    size: import("vue-types").VueTypeDef<"small" | "large" | "default">;
     width: import("vue-types").VueTypeValidableDef<number> & {
         default: number;
     } & {
@@ -372,18 +349,20 @@ declare const BkProgress: {
             [key: string]: any;
         };
     };
-}>>, {}, unknown, {}, {
+}>>, {
+    resolveClassName: (cls: string) => string;
+}, unknown, {}, {
     validPercent(percent?: number): number;
-    renderProcessInfo(): JSX.Element | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    renderProcessInfo(): import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
-    }>[];
-}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, {
-    fixed: number;
+    }>[] | JSX.Element;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
     type: string;
-    theme: string;
+    fixed: number;
     width: number;
-    color: string;
     extCls: string;
+    theme: "success" | "warning" | "danger" | "primary";
+    color: string;
     strokeLinecap: string;
     strokeWidth: number;
     format: (...args: any[]) => any;
@@ -394,5 +373,5 @@ declare const BkProgress: {
     };
     showText: boolean;
     textInside: boolean;
-}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("@vue/runtime-core").Plugin;
+}, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("vue").Plugin<any[]>;
 export default BkProgress;

package/lib/progress/index.js

@@ -1 +1 @@
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("../shared"),require("vue"));else if("function"==typeof define&&define.amd)define(["../shared","vue"],t);else{var r="object"==typeof exports?t(require("../shared"),require("vue")):t(e["../shared"],e.vue);for(var o in r)("object"==typeof exports?exports:e)[o]=r[o]}}(self,((e,t)=>(()=>{"use strict";var r={4212:t=>{t.exports=e},748:e=>{e.exports=t}},o={};function s(e){var t=o[e];if(void 0!==t)return t.exports;var n=o[e]={exports:{}};return r[e](n,n.exports,s),n.exports}s.d=(e,t)=>{for(var r in t)s.o(t,r)&&!s.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},s.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),s.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{s.r(n),s.d(n,{default:()=>i});var e=s(4212),t=s(748);const r=function(e,r){var o=r.attrs,s=r.slots,n=o.width,c=o.percent,a=o.strokeWidth,i=o.color,l=o.strokeLinecap,p=o.theme,d=o.type,u=o.bgColor,f=o.titleStyle,y=a||6,h=n||126,b={width:"number"==typeof h?"".concat(h,"px"):h,height:"number"==typeof h?"".concat(h,"px"):h,fontSize:"".concat(.15*h+6,"px")},v=50-y/2,x="dashboard"===d,g=2*Math.PI*v,m=x?.75:1,P="".concat(-1*g*(1-m)/2,"px"),k={strokeDasharray:"".concat(g*m,"px, ").concat(g,"px"),strokeDashoffset:P},T={strokeDasharray:"".concat(g*m*(c/100),"px, ").concat(g,"px"),strokeDashoffset:P,transition:"stroke-dasharray 0.6s ease 0s, stroke 0.6s ease"},j="\n    M 50 50\n    m 0 ".concat(x?"":"-").concat(v,"\n    a ").concat(v," ").concat(v," 0 1 1 0 ").concat(x?"-":"").concat(2*v,"\n    a ").concat(v," ").concat(v," 0 1 1 0 ").concat(x?"":"-").concat(2*v,"\n  "),N={d:j,stroke:u||"#f5f5f5","stroke-linecap":l,"stroke-width":y,"fill-opacity":"0",class:"process-circle-trail",style:k},V={d:j,stroke:i||"#13ce66","stroke-linecap":l,"stroke-width":c>0&&y||0,"fill-opacity":"0",class:"process-circle-path bk-".concat(p,"-circle-trail"),style:T};return(0,t.createVNode)("div",{class:"progress-outer-circle",style:b},[(0,t.createVNode)("svg",{viewBox:"0 0 100 100"},[(0,t.createVNode)("path",N,null),(0,t.createVNode)("path",V,null)]),(0,t.createVNode)("span",{class:"progress-circle-text",style:f},[null==s?void 0:s.default()])])},o=function(e,r){var o,s,n=r.attrs,c=r.slots,a=n.percent,i=n.strokeWidth,l=n.size,p=n.color,d=n.titleStyle,u=n.showText,f=n.textInside,y=n.theme,h={height:"".concat(i,"px"),lineHeight:"".concat(i,"px")},b={width:"".concat(a,"%"),background:p,animationDuration:"3s"},v=function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];return(u||c.default)&&(e&&f||!e&&!f)?null==c?void 0:c.default():null};return(0,t.createVNode)("div",{class:"progress-outer"},[(0,t.createVNode)("div",{class:"bk-progress-".concat(l||"normal"," progress-bar"),style:h},[(0,t.createVNode)("div",{style:b,class:(o={"progress-inner":!0},s="bk-".concat(y),!0,s in o?Object.defineProperty(o,s,{value:true,enumerable:!0,configurable:!0,writable:!0}):o[s]=true,o)},[(0,t.createVNode)("div",{class:"inner-text",style:d},[v()])])]),v(!1)])};function c(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!(0,t.isVNode)(e)}const a=(0,t.defineComponent)({name:"Progress",props:{extCls:e.PropTypes.string,type:e.PropTypes.string.validate((function(e){return["line","circle","dashboard"].includes(e)})).def("line"),percent:e.PropTypes.number.def(0),theme:e.PropTypes.theme().def("primary"),size:e.PropTypes.size(),width:e.PropTypes.number.def(126),strokeWidth:e.PropTypes.number,strokeLinecap:e.PropTypes.string.def("round"),textInside:e.PropTypes.bool.def(!1),showText:e.PropTypes.bool.def(!0),color:e.PropTypes.string,bgColor:e.PropTypes.string,fixed:e.PropTypes.number.validate((function(e){return e>=0&&e<=20})).def(0),format:e.PropTypes.func.def((function(e){return"".concat(e,"%")})),titleStyle:e.PropTypes.object.def({fontSize:"16px",verticalAlign:"middle"})},setup:function(){return{}},methods:{validPercent:function(e){return!e||e<0?0:e>100?100:e},renderProcessInfo:function(){var e,r=this.$props,o=r.showText,s=r.format,n=r.percent,c=r.textInside,a=r.titleStyle,i=r.fixed,l=s(null===(e=this.validPercent(n))||void 0===e?void 0:e.toFixed(i));return(o||this.$slots.default)&&c?this.$slots.default?this.$slots.default():(0,t.createVNode)("span",null,[l]):!o||c?null:(0,t.createVNode)("span",{class:"progress-text",style:"string"==typeof l?a:void 0},[this.$slots.default?this.$slots.default():l])}},render:function(){var s=this.renderProcessInfo(),n=Object.assign(Object.assign({},this.$props),{percent:this.validPercent(this.percent)}),a=(0,t.createVNode)(o,n,c(s)?s:{default:function(){return[s]}});"circle"!==this.type&&"dashboard"!==this.type||(a=(0,t.createVNode)(r,n,c(s)?s:{default:function(){return[s]}}));var i={class:(0,e.classes)({extCls:!!this.extCls},"bk-progress bk-progress-".concat(this.type))};return(0,t.createVNode)("div",i,[a])}}),i=(0,e.withInstall)(a)})(),n})()));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("../shared"),require("vue"),require("../config-provider"));else if("function"==typeof define&&define.amd)define(["../shared","vue","../config-provider"],t);else{var r="object"==typeof exports?t(require("../shared"),require("vue"),require("../config-provider")):t(e["../shared"],e.vue,e["../config-provider"]);for(var o in r)("object"==typeof exports?exports:e)[o]=r[o]}}(self,((e,t,r)=>(()=>{"use strict";var o={2717:e=>{e.exports=r},4212:t=>{t.exports=e},748:e=>{e.exports=t}},s={};function n(e){var t=s[e];if(void 0!==t)return t.exports;var r=s[e]={exports:{}};return o[e](r,r.exports,n),r.exports}n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var c={};return(()=>{n.r(c),n.d(c,{default:()=>d});var e=n(4212),t=n(748),r=n(2717);const o=function(e,o){var s=o.attrs,n=o.slots,c=(0,r.usePrefix)().resolveClassName,i=s.width,a=s.percent,l=s.strokeWidth,p=s.color,d=s.strokeLinecap,u=s.theme,f=s.type,y=s.bgColor,h=s.titleStyle,v=l||6,b=i||126,m={width:"number"==typeof b?"".concat(b,"px"):b,height:"number"==typeof b?"".concat(b,"px"):b,fontSize:"".concat(.15*b+6,"px")},x=50-v/2,g="dashboard"===f,P=2*Math.PI*x,T=g?.75:1,N="".concat(-1*P*(1-T)/2,"px"),S={strokeDasharray:"".concat(P*T,"px, ").concat(P,"px"),strokeDashoffset:N},k={strokeDasharray:"".concat(P*T*(a/100),"px, ").concat(P,"px"),strokeDashoffset:N,transition:"stroke-dasharray 0.6s ease 0s, stroke 0.6s ease"},j="\n    M 50 50\n    m 0 ".concat(g?"":"-").concat(x,"\n    a ").concat(x," ").concat(x," 0 1 1 0 ").concat(g?"-":"").concat(2*x,"\n    a ").concat(x," ").concat(x," 0 1 1 0 ").concat(g?"":"-").concat(2*x,"\n  "),w={d:j,stroke:y||"#f5f5f5","stroke-linecap":d,"stroke-width":v,"fill-opacity":"0",class:"process-circle-trail",style:S},V={d:j,stroke:p||"#13ce66","stroke-linecap":d,"stroke-width":a>0&&v||0,"fill-opacity":"0",class:"process-circle-path ".concat(c("".concat(u,"-circle-trail"))),style:k};return(0,t.createVNode)("div",{class:"progress-outer-circle",style:m},[(0,t.createVNode)("svg",{viewBox:"0 0 100 100"},[(0,t.createVNode)("path",w,null),(0,t.createVNode)("path",V,null)]),(0,t.createVNode)("span",{class:"progress-circle-text",style:h},[null==n?void 0:n.default()])])};function s(e){return s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s(e)}function i(e){var t=function(e,t){if("object"!==s(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,"string");if("object"!==s(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"===s(t)?t:String(t)}const a=function(e,o){var s,n,c=o.attrs,a=o.slots,l=(0,r.usePrefix)().resolveClassName,p=c.percent,d=c.strokeWidth,u=c.size,f=c.color,y=c.titleStyle,h=c.showText,v=c.textInside,b=c.theme,m={height:"".concat(d,"px"),lineHeight:"".concat(d,"px")},x={width:"".concat(p,"%"),background:f,animationDuration:"3s"},g=function(){var e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];return(h||a.default)&&(e&&v||!e&&!v)?null==a?void 0:a.default():null};return(0,t.createVNode)("div",{class:"progress-outer"},[(0,t.createVNode)("div",{class:"".concat(l("progress-".concat(u||"normal"))," progress-bar"),style:m},[(0,t.createVNode)("div",{style:x,class:(s={"progress-inner":!0},n="".concat(l("".concat(b))),!0,(n=i(n))in s?Object.defineProperty(s,n,{value:true,enumerable:!0,configurable:!0,writable:!0}):s[n]=true,s)},[(0,t.createVNode)("div",{class:"inner-text",style:y},[g()])])]),g(!1)])};function l(e){return"function"==typeof e||"[object Object]"===Object.prototype.toString.call(e)&&!(0,t.isVNode)(e)}const p=(0,t.defineComponent)({name:"Progress",props:{extCls:e.PropTypes.string,type:e.PropTypes.string.validate((function(e){return["line","circle","dashboard"].includes(e)})).def("line"),percent:e.PropTypes.number.def(0),theme:e.PropTypes.theme().def(e.ThemeEnum.PRIMARY),size:e.PropTypes.size(),width:e.PropTypes.number.def(126),strokeWidth:e.PropTypes.number,strokeLinecap:e.PropTypes.string.def("round"),textInside:e.PropTypes.bool.def(!1),showText:e.PropTypes.bool.def(!0),color:e.PropTypes.string,bgColor:e.PropTypes.string,fixed:e.PropTypes.number.validate((function(e){return e>=0&&e<=20})).def(0),format:e.PropTypes.func.def((function(e){return"".concat(e,"%")})),titleStyle:e.PropTypes.object.def({fontSize:"16px",verticalAlign:"middle"})},setup:function(){return{resolveClassName:(0,r.usePrefix)().resolveClassName}},methods:{validPercent:function(e){return!e||e<0?0:e>100?100:e},renderProcessInfo:function(){var e,r=this.$props,o=r.showText,s=r.format,n=r.percent,c=r.textInside,i=r.titleStyle,a=r.fixed,l=s(null===(e=this.validPercent(n))||void 0===e?void 0:e.toFixed(a));return(o||this.$slots.default)&&c?this.$slots.default?this.$slots.default():(0,t.createVNode)("span",null,[l]):!o||c?null:(0,t.createVNode)("span",{class:"progress-text",style:"string"==typeof l?i:void 0},[this.$slots.default?this.$slots.default():l])}},render:function(){var r=this.renderProcessInfo(),s=Object.assign(Object.assign({},this.$props),{percent:this.validPercent(this.percent)}),n=(0,t.createVNode)(a,s,l(r)?r:{default:function(){return[r]}});"circle"!==this.type&&"dashboard"!==this.type||(n=(0,t.createVNode)(o,s,l(r)?r:{default:function(){return[r]}}));var c={class:(0,e.classes)({extCls:!!this.extCls},"".concat(this.resolveClassName("progress")," ").concat(this.resolveClassName("progress-".concat(this.type))))};return(0,t.createVNode)("div",c,[n])}}),d=(0,e.withInstall)(p)})(),c})()));

package/lib/progress/progress.css

@@ -27,6 +27,49 @@
   content: '';
   visibility: hidden;
 }
+.bk-popper {
+  display: none;
+  padding: 7px 14px;
+  font-size: 12px;
+  color: #fff;
+  background: #333;
+  border-radius: 4px;
+}
+.bk-popper.light {
+  color: #63656e;
+  background: #fff;
+  box-shadow: #dcdee5 0 0 6px 0;
+}
+.bk-popper .bk-popper-arrow,
+.bk-popper .bk-popper-arrow::before {
+  position: absolute;
+  width: 8px;
+  height: 8px;
+  background: inherit;
+}
+.bk-popper .bk-popper-arrow {
+  visibility: hidden;
+}
+.bk-popper .bk-popper-arrow::before {
+  content: '';
+  visibility: visible;
+  transform: rotate(45deg);
+}
+.bk-popper[data-show] {
+  display: block;
+}
+.bk-popper[data-popper-placement^='top'] > .bk-popper-arrow {
+  bottom: -4px;
+}
+.bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow {
+  top: -4px;
+}
+.bk-popper[data-popper-placement^='left'] > .bk-popper-arrow {
+  right: -4px;
+}
+.bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
+  left: -4px;
+}
 .bk-progress {
   display: inline-block;
 }