bkui-vue 0.0.2-beta.14 → 0.0.2-beta.141

package/lib/date-picker/panel/date-range.d.ts

@@ -262,7 +262,7 @@ declare const _default: import("vue").DefineComponent<{
     upToNowEnable: import("vue").Ref<boolean>;
     dates: import("vue").Ref<any>;
     selectedIndex: import("vue").Ref<number>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick-clear" | "pick-success" | "pick" | "pick-click")[], "pick-clear" | "pick-success" | "pick" | "pick-click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("pick-clear" | "pick-success" | "pick" | "pick-click" | "pick-first")[], "pick-clear" | "pick-success" | "pick" | "pick-click" | "pick-first", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     readonly modelValue: {
         readonly type: PropType<DatePickerValueType>;
     };
@@ -329,6 +329,7 @@ declare const _default: import("vue").DefineComponent<{
     "onPick-success"?: (...args: any[]) => any;
     onPick?: (...args: any[]) => any;
     "onPick-click"?: (...args: any[]) => any;
+    "onPick-first"?: (...args: any[]) => any;
 }, {
     readonly type: PickerTypeType;
     readonly confirm: boolean;

package/lib/date-picker/panel/date.d.ts

@@ -108,7 +108,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: () => {};
     };
 }, {
-    panelPickerHandlers: import("vue").ComputedRef<(value: any, type: any) => void>;
+    panelPickerHandlers: import("vue").ComputedRef<(value: any, _visible: boolean, type: any, _shortcut: any) => void>;
     datePanelLabel: import("vue").ComputedRef<{
         separator: any;
         labels: any[];
@@ -126,7 +126,7 @@ declare const _default: import("vue").DefineComponent<{
     handleToggleTime: () => void;
     handlePickSuccess: () => void;
     handlePickClear: () => void;
-    handlePick: (value: any, type: any) => void;
+    handlePick: (value: any, _visible: boolean, type: any, _shortcut: any) => void;
     handlePickClick: () => void;
     timePickerRef: any;
     resolveClassName: (cls: string) => string;

package/lib/date-picker/panel/time-range.d.ts

@@ -1,4 +1,5 @@
 import type { ExtractPropTypes, PropType } from 'vue';
+import { SelectionModeType } from '../interface';
 declare const timeRangeProps: {
     steps: {
         type: PropType<number[]>;
@@ -16,6 +17,11 @@ declare const timeRangeProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
 };
 export type TimeRangePanelProps = Readonly<ExtractPropTypes<typeof timeRangeProps>>;
 declare const _default: import("vue").DefineComponent<{
@@ -35,6 +41,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -322,6 +333,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -492,5 +508,6 @@ declare const _default: import("vue").DefineComponent<{
     disabledSeconds: unknown[];
     hideDisabledOptions: boolean;
     enterMode: boolean;
+    selectionMode: SelectionModeType;
 }, {}>;
 export default _default;

package/lib/date-picker/panel/time.d.ts

@@ -1,5 +1,5 @@
 import type { ExtractPropTypes, PropType } from 'vue';
-import { IDisabledHMS } from '../interface';
+import { IDisabledHMS, SelectionModeType } from '../interface';
 declare const timeProps: {
     disabledDate: {
         type: FunctionConstructor;
@@ -21,6 +21,11 @@ declare const timeProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
 };
 export type TimePanelProps = Readonly<ExtractPropTypes<typeof timeProps>>;
 declare const _default: import("vue").DefineComponent<{
@@ -44,6 +49,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -273,6 +283,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    selectionMode: {
+        type: PropType<SelectionModeType>;
+        default: string;
+        validator(v: any): boolean;
+    };
     disabledHours: {
         readonly type: ArrayConstructor;
         readonly default: () => any[];
@@ -448,5 +463,6 @@ declare const _default: import("vue").DefineComponent<{
     disabledSeconds: unknown[];
     hideDisabledOptions: boolean;
     enterMode: boolean;
+    selectionMode: SelectionModeType;
 }, {}>;
 export default _default;

package/lib/date-picker/time-picker.d.ts

@@ -173,6 +173,7 @@ declare const _default: import("vue").DefineComponent<{
     handleBlur: (e: any) => void;
     handleKeydown: (e: KeyboardEvent) => void;
     handleInputChange: (e: any) => void;
+    handleInputInput: (e: any) => void;
     handleClear: () => void;
     handleTransferClick: () => void;
     onPick: (_dates: any, visible: boolean, type: any, shortcut: any) => void;
@@ -197,6 +198,7 @@ declare const _default: import("vue").DefineComponent<{
     timeEnterMode: import("vue").Ref<boolean>;
     shortcut: import("vue").Ref<any>;
     onSelectionModeChange: import("vue").Ref<(_type: any) => SelectionModeType>;
+    tmpValue: import("vue").Ref<any>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "input" | "clear" | "update:modelValue" | "pick-success" | "open-change" | "shortcut-change")[], "change" | "input" | "clear" | "update:modelValue" | "pick-success" | "open-change" | "shortcut-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     disabledHours: {
         readonly type: ArrayConstructor;
@@ -381,7 +383,7 @@ declare const _default: import("vue").DefineComponent<{
     enterMode: boolean;
 }, SlotsType<{
     header?: () => any;
-    trigger?: () => any;
+    trigger?: (displayValue: string) => any;
     footer?: () => any;
     shortcuts?: (arg?: {
         change: Function;

package/lib/dialog/dialog.css

@@ -22,10 +22,12 @@
   max-height: 100%;
   min-height: 100%;
   padding: 0 50px 10px;
+  word-break: break-all;
 }
 .bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
   margin-bottom: 10px;
   text-align: center;
+  word-break: break-all;
 }
 .bk-modal-wrapper.bk-info-wrapper .bk-modal-footer {
   padding: 0 65px 33px;
@@ -89,7 +91,7 @@
   top: 0;
   right: 0;
   left: 0;
-  height: 30px;
+  height: 18px;
 }
 .bk-modal-wrapper.bk-dialog-wrapper .move {
   cursor: move;
@@ -98,8 +100,9 @@
   user-select: none;
 }
 .bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-header {
-  padding: 24px;
+  padding: 16px 24px 12px;
   font-size: 20px;
+  line-height: 1;
 }
 .bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-header .bk-header-icon {
   text-align: center;
@@ -128,8 +131,8 @@
 .bk-modal-wrapper.bk-dialog-wrapper .bk-modal-content {
   height: calc(100% - 79px);
   max-height: calc(100vh - 300px);
-  min-height: 100px;
-  padding: 3px 24px 0;
+  min-height: 141px;
+  padding: 0 24px;
   font-size: 14px;
   line-height: 1.5;
   color: #63656e;
@@ -169,8 +172,8 @@
 }
 .bk-modal-wrapper.bk-dialog-wrapper .bk-modal-close {
   position: absolute;
-  top: 5px;
-  right: 5px;
+  top: 4px;
+  right: 4px;
   font-size: 18px;
   color: #c4c6cc;
   cursor: pointer;

package/lib/dialog/dialog.less

@@ -25,7 +25,7 @@
       top: 0;
       right: 0;
       left: 0;
-      height: 30px;
+      height: 18px;
     }
 
     .move {
@@ -37,8 +37,9 @@
     }
 
     .@{bk-prefix}-dialog-header {
-      padding: 24px;
+      padding: 16px 24px 12px;
       font-size: 20px;
+      line-height: 1;
 
       .@{bk-prefix}-header-icon {
         text-align: center;
@@ -74,8 +75,8 @@
     .@{bk-prefix}-modal-content {
       height: calc(100% - 79px);
       max-height: calc(100vh - 300px);
-      min-height: 100px;
-      padding: 3px 24px 0;
+      min-height: 141px;
+      padding: 0 24px;
       font-size: 14px;
       line-height: 1.5;
       color: @default-color;
@@ -128,8 +129,8 @@
 
     .@{bk-prefix}-modal-close {
       position: absolute;
-      top: 5px;
-      right: 5px;
+      top: 4px;
+      right: 4px;
       font-size: 18px;
       color: @light-gray;
       cursor: pointer;

package/lib/dialog/dialog.variable.css

@@ -11,6 +11,7 @@
   --white-color: white;
   --whitesmoke-color: #fafbfd;
   --disable-color: #dcdee5;
+  --disable-bg-color: #f9fafd;
   --font-size-base: 12px;
   --font-size-medium: 14px;
   --font-size-large: 16px;
@@ -20,6 +21,9 @@
   --component-size-small: 26px;
   --component-size-base: 32px;
   --component-size-large: 40px;
+  --component-size-small-padding: 0 12px;
+  --component-size-base-padding: 0 14px;
+  --component-size-large-padding: 0 16px;
   --border-width-base: 1px;
   --border-style-base: solid;
   --border-radius-base: 2px;
@@ -32,7 +36,7 @@
   --input-border-color: var(--light-gray);
   --input-broder-radius: 3px;
   --input-shadow-color: #a3c5fd;
-  --input-horizontal-padding: 10px;
+  --input-horizontal-padding: 8px;
   --input-block-color: #f5f7fa;
   --input-block-hover-color: #eaebf0;
   --input-icon-size: var(--font-size-medium);
@@ -49,7 +53,7 @@
   --button-selected-bg-color: #e1ecff;
   --button-disabled-selected-bg-color: #f0f1f5;
   --radio-font-color: #63656e;
-  --radio-active-color: #5594fa;
+  --radio-active-color: #3a84ff;
   --radio-hover-border-color: #979ba5;
   --radio-disabled-border: #dcdee5;
   --radio-disabled-font-color: #c4c6cc;
@@ -144,10 +148,12 @@
   max-height: 100%;
   min-height: 100%;
   padding: 0 50px 10px;
+  word-break: break-all;
 }
 .bk-modal-wrapper.bk-info-wrapper .bk-modal-content .bk-info-sub-title {
   margin-bottom: 10px;
   text-align: center;
+  word-break: break-all;
 }
 .bk-modal-wrapper.bk-info-wrapper .bk-modal-footer {
   padding: 0 65px 33px;
@@ -211,7 +217,7 @@
   top: 0;
   right: 0;
   left: 0;
-  height: 30px;
+  height: 18px;
 }
 .bk-modal-wrapper.bk-dialog-wrapper .move {
   cursor: move;
@@ -220,8 +226,9 @@
   user-select: none;
 }
 .bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-header {
-  padding: 24px;
+  padding: 16px 24px 12px;
   font-size: 20px;
+  line-height: 1;
 }
 .bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-header .bk-header-icon {
   text-align: center;
@@ -250,8 +257,8 @@
 .bk-modal-wrapper.bk-dialog-wrapper .bk-modal-content {
   height: calc(100% - 79px);
   max-height: calc(100vh - 300px);
-  min-height: 100px;
-  padding: 3px 24px 0;
+  min-height: 141px;
+  padding: 0 24px;
   font-size: 14px;
   line-height: 1.5;
   color: #63656e;
@@ -291,8 +298,8 @@
 }
 .bk-modal-wrapper.bk-dialog-wrapper .bk-modal-close {
   position: absolute;
-  top: 5px;
-  right: 5px;
+  top: 4px;
+  right: 4px;
   font-size: 18px;
   color: #c4c6cc;
   cursor: pointer;

package/lib/dialog/index.d.ts

@@ -34,8 +34,8 @@ declare const BkDialog: {
             isLoading?: boolean;
             class?: unknown;
             style?: unknown;
-            key?: string | number | symbol;
             ref?: import("vue").VNodeRef;
+            key?: string | number | symbol;
             ref_for?: boolean;
             ref_key?: string;
             onVnodeBeforeMount?: ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {