bkui-vue 0.0.1-beta.128 → 0.0.1-beta.129

package/lib/button/button.variable.css

@@ -19,7 +19,7 @@
   --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;
@@ -34,7 +34,7 @@
   --input-horizontal-padding: 10px;
   --input-block-color: #f5f7fa;
   --input-block-hover-color: #eaebf0;
-  --input-icon-size: var(--font-size-large);
+  --input-icon-size: var(--font-size-medium);
   --input-maxlength-color: #979ba5;
   --button-primary-hover-color: #5594fa;
   --button-danger-hover-color: #ff5656;
@@ -306,10 +306,12 @@
 .bk-button.bk-button-small {
   height: 26px;
   padding: 3px 12px;
+  font-size: var(--font-size-base);
 }
 .bk-button.bk-button-large {
   height: 38px;
   padding: 8px 20px;
+  font-size: var(--font-size-large);
 }
 .bk-button .bk-button-text {
   display: inline-flex;
@@ -356,10 +358,12 @@
 .bk-button-group.bk-button-group-small .bk-button {
   height: 26px;
   padding: 3px 12px;
+  font-size: var(--font-size-base);
 }
 .bk-button-group.bk-button-group-large .bk-button {
   height: 38px;
   padding: 8px 20px;
+  font-size: var(--font-size-large);
 }
 .bk-button-group .bk-button {
   height: 32px;

package/lib/card/card.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 0px 0px 6px 0px;
+}
+.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-card {
   position: relative;
   display: inline-block;

package/lib/card/card.variable.css

@@ -19,7 +19,7 @@
   --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;
@@ -34,7 +34,7 @@
   --input-horizontal-padding: 10px;
   --input-block-color: #f5f7fa;
   --input-block-hover-color: #eaebf0;
-  --input-icon-size: var(--font-size-large);
+  --input-icon-size: var(--font-size-medium);
   --input-maxlength-color: #979ba5;
   --button-primary-hover-color: #5594fa;
   --button-danger-hover-color: #ff5656;
@@ -129,6 +129,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 0px 0px 6px 0px;
+}
+.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-card {
   position: relative;
   display: inline-block;

package/lib/card/index.d.ts

@@ -1,4 +1,221 @@
-declare const BkCard: import("vue").DefineComponent<{
+declare const BkCard: {
+    new (...args: any[]): {
+        $: import("vue").ComponentInternalInstance;
+        $data: {};
+        $props: Partial<{
+            title: string;
+            position: string;
+            border: boolean;
+            showHeader: boolean;
+            showFooter: boolean;
+            collapseStatus: boolean;
+            disableHeaderStyle: boolean;
+            isEdit: boolean;
+            isCollapse: boolean;
+        }> & Omit<Readonly<import("vue").ExtractPropTypes<{
+            title: import("vue-types").VueTypeValidableDef<string> & {
+                default: string;
+            };
+            showHeader: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            showFooter: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            collapseStatus: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            border: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            disableHeaderStyle: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            position: import("vue-types").VueTypeValidableDef<string> & {
+                default: string;
+            } & {
+                default: string;
+            };
+            isEdit: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            isCollapse: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+        }>> & {
+            "onUpdate:collapseStatus"?: (...args: any[]) => any;
+            onEdit?: (...args: any[]) => any;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "title" | "position" | "border" | "showHeader" | "showFooter" | "collapseStatus" | "disableHeaderStyle" | "isEdit" | "isCollapse">;
+        $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: "update:collapseStatus" | "edit", ...args: any[]) => void;
+        $el: any;
+        $options: import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+            title: import("vue-types").VueTypeValidableDef<string> & {
+                default: string;
+            };
+            showHeader: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            showFooter: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            collapseStatus: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            border: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            disableHeaderStyle: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            position: import("vue-types").VueTypeValidableDef<string> & {
+                default: string;
+            } & {
+                default: string;
+            };
+            isEdit: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+            isCollapse: import("vue-types").VueTypeValidableDef<boolean> & {
+                default: boolean;
+            } & {
+                default: boolean;
+            };
+        }>> & {
+            "onUpdate:collapseStatus"?: (...args: any[]) => any;
+            onEdit?: (...args: any[]) => any;
+        }, {
+            collapseActive: import("vue").Ref<boolean>;
+            showInput: import("vue").Ref<boolean>;
+            renderTitle: import("vue").Ref<string>;
+            handleCollapse: () => void;
+            saveEdit: () => void;
+            clickEdit: () => void;
+        }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:collapseStatus" | "edit")[], string, {
+            title: string;
+            position: string;
+            border: boolean;
+            showHeader: boolean;
+            showFooter: boolean;
+            collapseStatus: boolean;
+            disableHeaderStyle: boolean;
+            isEdit: boolean;
+            isCollapse: boolean;
+        }> & {
+            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<{
+        title: import("vue-types").VueTypeValidableDef<string> & {
+            default: string;
+        };
+        showHeader: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        showFooter: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        collapseStatus: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        border: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        disableHeaderStyle: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        position: import("vue-types").VueTypeValidableDef<string> & {
+            default: string;
+        } & {
+            default: string;
+        };
+        isEdit: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+        isCollapse: import("vue-types").VueTypeValidableDef<boolean> & {
+            default: boolean;
+        } & {
+            default: boolean;
+        };
+    }>> & {
+        "onUpdate:collapseStatus"?: (...args: any[]) => any;
+        onEdit?: (...args: any[]) => any;
+    } & import("vue").ShallowUnwrapRef<{
+        collapseActive: import("vue").Ref<boolean>;
+        showInput: import("vue").Ref<boolean>;
+        renderTitle: import("vue").Ref<string>;
+        handleCollapse: () => void;
+        saveEdit: () => void;
+        clickEdit: () => void;
+    }> & {} & {} & import("vue").ComponentCustomProperties;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
     title: import("vue-types").VueTypeValidableDef<string> & {
         default: string;
     };
@@ -42,6 +259,9 @@ declare const BkCard: import("vue").DefineComponent<{
     } & {
         default: boolean;
     };
+}>> & {
+    "onUpdate:collapseStatus"?: (...args: any[]) => any;
+    onEdit?: (...args: any[]) => any;
 }, {
     collapseActive: import("vue").Ref<boolean>;
     showInput: import("vue").Ref<boolean>;
@@ -49,54 +269,7 @@ declare const BkCard: import("vue").DefineComponent<{
     handleCollapse: () => void;
     saveEdit: () => void;
     clickEdit: () => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:collapseStatus" | "edit")[], "update:collapseStatus" | "edit", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    title: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    };
-    showHeader: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    showFooter: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    collapseStatus: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    border: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    disableHeaderStyle: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    position: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    } & {
-        default: string;
-    };
-    isEdit: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    isCollapse: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-}>> & {
-    "onUpdate:collapseStatus"?: (...args: any[]) => any;
-    onEdit?: (...args: any[]) => any;
-}, {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:collapseStatus" | "edit")[], "update:collapseStatus" | "edit", {
     title: string;
     position: string;
     border: boolean;
@@ -106,5 +279,5 @@ declare const BkCard: import("vue").DefineComponent<{
     disableHeaderStyle: boolean;
     isEdit: boolean;
     isCollapse: boolean;
-}>;
+}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("@vue/runtime-core").Plugin;
 export default BkCard;

package/lib/cascader/cascader.variable.css

@@ -19,7 +19,7 @@
   --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;
@@ -34,7 +34,7 @@
   --input-horizontal-padding: 10px;
   --input-block-color: #f5f7fa;
   --input-block-hover-color: #eaebf0;
-  --input-icon-size: var(--font-size-large);
+  --input-icon-size: var(--font-size-medium);
   --input-maxlength-color: #979ba5;
   --button-primary-hover-color: #5594fa;
   --button-danger-hover-color: #ff5656;

package/lib/checkbox/checkbox.css

@@ -1,7 +1,6 @@
 .bk-checkbox {
   display: inline-flex;
   justify-self: center;
-  margin-right: 30px;
   font-size: 14px;
   line-height: 18px;
   letter-spacing: normal;
@@ -9,6 +8,9 @@
   cursor: pointer;
   user-select: none;
 }
+.bk-checkbox ~ .bk-checkbox {
+  margin-left: 30px;
+}
 .bk-checkbox.is-checked .bk-checkbox-input {
   background: #3a84ff;
   border-color: #3a84ff;
@@ -28,7 +30,7 @@
   border-top: 0;
   border-left: 0;
   content: '';
-  transform: translate(-50%, -50%) scaleY(1) rotate(45deg);
+  transform: translate(-50%, -60%) scaleY(1) rotate(45deg);
   transform-origin: center;
 }
 .bk-checkbox.is-indeterminated .bk-checkbox-input.small::after {

package/lib/checkbox/checkbox.less

@@ -3,13 +3,15 @@
 .@{bk-prefix}-checkbox {
   display: inline-flex;
   justify-self: center;
-  margin-right: 30px;
   font-size: 14px;
   line-height: 18px;
   letter-spacing: normal;
   color: #63656e;
   cursor: pointer;
   user-select: none;
+  &~.@{bk-prefix}-checkbox {
+    margin-left: 30px;
+  }
 
   &.is-checked {
     .bk-checkbox-input {
@@ -34,7 +36,7 @@
         border-top: 0;
         border-left: 0;
         content: '';
-        transform: translate(-50%, -50%) scaleY(1) rotate(45deg);
+        transform: translate(-50%, -60%) scaleY(1) rotate(45deg);
         transform-origin: center;
       }
     }

package/lib/checkbox/checkbox.variable.css

@@ -19,7 +19,7 @@
   --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;
@@ -34,7 +34,7 @@
   --input-horizontal-padding: 10px;
   --input-block-color: #f5f7fa;
   --input-block-hover-color: #eaebf0;
-  --input-icon-size: var(--font-size-large);
+  --input-icon-size: var(--font-size-medium);
   --input-maxlength-color: #979ba5;
   --button-primary-hover-color: #5594fa;
   --button-danger-hover-color: #ff5656;
@@ -103,7 +103,6 @@
 .bk-checkbox {
   display: inline-flex;
   justify-self: center;
-  margin-right: 30px;
   font-size: 14px;
   line-height: 18px;
   letter-spacing: normal;
@@ -111,6 +110,9 @@
   cursor: pointer;
   user-select: none;
 }
+.bk-checkbox ~ .bk-checkbox {
+  margin-left: 30px;
+}
 .bk-checkbox.is-checked .bk-checkbox-input {
   background: var(--primary-color);
   border-color: var(--primary-color);
@@ -130,7 +132,7 @@
   border-top: 0;
   border-left: 0;
   content: '';
-  transform: translate(-50%, -50%) scaleY(1) rotate(45deg);
+  transform: translate(-50%, -60%) scaleY(1) rotate(45deg);
   transform-origin: center;
 }
 .bk-checkbox.is-indeterminated .bk-checkbox-input.small::after {

package/lib/code-diff/code-diff.variable.css

@@ -20,7 +20,7 @@
   --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;
@@ -35,7 +35,7 @@
   --input-horizontal-padding: 10px;
   --input-block-color: #f5f7fa;
   --input-block-hover-color: #eaebf0;
-  --input-icon-size: var(--font-size-large);
+  --input-icon-size: var(--font-size-medium);
   --input-maxlength-color: #979ba5;
   --button-primary-hover-color: #5594fa;
   --button-danger-hover-color: #ff5656;