@king-design/vue 2.1.2 → 2.1.4

package/components/layout/layout.js

@@ -8,66 +8,51 @@ import { ROOT_LAYOUT, LAYOUT, getStyle } from './helpers';
 import { useParse } from './useParse';
 export var Layout = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Layout, _Component);
-
   function Layout() {
     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.parse = useParse();
     _this.layout = inject(LAYOUT, null);
     return _this;
   }
-
   var _proto = Layout.prototype;
-
   _proto.init = function init() {
     provide(LAYOUT, this);
-
     if (!this.layout) {
       provide(ROOT_LAYOUT, this);
     }
   };
-
   _proto.getClassNames = function getClassNames() {
     var _ref;
-
     var _this$get = this.get(),
-        className = _this$get.className,
-        children = _this$get.children;
-
+      className = _this$get.className,
+      children = _this$get.children;
     var _this$parse = this.parse(),
-        hasAside = _this$parse.hasAside;
-
+      hasAside = _this$parse.hasAside;
     return _ref = {
       'k-layout': true
     }, _ref["k-has-aside"] = hasAside, _ref[makeLayoutStyles()] = true, _ref[className] = className, _ref;
   };
-
   _proto.getStyles = function getStyles() {
     var style = this.get('style');
     var layout = this.layout;
     if (!layout) return style;
-
     var _layout$parse = layout.parse(),
-        hasFixedHeader = _layout$parse.hasFixedHeader,
-        headerHeight = _layout$parse.headerHeight,
-        hasFixedAside = _layout$parse.hasFixedAside,
-        asideWidth = _layout$parse.asideWidth;
-
-    if (!hasFixedHeader && !hasFixedAside) return style; // add margin-top if the parent layout has fixed header
-
+      hasFixedHeader = _layout$parse.hasFixedHeader,
+      headerHeight = _layout$parse.headerHeight,
+      hasFixedAside = _layout$parse.hasFixedAside,
+      asideWidth = _layout$parse.asideWidth;
+    if (!hasFixedHeader && !hasFixedAside) return style;
+    // add margin-top if the parent layout has fixed header
     return addStyle(style, {
       marginTop: hasFixedHeader ? getStyle(headerHeight) : null,
       paddingLeft: hasFixedAside ? getStyle(asideWidth) : null
     });
   };
-
   return Layout;
 }(Component);
 Layout.template = template;

package/components/layout/styles.js

@@ -10,50 +10,39 @@ var defaults = {
   get transition() {
     return theme.transition.large;
   },
-
   get color() {
     return menu.item.color;
   },
-
   get bgColor() {
     return menu.bgColor;
   },
-
   light: {
     get color() {
       return menu.light.bgColor;
     },
-
     get bgColor() {
       return menu.light.bgColor;
     },
-
     get border() {
       return menu.light.border;
     }
-
   },
   white: {
     get color() {
       return menu.white.bgColor;
     },
-
     get bgColor() {
       return menu.white.bgColor;
     },
-
     get border() {
       return menu.white.border;
     }
-
   },
-
   get collapsedWidth() {
     return "calc(" + getLeft(menu.item.padding) + " * 2 + " + menu.icon.width + ")";
   },
-
-  footerPadding: '24px 50px' // bodyMargin: '0 20px',
-
+  footerPadding: '24px 50px'
+  // bodyMargin: '0 20px',
 };
 var layout;
 setDefault(function () {

package/components/layout/template.vdt.js

@@ -5,11 +5,9 @@ export default function ($props, $blocks, $__proto__) {
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
-
   var _this$get = this.get(),
-      children = _this$get.children,
-      style = _this$get.style;
-
+    children = _this$get.children,
+    style = _this$get.style;
   return _$cv('div', _extends({
     'className': _$cn(this.getClassNames()),
     'style': this.getStyles ? this.getStyles() : style

package/components/layout/useParse.js

@@ -14,7 +14,6 @@ export function useParse() {
   var asideWidth;
   onBeforeMount(parse);
   onBeforeUpdate(parse);
-
   function parse() {
     hasAside = false;
     hasFixedHeader = false;
@@ -25,32 +24,26 @@ export function useParse() {
       if (isComponentVNode(vNode, Aside)) {
         hasAside = true;
         var props = vNode.props || EMPTY_OBJ;
-
         if (props.width) {
           asideWidth = props.width;
         }
-
         if (props.collapse) {
           asideWidth = getCollapseWidth();
         }
-
         if (props.fixed) {
           hasFixedAside = true;
         }
       } else if (isComponentVNode(vNode, Header)) {
         var _props = vNode.props || EMPTY_OBJ;
-
         if (_props.height) {
           headerHeight = _props.height;
         }
-
         if (_props.fixed) {
           hasFixedHeader = true;
         }
       }
     });
   }
-
   return function () {
     return {
       hasAside: hasAside,

package/components/menu/index.spec.js

@@ -15,281 +15,228 @@ describe('Menu', function () {
   });
   it('expand and shrink sub menu', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _mount, instance, element, title;
-
     return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
-            _context.next = 3;
-            return wait();
-
-          case 3:
-            // shrink
-            title = element.querySelector('.k-expanded .k-menu-title');
-            title.click();
-            _context.next = 7;
-            return wait(500);
-
-          case 7:
-            expect(element.outerHTML).to.matchSnapshot();
-            expect(instance.get('expandedKeys')).to.eql([]);
-            title.click();
-            _context.next = 12;
-            return wait(500);
-
-          case 12:
-            expect(element.outerHTML).to.matchSnapshot();
-            expect(instance.get('expandedKeys')).to.eql(['3']);
-
-          case 14:
-          case "end":
-            return _context.stop();
-        }
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
+          _context.next = 3;
+          return wait();
+        case 3:
+          // shrink
+          title = element.querySelector('.k-expanded .k-menu-title');
+          title.click();
+          _context.next = 7;
+          return wait(500);
+        case 7:
+          expect(element.outerHTML).to.matchSnapshot();
+          expect(instance.get('expandedKeys')).to.eql([]);
+          title.click();
+          _context.next = 12;
+          return wait(500);
+        case 12:
+          expect(element.outerHTML).to.matchSnapshot();
+          expect(instance.get('expandedKeys')).to.eql(['3']);
+        case 14:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   })));
   it('select', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var _mount2, instance, element, _element$querySelecto, title, disabledTitle, subTitle;
-
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            _mount2 = mount(CollapseDemo), instance = _mount2[0], element = _mount2[1];
-            instance.set('collapse', false);
-            _context2.next = 4;
-            return wait();
-
-          case 4:
-            expect(element.innerHTML).to.matchSnapshot();
-            _element$querySelecto = element.querySelectorAll('.k-menu-title'), title = _element$querySelecto[0], disabledTitle = _element$querySelecto[1];
-            title.click();
-            _context2.next = 9;
-            return wait();
-
-          case 9:
-            expect(element.outerHTML).to.matchSnapshot();
-            expect(instance.get('selectedKey')).to.eql('1');
-            disabledTitle.click();
-            _context2.next = 14;
-            return wait();
-
-          case 14:
-            expect(element.outerHTML).to.matchSnapshot();
-            expect(instance.get('selectedKey')).to.eql('1');
-            subTitle = element.querySelector('.k-expanded .k-menu .k-menu-title');
-            subTitle.click();
-            _context2.next = 20;
-            return wait();
-
-          case 20:
-            expect(element.outerHTML).to.matchSnapshot();
-            expect(instance.get('selectedKey')).to.eql('3-1'); // clear
-
-            instance.set('selectedKey', '');
-            _context2.next = 25;
-            return wait();
-
-          case 25:
-            expect(element.querySelector('.k-highlighted')).to.be.null;
-
-          case 26:
-          case "end":
-            return _context2.stop();
-        }
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _mount2 = mount(CollapseDemo), instance = _mount2[0], element = _mount2[1];
+          instance.set('collapse', false);
+          _context2.next = 4;
+          return wait();
+        case 4:
+          expect(element.innerHTML).to.matchSnapshot();
+          _element$querySelecto = element.querySelectorAll('.k-menu-title'), title = _element$querySelecto[0], disabledTitle = _element$querySelecto[1];
+          title.click();
+          _context2.next = 9;
+          return wait();
+        case 9:
+          expect(element.outerHTML).to.matchSnapshot();
+          expect(instance.get('selectedKey')).to.eql('1');
+          disabledTitle.click();
+          _context2.next = 14;
+          return wait();
+        case 14:
+          expect(element.outerHTML).to.matchSnapshot();
+          expect(instance.get('selectedKey')).to.eql('1');
+          subTitle = element.querySelector('.k-expanded .k-menu .k-menu-title');
+          subTitle.click();
+          _context2.next = 20;
+          return wait();
+        case 20:
+          expect(element.outerHTML).to.matchSnapshot();
+          expect(instance.get('selectedKey')).to.eql('3-1');
+          // clear
+          instance.set('selectedKey', '');
+          _context2.next = 25;
+          return wait();
+        case 25:
+          expect(element.querySelector('.k-highlighted')).to.be.null;
+        case 26:
+        case "end":
+          return _context2.stop();
       }
     }, _callee2);
   })));
   it('collapse', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
     var _mount3, instance, element, title, dropdown;
-
     return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-      while (1) {
-        switch (_context3.prev = _context3.next) {
-          case 0:
-            _mount3 = mount(CollapseDemo), instance = _mount3[0], element = _mount3[1];
-            instance.set('collapse', true);
-            _context3.next = 4;
-            return wait();
-
-          case 4:
-            expect(element.outerHTML).to.matchSnapshot(); // show sub menu
-
-            title = element.querySelector('.k-menu-item:nth-child(3) .k-menu-title');
-            dispatchEvent(title, 'mouseenter');
-            _context3.next = 9;
-            return wait();
-
-          case 9:
-            dropdown = getElement('.k-dropdown-menu.k-menu');
-            expect(dropdown.innerHTML).to.matchSnapshot();
-            dispatchEvent(dropdown.querySelector('.k-menu-item:nth-child(4) .k-menu-title'), 'mouseenter');
-            _context3.next = 14;
-            return wait();
-
-          case 14:
-            expect(getElement('.k-dropdown-menu.k-menu').innerHTML).to.matchSnapshot(); // hide all
-
-            dispatchEvent(document, 'click');
-            _context3.next = 18;
-            return wait(500);
-
-          case 18:
-            expect(getElement('.k-dropdown-menu.k-menu')).to.be.undefined;
-
-          case 19:
-          case "end":
-            return _context3.stop();
-        }
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          _mount3 = mount(CollapseDemo), instance = _mount3[0], element = _mount3[1];
+          instance.set('collapse', true);
+          _context3.next = 4;
+          return wait();
+        case 4:
+          expect(element.outerHTML).to.matchSnapshot();
+          // show sub menu
+          title = element.querySelector('.k-menu-item:nth-child(3) .k-menu-title');
+          dispatchEvent(title, 'mouseenter');
+          _context3.next = 9;
+          return wait();
+        case 9:
+          dropdown = getElement('.k-dropdown-menu.k-menu');
+          expect(dropdown.innerHTML).to.matchSnapshot();
+          dispatchEvent(dropdown.querySelector('.k-menu-item:nth-child(4) .k-menu-title'), 'mouseenter');
+          _context3.next = 14;
+          return wait();
+        case 14:
+          expect(getElement('.k-dropdown-menu.k-menu').innerHTML).to.matchSnapshot();
+          // hide all
+          dispatchEvent(document, 'click');
+          _context3.next = 18;
+          return wait(500);
+        case 18:
+          expect(getElement('.k-dropdown-menu.k-menu')).to.be.undefined;
+        case 19:
+        case "end":
+          return _context3.stop();
       }
     }, _callee3);
   })));
   it('select collapsed menu', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
     var _mount4, instance, element, title, dropdown;
-
     return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-      while (1) {
-        switch (_context4.prev = _context4.next) {
-          case 0:
-            _mount4 = mount(CollapseDemo), instance = _mount4[0], element = _mount4[1];
-            instance.set('collapse', true);
-            title = element.querySelector('.k-menu-title');
-            title.click();
-            _context4.next = 6;
-            return wait();
-
-          case 6:
-            expect(element.outerHTML).to.matchSnapshot();
-            title = element.querySelector('.k-menu-item:nth-child(3) .k-menu-title');
-            dispatchEvent(title, 'mouseenter');
-            _context4.next = 11;
-            return wait();
-
-          case 11:
-            dropdown = getElement('.k-dropdown-menu.k-menu');
-            dropdown.querySelector('.k-menu-title').click();
-            _context4.next = 15;
-            return wait();
-
-          case 15:
-            expect(dropdown.innerHTML).to.matchSnapshot(); // should hide when select
-
-            _context4.next = 18;
-            return wait(500);
-
-          case 18:
-            expect(getElement('.k-dropdown-menu.k-menu')).to.be.undefined;
-
-          case 19:
-          case "end":
-            return _context4.stop();
-        }
+      while (1) switch (_context4.prev = _context4.next) {
+        case 0:
+          _mount4 = mount(CollapseDemo), instance = _mount4[0], element = _mount4[1];
+          instance.set('collapse', true);
+          title = element.querySelector('.k-menu-title');
+          title.click();
+          _context4.next = 6;
+          return wait();
+        case 6:
+          expect(element.outerHTML).to.matchSnapshot();
+          title = element.querySelector('.k-menu-item:nth-child(3) .k-menu-title');
+          dispatchEvent(title, 'mouseenter');
+          _context4.next = 11;
+          return wait();
+        case 11:
+          dropdown = getElement('.k-dropdown-menu.k-menu');
+          dropdown.querySelector('.k-menu-title').click();
+          _context4.next = 15;
+          return wait();
+        case 15:
+          expect(dropdown.innerHTML).to.matchSnapshot();
+          // should hide when select
+          _context4.next = 18;
+          return wait(500);
+        case 18:
+          expect(getElement('.k-dropdown-menu.k-menu')).to.be.undefined;
+        case 19:
+        case "end":
+          return _context4.stop();
       }
     }, _callee4);
   })));
   it('accordion', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
     var _mount5, instance, element, menu3, subMenu1, subMenu4, menu1;
-
     return _regeneratorRuntime.wrap(function _callee5$(_context5) {
-      while (1) {
-        switch (_context5.prev = _context5.next) {
-          case 0:
-            _mount5 = mount(AccordionDemo), instance = _mount5[0], element = _mount5[1];
-            menu3 = element.children[2];
-            subMenu1 = menu3.querySelector('.k-menu').firstElementChild.querySelector('.k-menu-title');
-            subMenu1.click();
-            _context5.next = 6;
-            return wait();
-
-          case 6:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(instance.get('expandedKeys')).to.eql(['3', '3-1']);
-            subMenu4 = menu3.querySelector('.k-menu').lastElementChild.querySelector('.k-menu-title');
-            subMenu4.click();
-            _context5.next = 12;
-            return wait();
-
-          case 12:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(instance.get('expandedKeys')).to.eql(['3', '3-4']);
-            menu1 = element.firstElementChild.querySelector('.k-menu-title');
-            menu1.click();
-            _context5.next = 18;
-            return wait();
-
-          case 18:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(instance.get('expandedKeys')).to.eql(['3-4', '1']);
-            menu3.querySelector('.k-menu-title').click();
-            _context5.next = 23;
-            return wait();
-
-          case 23:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(instance.get('expandedKeys')).to.eql(['3-4', '3']);
-
-          case 25:
-          case "end":
-            return _context5.stop();
-        }
+      while (1) switch (_context5.prev = _context5.next) {
+        case 0:
+          _mount5 = mount(AccordionDemo), instance = _mount5[0], element = _mount5[1];
+          menu3 = element.children[2];
+          subMenu1 = menu3.querySelector('.k-menu').firstElementChild.querySelector('.k-menu-title');
+          subMenu1.click();
+          _context5.next = 6;
+          return wait();
+        case 6:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(instance.get('expandedKeys')).to.eql(['3', '3-1']);
+          subMenu4 = menu3.querySelector('.k-menu').lastElementChild.querySelector('.k-menu-title');
+          subMenu4.click();
+          _context5.next = 12;
+          return wait();
+        case 12:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(instance.get('expandedKeys')).to.eql(['3', '3-4']);
+          menu1 = element.firstElementChild.querySelector('.k-menu-title');
+          menu1.click();
+          _context5.next = 18;
+          return wait();
+        case 18:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(instance.get('expandedKeys')).to.eql(['3-4', '1']);
+          menu3.querySelector('.k-menu-title').click();
+          _context5.next = 23;
+          return wait();
+        case 23:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(instance.get('expandedKeys')).to.eql(['3-4', '3']);
+        case 25:
+        case "end":
+          return _context5.stop();
       }
     }, _callee5);
   })));
   it('expand when set selectedKey', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
     var Demo, _mount6, instance, expandedKeys;
-
     return _regeneratorRuntime.wrap(function _callee6$(_context7) {
-      while (1) {
-        switch (_context7.prev = _context7.next) {
-          case 0:
-            Demo = /*#__PURE__*/function (_Component) {
-              _inheritsLoose(Demo, _Component);
-
-              function Demo() {
-                var _context6;
-
-                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(_context6 = [this]).call(_context6, args)) || this;
-                _this.Menu = Menu;
-                _this.MenuItem = MenuItem;
-                return _this;
+      while (1) switch (_context7.prev = _context7.next) {
+        case 0:
+          Demo = /*#__PURE__*/function (_Component) {
+            _inheritsLoose(Demo, _Component);
+            function Demo() {
+              var _context6;
+              var _this;
+              for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+                args[_key] = arguments[_key];
               }
-
-              Demo.defaults = function defaults() {
-                return {
-                  expandedKeys: [],
-                  selectedKey: '1-3',
-                  list: ['1-1', '1-2']
-                };
+              _this = _Component.call.apply(_Component, _concatInstanceProperty(_context6 = [this]).call(_context6, args)) || this;
+              _this.Menu = Menu;
+              _this.MenuItem = MenuItem;
+              return _this;
+            }
+            Demo.defaults = function defaults() {
+              return {
+                expandedKeys: [],
+                selectedKey: '1-3',
+                list: ['1-1', '1-2']
               };
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "\n                var Menu = this.Menu;\n                var MenuItem = this.MenuItem;\n                <Menu\n                    v-model:expandedKeys=\"expandedKeys\"\n                    v-model:selectedKey=\"selectedKey\"\n                >\n                    <MenuItem key=\"1\">\n                        <Menu>\n                            <MenuItem v-for={this.get('list')} key={$value}>{$value}</MenuItem>\n                        </Menu>\n                    </MenuItem>\n                </Menu>\n            ";
-            _mount6 = mount(Demo), instance = _mount6[0];
-            _context7.next = 5;
-            return wait();
-
-          case 5:
-            instance.set('list', ['1-1', '1-2', '1-3']);
-            _context7.next = 8;
-            return wait();
-
-          case 8:
-            expandedKeys = instance.get('expandedKeys');
-            expect(_includesInstanceProperty(expandedKeys).call(expandedKeys, '1')).to.be.true;
-
-          case 10:
-          case "end":
-            return _context7.stop();
-        }
+            };
+            return Demo;
+          }(Component);
+          Demo.template = "\n                var Menu = this.Menu;\n                var MenuItem = this.MenuItem;\n                <Menu\n                    v-model:expandedKeys=\"expandedKeys\"\n                    v-model:selectedKey=\"selectedKey\"\n                >\n                    <MenuItem key=\"1\">\n                        <Menu>\n                            <MenuItem v-for={this.get('list')} key={$value}>{$value}</MenuItem>\n                        </Menu>\n                    </MenuItem>\n                </Menu>\n            ";
+          _mount6 = mount(Demo), instance = _mount6[0];
+          _context7.next = 5;
+          return wait();
+        case 5:
+          instance.set('list', ['1-1', '1-2', '1-3']);
+          _context7.next = 8;
+          return wait();
+        case 8:
+          expandedKeys = instance.get('expandedKeys');
+          expect(_includesInstanceProperty(expandedKeys).call(expandedKeys, '1')).to.be.true;
+        case 10:
+        case "end":
+          return _context7.stop();
       }
     }, _callee6);
   })));