@king-design/vue 3.1.4-beta.2 → 3.1.4

package/components/radio/index.spec.js

@@ -14,176 +14,138 @@ describe('Radio', function () {
   });
   it('should get value correctly of group radios', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _mount, instance, element, _element$querySelecto, first, second;
-
     return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _mount = mount(GroupDemo), instance = _mount[0], element = _mount[1];
-            _element$querySelecto = element.querySelectorAll('.k-radio'), first = _element$querySelecto[0], second = _element$querySelecto[1];
-            first.click();
-            _context.next = 5;
-            return wait();
-
-          case 5:
-            expect(instance.get('language')).be.eql('Javascript');
-            second.click();
-            _context.next = 9;
-            return wait();
-
-          case 9:
-            expect(instance.get('language')).be.eql('C++');
-            first.click();
-            _context.next = 13;
-            return wait();
-
-          case 13:
-            expect(instance.get('language')).be.eql('Javascript');
-
-          case 14:
-          case "end":
-            return _context.stop();
-        }
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _mount = mount(GroupDemo), instance = _mount[0], element = _mount[1];
+          _element$querySelecto = element.querySelectorAll('.k-radio'), first = _element$querySelecto[0], second = _element$querySelecto[1];
+          first.click();
+          _context.next = 5;
+          return wait();
+        case 5:
+          expect(instance.get('language')).be.eql('Javascript');
+          second.click();
+          _context.next = 9;
+          return wait();
+        case 9:
+          expect(instance.get('language')).be.eql('C++');
+          first.click();
+          _context.next = 13;
+          return wait();
+        case 13:
+          expect(instance.get('language')).be.eql('Javascript');
+        case 14:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   })));
   it('should get value correctly which set trueValue', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var _mount2, instance, element, _element$querySelecto2, first, second, third;
-
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            _mount2 = mount(ValueDemo), instance = _mount2[0], element = _mount2[1];
-            _element$querySelecto2 = element.querySelectorAll('.k-radio'), first = _element$querySelecto2[0], second = _element$querySelecto2[1], third = _element$querySelecto2[2];
-            first.click();
-            _context2.next = 5;
-            return wait();
-
-          case 5:
-            expect(instance.get('value1')).be.true;
-            second.click();
-            _context2.next = 9;
-            return wait();
-
-          case 9:
-            expect(instance.get('value2')).eql('checked');
-            third.click();
-            _context2.next = 13;
-            return wait();
-
-          case 13:
-            expect(instance.get('value3')).eql(instance.get('checkedValue'));
-
-          case 14:
-          case "end":
-            return _context2.stop();
-        }
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _mount2 = mount(ValueDemo), instance = _mount2[0], element = _mount2[1];
+          _element$querySelecto2 = element.querySelectorAll('.k-radio'), first = _element$querySelecto2[0], second = _element$querySelecto2[1], third = _element$querySelecto2[2];
+          first.click();
+          _context2.next = 5;
+          return wait();
+        case 5:
+          expect(instance.get('value1')).be.true;
+          second.click();
+          _context2.next = 9;
+          return wait();
+        case 9:
+          expect(instance.get('value2')).eql('checked');
+          third.click();
+          _context2.next = 13;
+          return wait();
+        case 13:
+          expect(instance.get('value3')).eql(instance.get('checkedValue'));
+        case 14:
+        case "end":
+          return _context2.stop();
       }
     }, _callee2);
   })));
   it('should check when press enter key for enabled radio', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
     var _mount3, instance, element, _element$querySelecto3, first, second;
-
     return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-      while (1) {
-        switch (_context3.prev = _context3.next) {
-          case 0:
-            _mount3 = mount(BasicDemo), instance = _mount3[0], element = _mount3[1];
-            _element$querySelecto3 = element.querySelectorAll('.k-radio'), first = _element$querySelecto3[0], second = _element$querySelecto3[1];
-            dispatchEvent(first, 'keypress', {
-              keyCode: 13
-            });
-            _context3.next = 5;
-            return wait();
-
-          case 5:
-            expect(first.className).include('k-checked');
-            dispatchEvent(second, 'keypress', {
-              keyCode: 13
-            });
-            _context3.next = 9;
-            return wait();
-
-          case 9:
-            expect(second.className).not.include('k-checked');
-
-          case 10:
-          case "end":
-            return _context3.stop();
-        }
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          _mount3 = mount(BasicDemo), instance = _mount3[0], element = _mount3[1];
+          _element$querySelecto3 = element.querySelectorAll('.k-radio'), first = _element$querySelecto3[0], second = _element$querySelecto3[1];
+          dispatchEvent(first, 'keypress', {
+            keyCode: 13
+          });
+          _context3.next = 5;
+          return wait();
+        case 5:
+          expect(first.className).include('k-checked');
+          dispatchEvent(second, 'keypress', {
+            keyCode: 13
+          });
+          _context3.next = 9;
+          return wait();
+        case 9:
+          expect(second.className).not.include('k-checked');
+        case 10:
+        case "end":
+          return _context3.stop();
       }
     }, _callee3);
   })));
   it('should only trigger change event once', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
     var spy, Demo, _mount4, instance, element, _element$querySelecto4, radio1, radio2, radio3;
-
     return _regeneratorRuntime.wrap(function _callee4$(_context5) {
-      while (1) {
-        switch (_context5.prev = _context5.next) {
-          case 0:
-            spy = sinon.spy();
-
-            Demo = /*#__PURE__*/function (_Component) {
-              _inheritsLoose(Demo, _Component);
-
-              function Demo() {
-                var _context4;
-
-                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(_context4 = [this]).call(_context4, args)) || this;
-                _this.Radio = Radio;
-
-                _this.onChange = function (v) {
-                  _this.set('value', v);
-
-                  spy(v);
-                };
-
-                return _this;
+      while (1) switch (_context5.prev = _context5.next) {
+        case 0:
+          spy = sinon.spy();
+          Demo = /*#__PURE__*/function (_Component) {
+            _inheritsLoose(Demo, _Component);
+            function Demo() {
+              var _context4;
+              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 {
-                  value: 1
-                };
+              _this = _Component.call.apply(_Component, _concatInstanceProperty(_context4 = [this]).call(_context4, args)) || this;
+              _this.Radio = Radio;
+              _this.onChange = function (v) {
+                _this.set('value', v);
+                spy(v);
               };
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "\n                const {Radio} = this;\n                <div>\n                    <Radio v-for={[1, 2, 3]} \n                        trueValue={$value} \n                        name=\"name\"\n                        value={this.get('value')} \n                        ev-change={this.onChange}\n                        disabled={$value === 3}\n                    />\n                </div>\n            ";
-            _mount4 = mount(Demo), instance = _mount4[0], element = _mount4[1];
-            _element$querySelecto4 = element.querySelectorAll('.k-radio'), radio1 = _element$querySelecto4[0], radio2 = _element$querySelecto4[1], radio3 = _element$querySelecto4[2];
-            radio2.click();
-            _context5.next = 8;
-            return wait();
-
-          case 8:
-            expect(spy.callCount).to.eql(1);
-            expect(spy.calledWith(2)).to.eql(true);
-            radio2.click();
-            _context5.next = 13;
-            return wait();
-
-          case 13:
-            expect(spy.callCount).to.eql(1);
-            radio3.click();
-            _context5.next = 17;
-            return wait();
-
-          case 17:
-            expect(spy.callCount).to.eql(1);
-
-          case 18:
-          case "end":
-            return _context5.stop();
-        }
+              return _this;
+            }
+            Demo.defaults = function defaults() {
+              return {
+                value: 1
+              };
+            };
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Radio} = this;\n                <div>\n                    <Radio v-for={[1, 2, 3]} \n                        trueValue={$value} \n                        name=\"name\"\n                        value={this.get('value')} \n                        ev-change={this.onChange}\n                        disabled={$value === 3}\n                    />\n                </div>\n            ";
+          _mount4 = mount(Demo), instance = _mount4[0], element = _mount4[1];
+          _element$querySelecto4 = element.querySelectorAll('.k-radio'), radio1 = _element$querySelecto4[0], radio2 = _element$querySelecto4[1], radio3 = _element$querySelecto4[2];
+          radio2.click();
+          _context5.next = 8;
+          return wait();
+        case 8:
+          expect(spy.callCount).to.eql(1);
+          expect(spy.calledWith(2)).to.eql(true);
+          radio2.click();
+          _context5.next = 13;
+          return wait();
+        case 13:
+          expect(spy.callCount).to.eql(1);
+          radio3.click();
+          _context5.next = 17;
+          return wait();
+        case 17:
+          expect(spy.callCount).to.eql(1);
+        case 18:
+        case "end":
+          return _context5.stop();
       }
     }, _callee4);
   })));

package/components/radio/index.vdt.js

@@ -7,39 +7,36 @@ import { makeStyles } from './styles';
 import { Wave } from '../wave';
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj;
-
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
-
   var _this$get = this.get(),
-      className = _this$get.className,
-      disabled = _this$get.disabled,
-      trueValue = _this$get.trueValue,
-      style = _this$get.style,
-      children = _this$get.children,
-      value = _this$get.value,
-      ref = _this$get.ref,
-      key = _this$get.key,
-      title = _this$get.title,
-      rest = _objectWithoutPropertiesLoose(_this$get, _excluded);
-
+    className = _this$get.className,
+    disabled = _this$get.disabled,
+    trueValue = _this$get.trueValue,
+    style = _this$get.style,
+    children = _this$get.children,
+    value = _this$get.value,
+    ref = _this$get.ref,
+    key = _this$get.key,
+    title = _this$get.title,
+    rest = _objectWithoutPropertiesLoose(_this$get, _excluded);
   var isChecked = value === trueValue;
   var k = this.config.k;
-  var classNameObj = (_classNameObj = {}, _classNameObj[k + "-radio"] = true, _classNameObj[k + "-disabled"] = disabled, _classNameObj[k + "-checked"] = isChecked, _classNameObj[className] = className, _classNameObj[makeStyles(k)] = true, _classNameObj); // let evClick;
+  var classNameObj = (_classNameObj = {}, _classNameObj[k + "-radio"] = true, _classNameObj[k + "-disabled"] = disabled, _classNameObj[k + "-checked"] = isChecked, _classNameObj[className] = className, _classNameObj[makeStyles(k)] = true, _classNameObj);
 
+  // let evClick;
   var events = ['ev-click', 'ev-change', 'ev-mouseenter', 'ev-mouseleave'].reduce(function (memo, name) {
     if (rest[name]) {
-      if (name === 'ev-click' || name === 'ev-change') {// don't bind click to label, otherwise it will trigger click event twice
+      if (name === 'ev-click' || name === 'ev-change') {
+        // don't bind click to label, otherwise it will trigger click event twice
         // don't bind change to input, use click instead of, #448
         // evClick = rest[name];
       } else {
         memo[name] = rest[name];
       }
-
       delete rest[name];
     }
-
     return memo;
   }, {});
   return _$cv('label', _extends({}, events, {

package/components/radio/styles.js

@@ -5,53 +5,41 @@ import '../../styles/global';
 import { cache } from '../utils';
 var defaults = {
   width: '16px',
-
   get transition() {
     return theme.transition.small;
   },
-
   get borderColor() {
     return theme.color.darkBorder;
   },
-
   get hoverBorderColor() {
     return theme.color.primary;
   },
-
   bgColor: '#fff',
   textGap: '8px',
   innerWidth: '8px',
-
   get checkedColor() {
     return theme.color.primary;
   },
-
   disabled: {
     get color() {
       return theme.color.disabled;
     },
-
     get borderColor() {
       return theme.color.disabledBorder;
     },
-
     get bgColor() {
       return theme.color.disabledBg;
     },
-
     checked: {
       get borderColor() {
         return palette(theme.color.primary, -2);
       },
-
       get bgColor() {
         return palette(theme.color.primary, -4);
       },
-
       get innerColor() {
         return palette(theme.color.primary, -3);
       }
-
     }
   }
 };
@@ -60,7 +48,7 @@ setDefault(function () {
   radio = deepDefaults(theme, {
     radio: defaults
   }).radio;
-  makeStyles == null ? void 0 : makeStyles.clearCache();
+  makeStyles == null || makeStyles.clearCache();
 });
 export var makeStyles = cache(function makeStyles(k) {
   return /*#__PURE__*/css("display:inline-flex;align-items:center;cursor:pointer;vertical-align:middle;.", k, "-radio-wrapper{width:", radio.width, ";height:", radio.width, ";border:1px solid ", radio.borderColor, ";border-radius:50%;transition:all ", radio.transition, ";position:relative;background:", radio.bgColor, ";flex:0 0 auto;&:before{content:\"\";display:block;position:absolute;width:", radio.innerWidth, ";height:", radio.innerWidth, ";top:50%;left:50%;margin-left:calc(-", radio.innerWidth, " / 2);margin-top:calc(-", radio.innerWidth, " / 2);border-radius:50%;background-color:", radio.checkedColor, ";transform:scale(0);transition:all ", radio.transition, ";}}&:hover{.", k, "-radio-wrapper{border:1px solid ", radio.hoverBorderColor, ";}}input{width:100%;height:100%;opacity:0;cursor:pointer;position:absolute;}.", k, "-radio-text{margin-left:", radio.textGap, ";flex:0 1 auto;}&.", k, "-checked{.", k, "-radio-wrapper{border-color:", radio.checkedColor, ";&:before{transform:scale(1);}}}&:focus{outline:none;.", k, "-radio-wrapper{border-color:", radio.checkedColor, ";}}&.", k, "-disabled{color:", radio.disabled.color, ";cursor:not-allowed;.", k, "-radio-wrapper{border-color:", radio.disabled.borderColor, ";background:", radio.disabled.bgColor, ";}input{cursor:not-allowed;}&.", k, "-checked{.", k, "-radio-wrapper{border-color:", radio.disabled.checked.borderColor, ";background:", radio.disabled.checked.bgColor, ";&:before{background:", radio.disabled.checked.innerColor, ";}}}}");

package/components/rate/index.js

@@ -11,35 +11,28 @@ var typeDefs = {
   half: Boolean,
   clearable: Boolean
 };
-
 var defaults = function defaults() {
   return {
     value: 0,
     count: 5
   };
 };
-
 var events = {
   mouseleave: true
 };
 export var Rate = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Rate, _Component);
-
   function Rate() {
     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.activeValue = useActiveValue();
     _this.config = useConfigContext();
     return _this;
   }
-
   return Rate;
 }(Component);
 Rate.template = template;

package/components/rate/index.spec.js

@@ -10,61 +10,53 @@ describe('Rate', function () {
   });
   it('should change value on click', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _mount, instance, element, _element$querySelecto, rate1, rate2, _rate1$querySelectorA, first1, second1, _rate2$querySelectorA, first2, second2, first;
-
     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-rate'), rate1 = _element$querySelecto[0], rate2 = _element$querySelecto[1];
-            _rate1$querySelectorA = rate1.querySelectorAll('.k-rate-item:nth-child(4) > div'), first1 = _rate1$querySelectorA[0], second1 = _rate1$querySelectorA[1];
-            first1.click();
-            expect(instance.get('value1')).to.eql(4);
-            second1.click();
-            expect(instance.get('value1')).to.eql(4); // should fix value
-
-            instance.set('value1', 3.5);
-            _context.next = 10;
-            return wait();
-
-          case 10:
-            expect(instance.get('value1')).to.eql(4); // half
-
-            _rate2$querySelectorA = rate2.querySelectorAll('.k-rate-item:nth-child(4) > div'), first2 = _rate2$querySelectorA[0], second2 = _rate2$querySelectorA[1];
-            first2.click();
-            expect(instance.get('value2')).to.eql(3.5);
-            second2.click();
-            expect(instance.get('value2')).to.eql(4); // enter
-
-            first = rate1.querySelector('.k-rate-first');
-            dispatchEvent(first, 'mouseenter');
-            _context.next = 20;
-            return wait();
-
-          case 20:
-            expect(rate1.querySelectorAll('.k-full')).to.have.lengthOf(1);
-            expect(rate1.innerHTML).to.matchSnapshot(); // leave
-
-            dispatchEvent(rate1, 'mouseleave');
-            _context.next = 25;
-            return wait();
-
-          case 25:
-            expect(rate1.querySelectorAll('.k-full')).to.have.lengthOf(4);
-            expect(rate1.innerHTML).to.matchSnapshot();
-
-          case 27:
-          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-rate'), rate1 = _element$querySelecto[0], rate2 = _element$querySelecto[1];
+          _rate1$querySelectorA = rate1.querySelectorAll('.k-rate-item:nth-child(4) > div'), first1 = _rate1$querySelectorA[0], second1 = _rate1$querySelectorA[1];
+          first1.click();
+          expect(instance.get('value1')).to.eql(4);
+          second1.click();
+          expect(instance.get('value1')).to.eql(4);
+          // should fix value
+          instance.set('value1', 3.5);
+          _context.next = 10;
+          return wait();
+        case 10:
+          expect(instance.get('value1')).to.eql(4);
+          // half
+          _rate2$querySelectorA = rate2.querySelectorAll('.k-rate-item:nth-child(4) > div'), first2 = _rate2$querySelectorA[0], second2 = _rate2$querySelectorA[1];
+          first2.click();
+          expect(instance.get('value2')).to.eql(3.5);
+          second2.click();
+          expect(instance.get('value2')).to.eql(4);
+          // enter
+          first = rate1.querySelector('.k-rate-first');
+          dispatchEvent(first, 'mouseenter');
+          _context.next = 20;
+          return wait();
+        case 20:
+          expect(rate1.querySelectorAll('.k-full')).to.have.lengthOf(1);
+          expect(rate1.innerHTML).to.matchSnapshot();
+          // leave
+          dispatchEvent(rate1, 'mouseleave');
+          _context.next = 25;
+          return wait();
+        case 25:
+          expect(rate1.querySelectorAll('.k-full')).to.have.lengthOf(4);
+          expect(rate1.innerHTML).to.matchSnapshot();
+        case 27:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   })));
   it('should clear value when click again on the clearable component', function () {
     var _mount2 = mount(ClearableDemo),
-        instance = _mount2[0],
-        element = _mount2[1];
-
+      instance = _mount2[0],
+      element = _mount2[1];
     var first = element.querySelector('.k-rate-first');
     first.click();
     expect(instance.get('value')).to.eql(1);
@@ -73,37 +65,30 @@ describe('Rate', function () {
   });
   it('disabled', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var _mount3, instance, element, first;
-
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            _mount3 = mount(DisabledDemo), instance = _mount3[0], element = _mount3[1];
-            first = element.querySelector('.k-rate-first');
-            first.click();
-            _context2.next = 5;
-            return wait();
-
-          case 5:
-            expect(element.querySelectorAll('.k-full')).to.have.lengthOf(2);
-            dispatchEvent(first, 'mouseenter');
-            _context2.next = 9;
-            return wait();
-
-          case 9:
-            expect(element.querySelectorAll('.k-full')).to.have.lengthOf(2); // leave
-
-            dispatchEvent(element, 'mouseleave');
-            _context2.next = 13;
-            return wait();
-
-          case 13:
-            expect(element.querySelectorAll('.k-full')).to.have.lengthOf(2);
-
-          case 14:
-          case "end":
-            return _context2.stop();
-        }
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _mount3 = mount(DisabledDemo), instance = _mount3[0], element = _mount3[1];
+          first = element.querySelector('.k-rate-first');
+          first.click();
+          _context2.next = 5;
+          return wait();
+        case 5:
+          expect(element.querySelectorAll('.k-full')).to.have.lengthOf(2);
+          dispatchEvent(first, 'mouseenter');
+          _context2.next = 9;
+          return wait();
+        case 9:
+          expect(element.querySelectorAll('.k-full')).to.have.lengthOf(2);
+          // leave
+          dispatchEvent(element, 'mouseleave');
+          _context2.next = 13;
+          return wait();
+        case 13:
+          expect(element.querySelectorAll('.k-full')).to.have.lengthOf(2);
+        case 14:
+        case "end":
+          return _context2.stop();
       }
     }, _callee2);
   })));