@king-design/vue 2.1.4 → 2.1.6

package/components/dialog/staticMethods.d.ts

@@ -9,5 +9,5 @@ export interface AlertDialogProps extends DialogProps {
     iconClassName?: string;
     icon?: object;
 }
-export type StaticMethod = (options?: AlertDialogProps) => Promise<void>;
+export declare type StaticMethod = (options?: AlertDialogProps) => Promise<void>;
 export declare function addStaticMethods(Component: typeof Dialog): void;

package/components/dialog/staticMethods.js

@@ -5,12 +5,16 @@ import template from './alert.vdt';
 export function addStaticMethods(Component) {
   var AlertDialog = /*#__PURE__*/function (_Component) {
     _inheritsLoose(AlertDialog, _Component);
+
     function AlertDialog() {
       return _Component.apply(this, arguments) || this;
     }
+
     return AlertDialog;
   }(Component);
+
   AlertDialog.template = template;
+
   AlertDialog.defaults = function () {
     return _extends({}, Component.defaults(), {
       title: undefined,
@@ -19,23 +23,28 @@ export function addStaticMethods(Component) {
       hideClose: true
     });
   };
+
   function show(options) {
     if (options === void 0) {
       options = {};
     }
+
     var normalize = Component.normalize;
+
     if (normalize) {
       if (options.content) {
         options = _extends({}, options, {
           content: normalize(options.content)
         });
       }
+
       if (options.icon) {
         options = _extends({}, options, {
           icon: normalize(options.icon)
         });
       }
     }
+
     var dialog = new AlertDialog(options);
     dialog.show();
     if (options.ref) options.ref(dialog);
@@ -45,18 +54,20 @@ export function addStaticMethods(Component) {
       });
       dialog.on('cancel', function () {
         reject();
-      });
-      // if press esc, treat it as cancel too
+      }); // if press esc, treat it as cancel too
+
       dialog.on('terminate', function () {
         reject();
       });
     });
   }
+
   ['success', 'warning', 'error', 'confirm'].forEach(function (type) {
     Component[type] = function (options) {
       if (options === void 0) {
         options = {};
       }
+
       var closable = type === 'confirm';
       options = _extends({
         closable: closable,

package/components/dialog/styles.js

@@ -6,29 +6,38 @@ import '../../styles/global';
 var defaults = {
   width: '800px',
   bgColor: '#fff',
+
   get borderRadius() {
     return theme.borderRadius;
   },
+
   get transition() {
     return theme.transition.large;
   },
+
   padding: '0',
   margin: '0 20px',
+
   get color() {
     return theme.color.text;
   },
+
   get fontSize() {
     return theme.fontSize;
   },
+
   get boxShadow() {
     return theme.boxShadow;
   },
+
   // header
   header: {
     fontSize: '16px',
+
     get color() {
       return theme.color.title;
     },
+
     height: '61px',
     border: "1px solid #eaeaea",
     closeTop: '16px',
@@ -73,6 +82,7 @@ setDefault(function () {
 });
 export function makeDialogStyles() {
   var _context;
+
   return /*#__PURE__*/css("position:absolute;width:", dialog.width, ";border-radius:", dialog.borderRadius, ";background:", dialog.bgColor, ";font-size:", dialog.fontSize, ";color:", dialog.color, ";box-shadow:", dialog.boxShadow, ";max-width:100%;z-index:", theme.maxZIndex, ";&.k-dragging{cursor:move;user-select:none;}&.transition-enter-active,&.transition-leave-active,&.transition-appear-active{transition:all ", dialog.transition, ";}&.transition-enter-from,&.transition-leave-to,&.transition-appear-from{transform:", dialog.transform, ";opacity:0;}", _mapInstanceProperty(_context = ['large', 'small', 'mini']).call(_context, function (size) {
     return /*#__PURE__*/css("&.k-", size, "{width:", dialog[size + "Width"], ";}");
   }), ".k-dialog-header{padding:0 ", dialog.padding, ";margin:", dialog.margin, ";border-bottom:", dialog.header.border, ";height:", dialog.header.height, ";line-height:", dialog.header.height, ";font-size:", dialog.header.fontSize, ";color:", dialog.header.color, ";position:relative;}.k-dialog-title{display:inline-block;}.k-dialog-close{position:absolute;right:", dialog.header.closeRight, ";top:", dialog.header.closeTop, ";.k-icon{font-size:", dialog.header.closeIconFontSize, ";}}.k-dialog-body{padding:", dialog.body.padding, ";}.k-dialog-footer{text-align:right;padding:", dialog.footer.padding, ";margin:", dialog.margin, ";border-top:", dialog.footer.border, ";.k-btn{margin-left:", dialog.footer.btnGap, ";}}");
@@ -84,6 +94,7 @@ export function makeWrapperStyles() {
 }
 export function makeAlertStyles() {
   var _context2;
+
   return /*#__PURE__*/css("&.k-alert-dialog{.k-dialog-body{margin-top:", dialog.alert.bodyMarginTop, ";padding:", dialog.alert.padding, ";text-align:center;position:relative;z-index:1;}.k-dialog-header,.k-dialog-footer{border:none;}.k-dialog-tip-icon{margin-bottom:", dialog.alert.tipIconMarginBottom, ";.k-icon{font-size:", dialog.alert.tipIconFontSize, ";line-height:", dialog.alert.tipIconLineHeight, ";}}", _mapInstanceProperty(_context2 = ['success', 'warning', 'error', 'confirm']).call(_context2, function (type) {
     var color = type === 'error' ? theme.color.danger : type === 'confirm' ? theme.color.primary : theme.color[type];
     return /*#__PURE__*/css("&.k-", type, "{.k-dialog-tip-icon{color:", color, ";}}");

package/components/dialog/useDraggable.js

@@ -9,6 +9,7 @@ export function useDraggable(dialogRef, areaRef) {
   var height = 0;
   var areaWidth = 0;
   var areaHeight = 0;
+
   function onStart(e) {
     var dialog = dialogRef.value;
     x = dialog.offsetLeft - e.clientX;
@@ -17,6 +18,7 @@ export function useDraggable(dialogRef, areaRef) {
     height = dialog.offsetHeight;
     var body = document.body;
     var html = document.documentElement;
+
     if (!component.get('overlay')) {
       areaWidth = Math.max(body.scrollWidth, html.scrollWidth);
       areaHeight = Math.max(body.scrollHeight, html.scrollHeight);
@@ -25,10 +27,12 @@ export function useDraggable(dialogRef, areaRef) {
       areaHeight = Math.max(html.offsetHeight, window.innerHeight);
     }
   }
+
   function onMove(e) {
     var style = dialogRef.value.style;
     var _areaWidth = areaWidth;
     var area = areaRef.value;
+
     if (area) {
       // detect the wrapper has scrollbar or not
       if (area.scrollHeight > area.offsetHeight) {
@@ -36,11 +40,13 @@ export function useDraggable(dialogRef, areaRef) {
         _areaWidth -= scrollBarWidth;
       }
     }
+
     var left = Math.min(Math.max(x + e.clientX, 0), Math.max(_areaWidth - width, 0));
     var top = Math.min(Math.max(y + e.clientY, 0), Math.max(areaHeight - height, 0));
     style.left = left + "px";
     style.top = top + "px";
   }
+
   return useBaseDraggable({
     onStart: onStart,
     onMove: onMove,

package/components/dialog/useEscClosable.js

@@ -1,38 +1,46 @@
 import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/splice";
 import { useInstance, onUnmounted } from 'intact-vue-next';
-import { SHOW, HIDE } from './constants';
-// only close the top dialog when press ESC
+import { SHOW, HIDE } from './constants'; // only close the top dialog when press ESC
+
 var dialogs = [];
+
 var escClose = function escClose(e) {
   var dialog = dialogs[dialogs.length - 1];
+
   if (e.keyCode === 27 && dialog.get('escClosable')) {
     dialog.terminate();
   }
 };
+
 export function useEscClosable() {
   var instance = useInstance();
   instance.on(SHOW, function () {
     if (!dialogs.length) {
       document.addEventListener('keydown', escClose);
     }
+
     dialogs.push(instance);
   });
+
   function onHide() {
     // the order is uncertain in different frameworks
-    var index = dialogs.indexOf(instance);
-    // const dialog = dialogs.pop();
+    var index = dialogs.indexOf(instance); // const dialog = dialogs.pop();
     // const dialog = dialogs.shift();
+
     if (process.env.NODE_ENV !== 'production') {
       // if (dialog !== instance) {
       if (index === -1) {
         throw new Error('The dialog has handled hide callback. Maybe it is a bug of KPC');
       }
     }
+
     _spliceInstanceProperty(dialogs).call(dialogs, index, 1);
+
     if (!dialogs.length) {
       document.removeEventListener('keydown', escClose);
     }
   }
+
   instance.on(HIDE, onHide);
   onUnmounted(function () {
     if (instance.get('value')) {

package/components/dialog/useFixBody.d.ts

@@ -1,5 +1,5 @@
 import { RefObject } from 'intact-vue-next';
-type Hooks = {
+declare type Hooks = {
     onStart?: (scrollBarWidth: number | undefined) => void;
     onEnd?: () => void;
 };

package/components/dialog/useFixBody.js

@@ -18,12 +18,14 @@ export function useFixBody(elementRef) {
       onClosed(instance);
     }
   });
+
   function onEnter() {
     if (instance.get('overlay')) {
       fixedBody = true;
       onOpen(instance);
     }
   }
+
   function onAfterLeave() {
     if (fixedBody) {
       fixedBody = false;
@@ -34,25 +36,32 @@ export function useFixBody(elementRef) {
 export function setHooks(h) {
   hooks = h;
 }
+
 function onOpen(dialog) {
   var body = document.body;
+
   if (dialogs.size === 0) {
     var bodyStyle = body.style;
     originalStyle = body.getAttribute('style');
     bodyStyle.overflow = 'hidden';
     var scrollBarWidth = shouldFixBody();
+
     if (scrollBarWidth) {
       bodyStyle.paddingRight = scrollBarWidth + "px";
     }
+
     if (hooks && hooks.onStart) {
       hooks.onStart(scrollBarWidth);
     }
   }
+
   dialogs.add(dialog);
 }
+
 function onClosed(dialog) {
   var body = document.body;
   dialogs.delete(dialog);
+
   if (dialogs.size === 0) {
     if (originalStyle) {
       // console.log(originalStyle);
@@ -60,11 +69,13 @@ function onClosed(dialog) {
     } else {
       body.removeAttribute('style');
     }
+
     if (hooks && hooks.onEnd) {
       hooks.onEnd();
     }
   }
 }
+
 function shouldFixBody() {
   if (document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight)) {
     return scrollbarWidth();

package/components/dialog/usePosition.js

@@ -12,6 +12,7 @@ export function usePosition(elementRef) {
     presented: true,
     inited: true
   });
+
   function center() {
     position(elementRef.value, {
       // ensure title visible always
@@ -19,6 +20,7 @@ export function usePosition(elementRef) {
         var height = feedback.element.height;
         var scrollTop = window.pageYOffset;
         var outerHeight = window.document.documentElement.clientHeight;
+
         if (height > outerHeight) {
           position.top = scrollTop;
         }
@@ -28,13 +30,16 @@ export function usePosition(elementRef) {
       at: 'center center-16%'
     });
   }
+
   function onAfterLeave() {
     var element = elementRef.value;
+
     if (element) {
       // in `destroy` mode, the elementRef.value doesn't exist
       var style = element.style;
       style.left = style.top = '';
     }
+
     if (!instance.useAsComponent) {
       remove(instance.$vNode, document.body, false);
     }

package/components/drawer/index.js

@@ -3,20 +3,25 @@ import _extends from "@babel/runtime-corejs3/helpers/extends";
 import template from './index.vdt';
 import { BaseDialog } from '../dialog/base';
 import { placements } from './styles';
+
 var typeDefs = _extends({}, BaseDialog.typeDefs, {
   placement: placements
 });
+
 var defaults = function defaults() {
   return _extends({}, BaseDialog.defaults(), {
     placement: 'right',
     draggable: false
   });
 };
+
 export var Drawer = /*#__PURE__*/function (_BaseDialog) {
   _inheritsLoose(Drawer, _BaseDialog);
+
   function Drawer() {
     return _BaseDialog.apply(this, arguments) || this;
   }
+
   return Drawer;
 }(BaseDialog);
 Drawer.template = template;