bkui-vue 0.0.1-beta.38 → 0.0.1-beta.40

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

@@ -0,0 +1,22 @@
+import type { ComputedPlacement } from '@popperjs/core';
+import type { DatePickerProps } from './props';
+export declare type DatePickerPlacementType = ComputedPlacement;
+export declare type DatePickerTypeType = 'year' | 'month' | 'date' | 'daterange' | 'datetime' | 'datetimerange';
+export declare type TimePickerTypeType = 'time' | 'timerange';
+export declare type PickerTypeType = DatePickerTypeType | TimePickerTypeType;
+export interface IDatePickerShortcut {
+    text: string;
+    value?: () => Date[];
+    onClick?: (picker: any) => void;
+}
+export declare type DatePickerShortcutsType = IDatePickerShortcut[];
+declare type ValueType = Date | string | number;
+export declare type DatePickerValueType = ValueType | [ValueType, ValueType];
+export declare type DisableDateType = (date: number | Date) => boolean;
+export interface IDatePickerCtx {
+    props: DatePickerProps;
+    focus: () => void;
+}
+export declare type DatePickerPanelType = 'DateRangePanel' | 'DatePanel' | 'RangeTimePickerPanel' | 'TimePickerPanel';
+export declare type SelectionModeType = 'year' | 'month' | 'date' | 'time';
+export {};

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

@@ -0,0 +1,111 @@
+import type { ExtractPropTypes } from 'vue';
+import { PropType } from 'vue';
+import type { DatePickerShortcutsType, DatePickerValueType, DisableDateType, PickerTypeType } from './interface';
+export declare const datePickerProps: {
+    readonly type: {
+        readonly type: PropType<PickerTypeType>;
+        readonly default: "date";
+        readonly validator: (value: any) => boolean;
+    };
+    readonly extPopoverCls: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly format: StringConstructor;
+    readonly readonly: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly disabled: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly editable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly clearable: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly open: {
+        readonly type: BooleanConstructor;
+        readonly default: any;
+    };
+    readonly multiple: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly timePickerOptions: {
+        readonly type: PropType<Record<string, any>>;
+        readonly default: () => {};
+    };
+    readonly splitPanels: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly startDate: DateConstructor;
+    readonly placeholder: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly placement: {
+        readonly type: PropType<import("@popperjs/core").ComputedPlacement>;
+        readonly default: "bottom-start";
+        readonly validator: (value: any) => boolean;
+    };
+    readonly transfer: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly appendToBody: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly shortcuts: {
+        readonly type: PropType<DatePickerShortcutsType>;
+        readonly default: () => any[];
+    };
+    readonly shortcutClose: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly modelValue: {
+        readonly type: PropType<DatePickerValueType>;
+    };
+    readonly options: {
+        readonly type: ObjectConstructor;
+        readonly default: () => {};
+    };
+    readonly fontSize: {
+        readonly type: PropType<"large" | "normal" | "medium">;
+        readonly default: "normal";
+    };
+    readonly upToNow: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly useShortcutText: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly shortcutSelectedIndex: {
+        readonly type: NumberConstructor;
+        readonly default: -1;
+    };
+    readonly footerSlotCls: {
+        readonly type: StringConstructor;
+        readonly default: "";
+    };
+    readonly allowCrossDay: {
+        readonly type: BooleanConstructor;
+        readonly default: false;
+    };
+    readonly behavior: {
+        readonly type: PropType<"normal" | "simplicity">;
+        readonly default: "normal";
+        readonly validator: (v: any) => boolean;
+    };
+    readonly disableDate: PropType<DisableDateType>;
+};
+export declare type DatePickerProps = Readonly<ExtractPropTypes<typeof datePickerProps>>;

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

@@ -0,0 +1,97 @@
+import type { InjectionKey } from 'vue';
+import type { IDatePickerCtx, PickerTypeType } from './interface';
+export declare const RANGE_SEPARATOR = " - ";
+export declare const typeValueResolver: {
+    default: {
+        formatter(value: any): string;
+        parser(text: any): any;
+    };
+    date: {
+        formatter: (value: any, format: any) => string;
+        parser: (text: any, format: any) => any;
+    };
+    datetime: {
+        formatter: (value: any, format: any) => string;
+        parser: (text: any, format: any) => any;
+    };
+    daterange: {
+        formatter: (value: any, format: any) => string;
+        parser: (text: any, format: any) => any[];
+    };
+    datetimerange: {
+        formatter: (value: any, format: any) => string;
+        parser: (text: any, format: any) => any[];
+    };
+    timerange: {
+        formatter: (value: any, format: any) => string;
+        parser: (text: any, format: any) => any[];
+    };
+    time: {
+        formatter: (value: any, format: any) => string;
+        parser: (text: any, format: any) => any;
+    };
+    month: {
+        formatter: (value: any, format: any) => string;
+        parser: (text: any, format: any) => any;
+    };
+    year: {
+        formatter: (value: any, format: any) => string;
+        parser: (text: any, format: any) => any;
+    };
+    multiple: {
+        formatter(value: any, format: any): any;
+        parser(v: any, format: any): any;
+    };
+    number: {
+        formatter(value: any): string;
+        parser(text: any): number;
+    };
+};
+/**
+ * 设置时间，当天的零点时间
+ *
+ * @return {Date} date 对象
+ */
+export declare const initTime: () => Date;
+/**
+ * 判断数组中的每个值是否为空
+ * 0, '', null, undefined 均判断为空
+ *
+ * @param {Array} arr 待判断的数组
+ *
+ * @return {boolean} 判断结果
+ */
+export declare const isAllEmptyArr: (arr: any[]) => boolean;
+export declare const keyValueMapper: {
+    40: string;
+    39: string;
+    38: string;
+    37: string;
+};
+export declare const mapPossibleValues: (key: string, horizontal: number, vertical: number) => number;
+export declare const extractTime: (date: Date) => number[];
+export declare const DEFAULT_FORMATS: Record<PickerTypeType, string>;
+export declare const parseDate: (val: any, type: any, multiple: any, format: any) => any;
+export declare const formatDate: (val: any, type: any, multiple: any, format: any) => any;
+export declare const datePickerKey: InjectionKey<IDatePickerCtx>;
+/**
+ * 寻找子组件
+ *
+ * @param {Object} context 上下文
+ * @param {string} componentName 要找的组件类型名称
+ *
+ * @return {Array} 组件集合
+ */
+export declare function findChildComponents(context: any, componentName: any): any;
+export declare function iconBtnCls(direction: any, type?: string): string[];
+export declare const getDayCountOfMonth: (year: any, month: any) => number;
+export declare const siblingMonth: (src: any, diff: any) => Date;
+export declare const formatDateLabels: (locale: any, format: any, date: any) => {
+    separator: any;
+    labels: {
+        label: any;
+        type: string;
+    }[];
+};
+export declare const clearHours: (time: any) => number;
+export declare const isInRange: (time: any, a: any, b: any) => boolean;

package/lib/dialog/dialog.css

@@ -0,0 +1,68 @@
+.bk-modal-wrapper.bk-dialog-wrapper {
+  position: relative;
+}
+.bk-modal-wrapper.bk-dialog-wrapper * {
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+.bk-modal-wrapper.bk-dialog-wrapper.scroll-able .bk-modal-content {
+  overflow: auto;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-tool {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  height: 30px;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-tool .bk-dialog-close {
+  position: absolute;
+  top: 5px;
+  right: 5px;
+  display: flex;
+  width: 26px;
+  height: 26px;
+  font-size: 22px;
+  font-weight: 700;
+  line-height: 26px;
+  color: #979ba5;
+  text-align: center;
+  cursor: pointer;
+  border-radius: 50%;
+  transform: rotate(45deg);
+  justify-content: center;
+  align-items: center;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-header {
+  padding: 24px;
+  font-size: 20px;
+  line-height: 1;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-header .bk-dialog-title {
+  display: inline-block;
+  width: 100%;
+  overflow: hidden;
+  font-size: 24px;
+  color: #313238;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-modal-content {
+  height: calc(100% - 132px);
+  padding: 3px 24px 26px;
+  margin-bottom: 58px;
+  font-size: 14px;
+  line-height: 1.5;
+  color: #63656e;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-modal-footer {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  height: 58px;
+  padding: 12px 24px;
+  background-color: #fafbfd;
+  border-top: 1px solid #dcdee5;
+  border-radius: 2px;
+}

package/lib/dialog/dialog.d.ts

@@ -0,0 +1,113 @@
+declare const _default: import("vue").DefineComponent<{
+    confirmText: {
+        type: StringConstructor;
+        default: string;
+    };
+    cancelText: {
+        type: StringConstructor;
+        default: string;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    headerAlign: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    footerAlign: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    isShow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    width: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    height: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    customClass: {
+        type: (ArrayConstructor | StringConstructor)[];
+        default: string;
+    };
+    scrollable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showMask: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, unknown, unknown, {}, {
+    handleClose(): void;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("closed" | "update:isShow")[], "closed" | "update:isShow", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    confirmText: {
+        type: StringConstructor;
+        default: string;
+    };
+    cancelText: {
+        type: StringConstructor;
+        default: string;
+    };
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
+    headerAlign: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    footerAlign: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    isShow: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    width: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    height: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    customClass: {
+        type: (ArrayConstructor | StringConstructor)[];
+        default: string;
+    };
+    scrollable: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    showMask: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & {
+    onClosed?: (...args: any[]) => any;
+    "onUpdate:isShow"?: (...args: any[]) => any;
+}, {
+    width: string | number;
+    height: string | number;
+    title: string;
+    showMask: boolean;
+    isShow: boolean;
+    customClass: string | unknown[];
+    scrollable: boolean;
+    confirmText: string;
+    cancelText: string;
+    headerAlign: string;
+    footerAlign: string;
+}>;
+export default _default;

package/lib/dialog/dialog.js

@@ -0,0 +1 @@
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("../shared"),require("vue"),require("../button"),require("../modal"));else if("function"==typeof define&&define.amd)define(["../shared","vue","../button","../modal"],t);else{var o="object"==typeof exports?t(require("../shared"),require("vue"),require("../button"),require("../modal")):t(e["../shared"],e.vue,e["../button"],e["../modal"]);for(var r in o)("object"==typeof exports?exports:e)[r]=o[r]}}(self,((e,t,o,r)=>(()=>{"use strict";var n={4976:e=>{e.exports=o},8014:e=>{e.exports=r},4212:t=>{t.exports=e},748:e=>{e.exports=t}},l={};function a(e){var t=l[e];if(void 0!==t)return t.exports;var o=l[e]={exports:{}};return n[e](o,o.exports,a),o.exports}a.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return a.d(t,{a:t}),t},a.d=(e,t)=>{for(var o in t)a.o(t,o)&&!a.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};return(()=>{a.r(i),a.d(i,{default:()=>c});var e=a(4212),t=a(748),o=a(4976),r=a.n(o),n=a(8014),l=a.n(n);const d=(0,t.defineComponent)({name:"Dialog",components:{BkModal:l(),BkButton:r()},props:Object.assign(Object.assign({},n.propsMixin),{confirmText:{type:String,default:"确定"},cancelText:{type:String,default:"取消"},title:{type:String,default:"Title"},headerAlign:{type:String,default:"left",validator:function(e){var t=["left","center","right"];return!(t.indexOf(e)<0&&(console.error("headerAlign property is not valid: '".concat(e,"',【").concat(t.join(" | "),"】")),1))}},footerAlign:{type:String,default:"right",validator:function(e){var t=["left","center","right"];return!(t.indexOf(e)<0&&(console.error("footerAlign property is not valid: '".concat(e,"',【").concat(t.join(" | "),"】")),1))}}}),emits:["closed","update:isShow"],methods:{handleClose:function(){this.$emit("update:isShow",!1),this.$emit("closed")}},render:function(){var e,o=this,n={header:function(){var e,r,n;return(0,t.createVNode)(t.Fragment,null,[(0,t.createVNode)("div",{class:"bk-dialog-tool"},[(0,t.createVNode)("span",{class:"bk-dialog-close",onClick:o.handleClose},[(0,t.createTextVNode)("+")])]),(0,t.createVNode)("div",{class:"bk-dialog-header"},[(0,t.createVNode)("span",{class:"bk-dialog-title",style:"text-align: ".concat(o.headerAlign)},[null!==(n=null===(r=(e=o.$slots).header)||void 0===r?void 0:r.call(e))&&void 0!==n?n:o.title])])])},default:function(){var e,t,r;return null!==(r=null===(t=(e=o.$slots).default)||void 0===t?void 0:t.call(e))&&void 0!==r?r:"default"},footer:function(){var e,n,l;return(0,t.createVNode)("div",{class:"bk-dialog-footer",style:"text-align: ".concat(o.footerAlign)},[null!==(l=null===(n=(e=o.$slots).footer)||void 0===n?void 0:n.call(e))&&void 0!==l?l:(0,t.createVNode)(t.Fragment,null,[(0,t.createVNode)(r(),{onClick:o.handleClose,theme:"primary"},{default:function(){return[o.confirmText]}}),(0,t.createVNode)(r(),{onClick:o.handleClose},{default:function(){return[o.cancelText]}})])])}},a="bk-dialog-wrapper ".concat(this.scrollable?"scroll-able":"");return(0,t.createVNode)(l(),(0,t.mergeProps)(this.$props,{class:a}),"function"==typeof(e=n)||"[object Object]"===Object.prototype.toString.call(e)&&!(0,t.isVNode)(e)?n:{default:function(){return[n]}})}}),c=(0,e.withInstall)(d)})(),i})()));

package/lib/dialog/dialog.less

@@ -0,0 +1,80 @@
+.bk-modal-wrapper {
+  &.bk-dialog-wrapper {
+    position: relative;
+
+    * {
+      box-sizing: border-box;
+      -webkit-tap-highlight-color: rgba(0,0,0,0);
+    }
+
+    &.scroll-able {
+      .bk-modal-content {
+        overflow: auto;
+      }
+    }
+
+    .bk-dialog-tool {
+      position: absolute;
+      top: 0;
+      right: 0;
+      left: 0;
+      height: 30px;
+
+      .bk-dialog-close {
+        position: absolute;
+        top: 5px;
+        right: 5px;
+        display: flex;
+        width: 26px;
+        height: 26px;
+        font-size: 22px;
+        font-weight: 700;
+        line-height: 26px;
+        color: #979ba5;
+        text-align: center;
+        cursor: pointer;
+        border-radius: 50%;
+        transform: rotate(45deg);
+        justify-content: center;
+        align-items: center;
+      }
+    }
+
+    .bk-dialog-header {
+      padding: 24px;
+      font-size: 20px;
+      line-height: 1;
+
+      .bk-dialog-title {
+        display: inline-block;
+        width: 100%;
+        overflow: hidden;
+        font-size: 24px;
+        color: #313238;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+
+    .bk-modal-content {
+      height: calc(100% - 132px);
+      padding: 3px 24px 26px;
+      margin-bottom: 58px;
+      font-size: 14px;
+      line-height: 1.5;
+      color: #63656e;
+    }
+
+    .bk-modal-footer {
+      position: absolute;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      height: 58px;
+      padding: 12px 24px;
+      background-color: #fafbfd;
+      border-top: 1px solid #dcdee5;
+      border-radius: 2px;
+    }
+  }
+}

package/lib/dialog/dialog.variable.css

@@ -0,0 +1,68 @@
+.bk-modal-wrapper.bk-dialog-wrapper {
+  position: relative;
+}
+.bk-modal-wrapper.bk-dialog-wrapper * {
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+.bk-modal-wrapper.bk-dialog-wrapper.scroll-able .bk-modal-content {
+  overflow: auto;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-tool {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  height: 30px;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-tool .bk-dialog-close {
+  position: absolute;
+  top: 5px;
+  right: 5px;
+  display: flex;
+  width: 26px;
+  height: 26px;
+  font-size: 22px;
+  font-weight: 700;
+  line-height: 26px;
+  color: #979ba5;
+  text-align: center;
+  cursor: pointer;
+  border-radius: 50%;
+  transform: rotate(45deg);
+  justify-content: center;
+  align-items: center;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-header {
+  padding: 24px;
+  font-size: 20px;
+  line-height: 1;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-dialog-header .bk-dialog-title {
+  display: inline-block;
+  width: 100%;
+  overflow: hidden;
+  font-size: 24px;
+  color: #313238;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-modal-content {
+  height: calc(100% - 132px);
+  padding: 3px 24px 26px;
+  margin-bottom: 58px;
+  font-size: 14px;
+  line-height: 1.5;
+  color: #63656e;
+}
+.bk-modal-wrapper.bk-dialog-wrapper .bk-modal-footer {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  height: 58px;
+  padding: 12px 24px;
+  background-color: #fafbfd;
+  border-top: 1px solid #dcdee5;
+  border-radius: 2px;
+}