@king-design/react 3.1.4-beta.2 → 3.1.5

package/components/menu/menu.js

@@ -15,7 +15,6 @@ var typeDefs = {
   dot: Boolean,
   _paddingLeft: String
 };
-
 var defaults = function defaults() {
   return {
     expandedKeys: [],
@@ -24,21 +23,16 @@ var defaults = function defaults() {
     size: 'default'
   };
 };
-
 export var MENU = 'Menu';
 export var ROOT_MENU = 'RootMenu';
 export var Menu = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Menu, _Component);
-
   function Menu() {
     var _context;
-
     var _this;
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _Component.call.apply(_Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
     _this.rootMenu = inject(ROOT_MENU, null);
     _this.parentMenu = inject(MENU, null);
@@ -47,18 +41,15 @@ export var Menu = /*#__PURE__*/function (_Component) {
     _this.config = useConfigContext();
     return _this;
   }
-
   var _proto = Menu.prototype;
-
   _proto.init = function init() {
-    provide(MENU, this); // is root menu or not
-
+    provide(MENU, this);
+    // is root menu or not
     if (!this.rootMenu) {
       provide(ROOT_MENU, this);
       this.highlight = useHighlight();
     }
   };
-
   return Menu;
 }(Component);
 Menu.template = template;

package/components/menu/menu.vdt.js

@@ -7,23 +7,19 @@ import { makeMenuStyles, makeTitleStyles } from './styles';
 import { Icon } from '../icon';
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj, _$cn2;
-
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
   var _$blocks = {};
   var __$blocks = {};
-
   var _this$get = this.get(),
-      children = _this$get.children,
-      className = _this$get.className;
-
+    children = _this$get.children,
+    className = _this$get.className;
   var _get = (this.rootMenu || this).get(),
-      collapse = _get.collapse,
-      theme = _get.theme,
-      type = _get.type,
-      size = _get.size;
-
+    collapse = _get.collapse,
+    theme = _get.theme,
+    type = _get.type,
+    size = _get.size;
   var isRootMenu = !this.rootMenu;
   var isDropdownMenu = !isRootMenu && isDropdown(this.rootMenu);
   var k = this.config.k;
@@ -32,11 +28,9 @@ export default function ($props, $blocks, $__proto__) {
     return null;
   }, __$blocks['header'] = function ($super, data) {
     var block = $blocks['header'];
-
     var callBlock = function callBlock() {
       return _$blocks['header'].call($this, $super, data);
     };
-
     return block ? block.call($this, callBlock, data) : callBlock();
   }, __$blocks['header'](_$no));
   var content = [$blocks.header ? _$ce(2, 'div', !collapse ? header : findChildren(header, function (vNode) {

package/components/menu/styles.js

@@ -9,29 +9,23 @@ var defaults = {
   get transition() {
     return theme.transition.large;
   },
-
   width: '200px',
   bgColor: '#262626',
   fontSize: '14px',
-
   get borderRadius() {
     return theme.borderRadius;
   },
-
   item: {
     height: '40px',
     padding: '0 21px',
     color: '#b2b2b2',
     hoverColor: '#fff',
-
     get disabledColor() {
       return theme.color.text;
     },
-
     get activeBgColor() {
       return theme.color.primary;
     },
-
     dotFontSize: '12px'
   },
   icon: {
@@ -53,11 +47,9 @@ var defaults = {
       get color() {
         return theme.color.text;
       },
-
       get hoverColor() {
         return theme.color.primary;
       },
-
       disabledColor: '#999'
     }
   },
@@ -69,25 +61,20 @@ var defaults = {
       get color() {
         return theme.color.text;
       },
-
       get hoverColor() {
         return theme.color.primary;
       },
-
       get disabledColor() {
         return theme.color.disabled;
       }
-
     },
     active: {
       get color() {
         return theme.color.primary;
       },
-
       get bgColor() {
         return palette(theme.color.primary, -4);
       }
-
     }
   },
   // dropdown
@@ -96,19 +83,15 @@ var defaults = {
   },
   large: {
     width: '250px',
-
     get fontSize() {
       return menu.fontSize;
     }
-
   },
   small: {
     width: '180px',
-
     get fontSize() {
       return theme.small.fontSize;
     }
-
   }
 };
 var menu;
@@ -116,15 +99,14 @@ setDefault(function () {
   menu = deepDefaults(theme, {
     menu: defaults
   }).menu;
-  makeMenuStyles == null ? void 0 : makeMenuStyles.clearCache();
-  makeItemStyles == null ? void 0 : makeItemStyles.clearCache();
-  makeTitleStyles == null ? void 0 : makeTitleStyles.clearCache();
-  makeNestedMenuStyles == null ? void 0 : makeNestedMenuStyles.clearCache();
+  makeMenuStyles == null || makeMenuStyles.clearCache();
+  makeItemStyles == null || makeItemStyles.clearCache();
+  makeTitleStyles == null || makeTitleStyles.clearCache();
+  makeNestedMenuStyles == null || makeNestedMenuStyles.clearCache();
 });
 export { menu };
 export var makeMenuStyles = cache(function makeMenuStyles(k) {
   var _context;
-
   // we must increase the priority by adding &.${k}-menu
   // to override the css of dropdownMenu
   return /*#__PURE__*/css("&.", k, "-menu{width:", menu.width, ";transition:width ", menu.transition, ";background:", menu.bgColor, ";font-size:", menu.fontSize, ";}.", k, "-icon{width:", menu.icon.width, ";margin-right:", menu.icon.gap, ";text-align:center;flex-shrink:0;}.", k, "-menu-header{height:", menu.header.height, ";font-size:", menu.header.fontSize, ";font-weight:bold;border-bottom:", menu.header.borderBottom, ";}", _mapInstanceProperty(_context = ['light', 'white']).call(_context, function (theme) {
@@ -147,7 +129,6 @@ export var makeNestedMenuStyles = cache(function makeNestedMenuStyles(k, hasIcon
   if (parentPaddingLeft === void 0) {
     parentPaddingLeft = getLeft(menu.item.padding);
   }
-
   var paddingLeft = "" + parentPaddingLeft + (hasIcon ? ' + ' + menu.icon.width : '') + " + " + menu.icon.gap;
   return [/*#__PURE__*/css("&.", k, "-menu{width:auto;background:", menu.subBgColor, ";.", k, "-menu-title{padding-left:calc(", paddingLeft, ");}}"), paddingLeft];
 });

package/components/menu/useDropdown.js

@@ -17,10 +17,9 @@ export function useDropdown(rootMenu, parentMenu) {
   onBeforeMount(parseChildren);
   onBeforeUpdate(parseChildren);
   parsePosition(rootMenu.get('type'));
-  rootMenu.watch('type', parsePosition); // hide dropdown menu on select
-
+  rootMenu.watch('type', parsePosition);
+  // hide dropdown menu on select
   instance.on('select', hide);
-
   function parseChildren() {
     isDropdownMenu = isDropdown(rootMenu);
     tooltipContents = [];
@@ -39,12 +38,10 @@ export function useDropdown(rootMenu, parentMenu) {
         } else if (!iconVNode && isComponentVNode(vNode, Icon)) {
           iconVNode = vNode;
         }
-
         titleVNodes.push(vNode);
       }
     });
   }
-
   function parsePosition(type) {
     position = type !== 'horizontal' || !isTopItem ? {
       my: 'left top',
@@ -54,13 +51,11 @@ export function useDropdown(rootMenu, parentMenu) {
       at: 'left bottom+5'
     };
   }
-
   function hide() {
     if (!isTopItem && rootDropdown) {
       rootDropdown.hide(true);
     }
   }
-
   return function () {
     return {
       isTopItem: isTopItem,
@@ -76,8 +71,7 @@ export function useDropdown(rootMenu, parentMenu) {
 }
 export function isDropdown(rootMenu) {
   var _rootMenu$get = rootMenu.get(),
-      collapse = _rootMenu$get.collapse,
-      type = _rootMenu$get.type;
-
+    collapse = _rootMenu$get.collapse,
+    type = _rootMenu$get.type;
   return collapse || type === 'horizontal';
 }

package/components/menu/useExpanded.js

@@ -6,27 +6,21 @@ import { isDropdown } from './useDropdown';
 export function useExpanded(rootMenu, parentMenu) {
   var instance = useInstance();
   onBeforeUnmount(removeSubExpandedKey);
-
   function isExpanded() {
     var isExpanded = !isDropdown(rootMenu) && inArray(rootMenu.get('expandedKeys'), instance.get('key'));
-
     if (isExpanded) {
       addSubExpandedKey();
     } else {
       removeSubExpandedKey();
     }
-
     return isExpanded;
   }
-
   function expand() {
     expandOrShrink(true);
   }
-
   function shrink() {
     expandOrShrink(false);
   }
-
   function toggle() {
     if (isExpanded()) {
       shrink();
@@ -35,40 +29,32 @@ export function useExpanded(rootMenu, parentMenu) {
     } else {
       // accordion
       var subExpandedKeys = parentMenu.subExpandedKeys;
-
       if (subExpandedKeys) {
         subExpandedKeys.forEach(function (key) {
           addOrRemove(rootMenu.get('expandedKeys'), key, false);
         });
       }
-
       expand();
     }
   }
-
   function expandOrShrink(isExpand) {
     var _context;
-
     var expandedKeys = _sliceInstanceProperty(_context = rootMenu.get('expandedKeys')).call(_context);
-
     addOrRemove(expandedKeys, instance.get('key'), isExpand);
     rootMenu.set({
       expandedKeys: expandedKeys
     });
   }
-
   function addSubExpandedKey() {
     var key = instance.get('key');
     var subExpandedKeys = parentMenu.subExpandedKeys || (parentMenu.subExpandedKeys = new _Set());
     subExpandedKeys.add(key);
   }
-
   function removeSubExpandedKey() {
     var key = instance.get('key');
     var subExpandedKeys = parentMenu.subExpandedKeys || (parentMenu.subExpandedKeys = new _Set());
     subExpandedKeys.delete(key);
   }
-
   return {
     isExpanded: isExpanded,
     expand: expand,

package/components/menu/useHighlight.js

@@ -13,54 +13,45 @@ export function useHighlight() {
   instance.watch('selectedKey', updateStatus, {
     presented: true
   });
-
   function updateStatus(newValue) {
-    var _loop = function _loop(i) {
-      var menuItem = menuItems[i];
-      var key = menuItem.get('key');
-      if (newValue !== key) return "continue";
-      var items = [];
-      var parentItem = menuItem.parentMenuItem;
-
-      while (parentItem) {
-        items.push(parentItem);
-        parentItem = parentItem.parentMenuItem;
-      }
-
-      var expandedKeys = new _Set(instance.get('expandedKeys'));
-      highlightedKeys.set(_mapInstanceProperty(items).call(items, function (item) {
-        var key = item.get('key');
-        expandedKeys.add(key);
-        return key;
-      }));
-      instance.set('expandedKeys', _Array$from(expandedKeys));
-      return {
-        v: void 0
-      };
-    };
-
+    var _loop = function _loop() {
+        var menuItem = menuItems[i];
+        var key = menuItem.get('key');
+        if (newValue !== key) return 0; // continue
+        var items = [];
+        var parentItem = menuItem.parentMenuItem;
+        while (parentItem) {
+          items.push(parentItem);
+          parentItem = parentItem.parentMenuItem;
+        }
+        var expandedKeys = new _Set(instance.get('expandedKeys'));
+        highlightedKeys.set(_mapInstanceProperty(items).call(items, function (item) {
+          var key = item.get('key');
+          expandedKeys.add(key);
+          return key;
+        }));
+        instance.set('expandedKeys', _Array$from(expandedKeys));
+        return {
+          v: void 0
+        };
+      },
+      _ret;
     for (var i = 0; i < menuItems.length; i++) {
-      var _ret = _loop(i);
-
-      if (_ret === "continue") continue;
-      if (typeof _ret === "object") return _ret.v;
+      _ret = _loop();
+      if (_ret === 0) continue;
+      if (_ret) return _ret.v;
     }
-
     highlightedKeys.set([]);
   }
-
   function isHighlighted(key) {
     return inArray(highlightedKeys.value, key);
   }
-
   function select(key) {
     instance.set('selectedKey', key);
   }
-
   function isSelected(key) {
     return instance.get('selectedKey') === key;
   }
-
   return {
     isHighlighted: isHighlighted,
     select: select,
@@ -73,8 +64,7 @@ export function useHighlightItem() {
   onMounted(function () {
     if (instance.rootMenu.get('selectedKey') == instance.get('key')) {
       var _instance$rootMenu$hi;
-
-      (_instance$rootMenu$hi = instance.rootMenu.highlight) == null ? void 0 : _instance$rootMenu$hi.updateStatus(instance.get('key'));
+      (_instance$rootMenu$hi = instance.rootMenu.highlight) == null || _instance$rootMenu$hi.updateStatus(instance.get('key'));
     }
   });
 }

package/components/message/index.spec.js

@@ -9,86 +9,71 @@ describe('Message', function () {
   });
   it('show messages', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _mount, instance, element, _element$querySelecto, info, error, warning, success, message;
-
     return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
-            _element$querySelecto = element.querySelectorAll('.k-btn'), info = _element$querySelecto[0], error = _element$querySelecto[1], warning = _element$querySelecto[2], success = _element$querySelecto[3];
-            info.click();
-            _context.next = 5;
-            return wait();
-
-          case 5:
-            message = getElement('.k-message');
-            expect(message.outerHTML).to.matchSnapshot();
-            error.click();
-            _context.next = 10;
-            return wait();
-
-          case 10:
-            expect(getElement('.k-message').outerHTML).matchSnapshot();
-            warning.click();
-            _context.next = 14;
-            return wait();
-
-          case 14:
-            expect(getElement('.k-message').outerHTML).matchSnapshot();
-            success.click();
-            _context.next = 18;
-            return wait();
-
-          case 18:
-            expect(getElement('.k-message').outerHTML).matchSnapshot();
-
-          case 19:
-          case "end":
-            return _context.stop();
-        }
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
+          _element$querySelecto = element.querySelectorAll('.k-btn'), info = _element$querySelecto[0], error = _element$querySelecto[1], warning = _element$querySelecto[2], success = _element$querySelecto[3];
+          info.click();
+          _context.next = 5;
+          return wait();
+        case 5:
+          message = getElement('.k-message');
+          expect(message.outerHTML).to.matchSnapshot();
+          error.click();
+          _context.next = 10;
+          return wait();
+        case 10:
+          expect(getElement('.k-message').outerHTML).matchSnapshot();
+          warning.click();
+          _context.next = 14;
+          return wait();
+        case 14:
+          expect(getElement('.k-message').outerHTML).matchSnapshot();
+          success.click();
+          _context.next = 18;
+          return wait();
+        case 18:
+          expect(getElement('.k-message').outerHTML).matchSnapshot();
+        case 19:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   })));
   it('set duration', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var message, message1;
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            this.timeout(0);
-            Message.info('test', 500);
-            _context2.next = 4;
-            return wait();
-
-          case 4:
-            message = getElement('.k-message');
-            expect(message.outerHTML).to.matchSnapshot(); // should not remove when mouseenter
-
-            dispatchEvent(message, 'mouseenter');
-            _context2.next = 9;
-            return wait(1000);
-
-          case 9:
-            message1 = getElement('.k-message');
-            expect(message1).eql(message);
-            dispatchEvent(message, 'mouseleave');
-            _context2.next = 14;
-            return wait(500);
-
-          case 14:
-            message1 = getElement('.k-message');
-            expect(message1).eql(message);
-            _context2.next = 18;
-            return wait(700);
-
-          case 18:
-            message1 = getElement('.k-message');
-            expect(message1).not.eql(message);
-
-          case 20:
-          case "end":
-            return _context2.stop();
-        }
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          this.timeout(0);
+          Message.info('test', 500);
+          _context2.next = 4;
+          return wait();
+        case 4:
+          message = getElement('.k-message');
+          expect(message.outerHTML).to.matchSnapshot();
+          // should not remove when mouseenter
+          dispatchEvent(message, 'mouseenter');
+          _context2.next = 9;
+          return wait(1000);
+        case 9:
+          message1 = getElement('.k-message');
+          expect(message1).eql(message);
+          dispatchEvent(message, 'mouseleave');
+          _context2.next = 14;
+          return wait(500);
+        case 14:
+          message1 = getElement('.k-message');
+          expect(message1).eql(message);
+          _context2.next = 18;
+          return wait(700);
+        case 18:
+          message1 = getElement('.k-message');
+          expect(message1).not.eql(message);
+        case 20:
+        case "end":
+          return _context2.stop();
       }
     }, _callee2, this);
   })));

package/components/message/message.js

@@ -17,7 +17,6 @@ var typeDefs = {
   hideIcon: Boolean
 };
 var id = 0;
-
 var defaults = function defaults() {
   return {
     duration: 5000,
@@ -25,35 +24,27 @@ var defaults = function defaults() {
     closable: false
   };
 };
-
 var messages = null;
 export var Message = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Message, _Component);
-
   function Message() {
     var _context;
-
     var _this;
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _Component.call.apply(_Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
     _this.delayClose = useDelayClose(_this.close, _this.get('duration'));
     _this.config = useConfigContext();
     return _this;
   }
-
   Message.notice = function notice(content, duration, type) {
     if (duration === void 0) {
       duration = 3000;
     }
-
     if (type === void 0) {
       type = 'info';
     }
-
     if (isObject(content) && !content.tag) {
       content = _extends({}, content, {
         type: type,
@@ -67,7 +58,6 @@ export var Message = /*#__PURE__*/function (_Component) {
         key: id++
       };
     }
-
     if (!messages) {
       var container = document.createElement('div');
       document.body.append(container);
@@ -78,37 +68,28 @@ export var Message = /*#__PURE__*/function (_Component) {
         classNamePrefix: Message.classNamePrefix
       }), container);
     }
-
     messages.notice(h(Message, content));
   };
-
   Message.info = function info(content, duration) {
     Message.notice(content, duration, 'info');
   };
-
   Message.error = function error(content, duration) {
     Message.notice(content, duration, 'error');
   };
-
   Message.success = function success(content, duration) {
     Message.notice(content, duration, 'success');
   };
-
   Message.warning = function warning(content, duration) {
     Message.notice(content, duration, 'warning');
   };
-
   var _proto = Message.prototype;
-
   _proto.close = function close() {
     messages.delete(this.get('key'));
   };
-
   return Message;
 }(Component);
 Message.template = template;
 Message.typeDefs = typeDefs;
 Message.defaults = defaults;
 Message.classNamePrefix = void 0;
-
 __decorate([bind], Message.prototype, "close", null);

package/components/message/message.vdt.js

@@ -6,19 +6,16 @@ import { getRestProps } from '../utils';
 import { makeMessageStyles } from './styles';
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj, _$cn2, _$cn3;
-
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
-
   var _this$get = this.get(),
-      type = _this$get.type,
-      content = _this$get.content,
-      children = _this$get.children,
-      closable = _this$get.closable,
-      hideIcon = _this$get.hideIcon,
-      classNamePrefix = _this$get.classNamePrefix;
-
+    type = _this$get.type,
+    content = _this$get.content,
+    children = _this$get.children,
+    closable = _this$get.closable,
+    hideIcon = _this$get.hideIcon,
+    classNamePrefix = _this$get.classNamePrefix;
   var k = this.config.k;
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-message"] = true, _classNameObj[k + "-" + type] = type, _classNameObj[makeMessageStyles(k)] = true, _classNameObj);
   var iconMap = {