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

package/components/editable/index.js

@@ -17,7 +17,6 @@ var typeDefs = {
   trim: Boolean,
   invalid: Boolean
 };
-
 var defaults = function defaults() {
   return {
     required: true,
@@ -25,31 +24,24 @@ var defaults = function defaults() {
     trim: true
   };
 };
-
 var events = {
   error: true,
   change: true
 };
 export var Editable = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Editable, _Component);
-
   function Editable() {
     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.inputRef = createRef();
     _this.config = useConfigContext();
     return _this;
   }
-
   var _proto = Editable.prototype;
-
   _proto.edit = function edit() {
     this.set('editing', true);
     /**
@@ -66,39 +58,32 @@ export var Editable = /*#__PURE__*/function (_Component) {
     // });
     // });
   };
-
   _proto.select = function select() {
     this.inputRef.value.select();
   };
-
   _proto.onBlur = function onBlur(e) {
     this.setValue(e.target.value);
   };
-
   _proto.onKeydown = function onKeydown(e) {
     switch (e.keyCode) {
       case 27:
         // esc 
         this.set('editing', false);
         break;
-
       case 13:
         // enter
         this.onBlur(e);
         break;
     }
   };
-
   _proto.setValue = function setValue(value) {
     var _this$get = this.get(),
-        validate = _this$get.validate,
-        required = _this$get.required,
-        trim = _trimInstanceProperty(_this$get),
-        oldValue = _this$get.value;
-
+      validate = _this$get.validate,
+      required = _this$get.required,
+      trim = _trimInstanceProperty(_this$get),
+      oldValue = _this$get.value;
     if (trim) value = _trimInstanceProperty(value).call(value);
     var valid = true;
-
     if (required && !value) {
       valid = false;
     } else if (validate && value) {
@@ -110,38 +95,29 @@ export var Editable = /*#__PURE__*/function (_Component) {
         valid = new RegExp(validate).test(value);
       }
     }
-
     if (!valid) {
       // do not change the value if invalid, #51
       // this.set('value', value, {silent: true});
       this.set('invalid', true);
       return this.trigger('error', value);
     }
-
     this.set({
       invalid: false,
       editing: false,
       value: value
     });
-
     if (oldValue !== value) {
       this.trigger('change', value, oldValue);
     }
   };
-
   return Editable;
 }(Component);
 Editable.template = template;
 Editable.typeDefs = typeDefs;
 Editable.defaults = defaults;
 Editable.events = events;
-
 __decorate([bind], Editable.prototype, "edit", null);
-
 __decorate([bind], Editable.prototype, "select", null);
-
 __decorate([bind], Editable.prototype, "onBlur", null);
-
 __decorate([bind], Editable.prototype, "onKeydown", null);
-
 __decorate([bind], Editable.prototype, "setValue", null);

package/components/editable/index.spec.js

@@ -13,210 +13,173 @@ describe('Editable', function () {
   });
   it('basic test', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _mount, instance, element, editable, input;
-
     return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
-            editable = instance.refs.__test; // @ts-ignore
-
-            editable.edit();
-            _context.next = 5;
-            return wait();
-
-          case 5:
-            expect(element.innerHTML).to.matchSnapshot(); // input
-
-            input = element.querySelector('input');
-            input.value = 'test';
-            dispatchEvent(input, 'blur');
-            _context.next = 11;
-            return wait();
-
-          case 11:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(instance.get('text')).to.eql('test'); // keydown: esc
-            // @ts-ignore
-
-            editable.edit();
-            _context.next = 16;
-            return wait();
-
-          case 16:
-            expect(element.innerHTML).to.matchSnapshot();
-            input = element.querySelector('input');
-            input.value = 'new';
-            dispatchEvent(input, 'keydown', {
-              keyCode: 27
-            });
-            _context.next = 22;
-            return wait();
-
-          case 22:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(instance.get('text')).to.eql('test'); // keydown: enter
-            // @ts-ignore
-
-            editable.edit();
-            _context.next = 27;
-            return wait();
-
-          case 27:
-            expect(element.innerHTML).to.matchSnapshot();
-            input = element.querySelector('input');
-            input.value = 'new';
-            dispatchEvent(input, 'keydown', {
-              keyCode: 13
-            });
-            _context.next = 33;
-            return wait();
-
-          case 33:
-            expect(element.innerHTML).to.matchSnapshot();
-            expect(instance.get('text')).to.eql('new');
-
-          case 35:
-          case "end":
-            return _context.stop();
-        }
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
+          editable = instance.refs.__test; // @ts-ignore
+          editable.edit();
+          _context.next = 5;
+          return wait();
+        case 5:
+          expect(element.innerHTML).to.matchSnapshot();
+          // input
+          input = element.querySelector('input');
+          input.value = 'test';
+          dispatchEvent(input, 'blur');
+          _context.next = 11;
+          return wait();
+        case 11:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(instance.get('text')).to.eql('test');
+          // keydown: esc
+          // @ts-ignore
+          editable.edit();
+          _context.next = 16;
+          return wait();
+        case 16:
+          expect(element.innerHTML).to.matchSnapshot();
+          input = element.querySelector('input');
+          input.value = 'new';
+          dispatchEvent(input, 'keydown', {
+            keyCode: 27
+          });
+          _context.next = 22;
+          return wait();
+        case 22:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(instance.get('text')).to.eql('test');
+          // keydown: enter
+          // @ts-ignore
+          editable.edit();
+          _context.next = 27;
+          return wait();
+        case 27:
+          expect(element.innerHTML).to.matchSnapshot();
+          input = element.querySelector('input');
+          input.value = 'new';
+          dispatchEvent(input, 'keydown', {
+            keyCode: 13
+          });
+          _context.next = 33;
+          return wait();
+        case 33:
+          expect(element.innerHTML).to.matchSnapshot();
+          expect(instance.get('text')).to.eql('new');
+        case 35:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   })));
   it('validate test', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var _mount2, instance, element, _instance$refs, first, second, third, input;
-
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            _mount2 = mount(ValidateDemo), instance = _mount2[0], element = _mount2[1];
-            _instance$refs = instance.refs, first = _instance$refs.__test1, second = _instance$refs.__test2, third = _instance$refs.__test3; // validate
-            // @ts-ignore
-
-            first.edit();
-            _context2.next = 5;
-            return wait();
-
-          case 5:
-            input = findDomFromVNode(first.$lastInput, true).querySelector('input');
-            dispatchEvent(input, 'focus');
-            input.value = 'a';
-            dispatchEvent(input, 'input');
-            dispatchEvent(input, 'blur');
-            _context2.next = 12;
-            return wait();
-
-          case 12:
-            expect(element.innerHTML).to.matchSnapshot(); // @ts-ignore
-
-            second.edit();
-            _context2.next = 16;
-            return wait();
-
-          case 16:
-            input = findDomFromVNode(second.$lastInput, true).querySelector('input');
-            input.value = 'a';
-            dispatchEvent(input, 'input');
-            dispatchEvent(input, 'blur');
-            _context2.next = 22;
-            return wait();
-
-          case 22:
-            expect(element.innerHTML).to.matchSnapshot(); // @ts-ignore
-
-            third.edit();
-            _context2.next = 26;
-            return wait();
-
-          case 26:
-            input = findDomFromVNode(third.$lastInput, true).querySelector('input');
-            input.value = 'a';
-            dispatchEvent(input, 'input');
-            dispatchEvent(input, 'blur');
-            _context2.next = 32;
-            return wait();
-
-          case 32:
-            expect(element.innerHTML).to.matchSnapshot(); // required
-
-            input.value = '';
-            dispatchEvent(input, 'input');
-            dispatchEvent(input, 'blur');
-            _context2.next = 38;
-            return wait();
-
-          case 38:
-            expect(element.innerHTML).to.matchSnapshot();
-
-          case 39:
-          case "end":
-            return _context2.stop();
-        }
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _mount2 = mount(ValidateDemo), instance = _mount2[0], element = _mount2[1];
+          _instance$refs = instance.refs, first = _instance$refs.__test1, second = _instance$refs.__test2, third = _instance$refs.__test3; // validate
+          // @ts-ignore
+          first.edit();
+          _context2.next = 5;
+          return wait();
+        case 5:
+          input = findDomFromVNode(first.$lastInput, true).querySelector('input');
+          dispatchEvent(input, 'focus');
+          input.value = 'a';
+          dispatchEvent(input, 'input');
+          dispatchEvent(input, 'blur');
+          _context2.next = 12;
+          return wait();
+        case 12:
+          expect(element.innerHTML).to.matchSnapshot();
+          // @ts-ignore
+          second.edit();
+          _context2.next = 16;
+          return wait();
+        case 16:
+          input = findDomFromVNode(second.$lastInput, true).querySelector('input');
+          input.value = 'a';
+          dispatchEvent(input, 'input');
+          dispatchEvent(input, 'blur');
+          _context2.next = 22;
+          return wait();
+        case 22:
+          expect(element.innerHTML).to.matchSnapshot();
+          // @ts-ignore
+          third.edit();
+          _context2.next = 26;
+          return wait();
+        case 26:
+          input = findDomFromVNode(third.$lastInput, true).querySelector('input');
+          input.value = 'a';
+          dispatchEvent(input, 'input');
+          dispatchEvent(input, 'blur');
+          _context2.next = 32;
+          return wait();
+        case 32:
+          expect(element.innerHTML).to.matchSnapshot();
+          // required
+          input.value = '';
+          dispatchEvent(input, 'input');
+          dispatchEvent(input, 'blur');
+          _context2.next = 38;
+          return wait();
+        case 38:
+          expect(element.innerHTML).to.matchSnapshot();
+        case 39:
+        case "end":
+          return _context2.stop();
       }
     }, _callee2);
   })));
   it('handle correctly even if the value is undefined', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
     var Demo, _mount3, instance, element, input;
-
     return _regeneratorRuntime.wrap(function _callee3$(_context4) {
-      while (1) {
-        switch (_context4.prev = _context4.next) {
-          case 0:
-            Demo = /*#__PURE__*/function (_Component) {
-              _inheritsLoose(Demo, _Component);
-
-              function Demo() {
-                var _context3;
-
-                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(_context3 = [this]).call(_context3, args)) || this;
-                _this.Editable = Editable;
-                return _this;
+      while (1) switch (_context4.prev = _context4.next) {
+        case 0:
+          Demo = /*#__PURE__*/function (_Component) {
+            _inheritsLoose(Demo, _Component);
+            function Demo() {
+              var _context3;
+              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: 'test'
-                };
+              _this = _Component.call.apply(_Component, _concatInstanceProperty(_context3 = [this]).call(_context3, args)) || this;
+              _this.Editable = Editable;
+              return _this;
+            }
+            Demo.defaults = function defaults() {
+              return {
+                value: 'test'
               };
-
-              return Demo;
-            }(Component);
-
-            Demo.template = "const {Editable} = this; <Editable>{this.get('value')}</Editable>";
-            _mount3 = mount(Demo), instance = _mount3[0], element = _mount3[1];
-            expect(element.outerHTML).to.matchSnapshot();
-            element.querySelector('.k-editable-icon').click();
-            _context4.next = 7;
-            return wait();
-
-          case 7:
-            input = element.querySelector("input");
-            input.value = 'aa';
-            dispatchEvent(input, 'blur');
-            _context4.next = 12;
-            return wait();
-
-          case 12:
-            expect(element.innerText).to.eql('test');
-            element.querySelector('.k-editable-icon').click();
-            _context4.next = 16;
-            return wait();
-
-          case 16:
-            input = element.querySelector("input");
-            expect(input.value).to.eql('aa');
-
-          case 18:
-          case "end":
-            return _context4.stop();
-        }
+            };
+            return Demo;
+          }(Component);
+          Demo.template = "const {Editable} = this; <Editable>{this.get('value')}</Editable>";
+          _mount3 = mount(Demo), instance = _mount3[0], element = _mount3[1];
+          expect(element.outerHTML).to.matchSnapshot();
+          element.querySelector('.k-editable-icon').click();
+          _context4.next = 7;
+          return wait();
+        case 7:
+          input = element.querySelector("input");
+          input.value = 'aa';
+          dispatchEvent(input, 'blur');
+          _context4.next = 12;
+          return wait();
+        case 12:
+          expect(element.innerText).to.eql('test');
+          element.querySelector('.k-editable-icon').click();
+          _context4.next = 16;
+          return wait();
+        case 16:
+          input = element.querySelector("input");
+          expect(input.value).to.eql('aa');
+        case 18:
+        case "end":
+          return _context4.stop();
       }
     }, _callee3);
   })));

package/components/editable/index.vdt.js

@@ -7,21 +7,18 @@ import { makeStyles } from './styles';
 import { Tooltip } from '../tooltip';
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj;
-
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
-
   var _this$get = this.get(),
-      children = _this$get.children,
-      className = _this$get.className,
-      editing = _this$get.editing,
-      value = _this$get.value,
-      validate = _this$get.validate,
-      disabled = _this$get.disabled,
-      tip = _this$get.tip,
-      invalid = _this$get.invalid;
-
+    children = _this$get.children,
+    className = _this$get.className,
+    editing = _this$get.editing,
+    value = _this$get.value,
+    validate = _this$get.validate,
+    disabled = _this$get.disabled,
+    tip = _this$get.tip,
+    invalid = _this$get.invalid;
   var k = this.config.k;
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-editable"] = true, _classNameObj[k + "-editing"] = editing, _classNameObj[k + "-disabled"] = disabled, _classNameObj[k + "-invalid"] = invalid, _classNameObj[className] = className, _classNameObj[makeStyles(k)] = true, _classNameObj);
   return _$cv('div', _extends({}, getRestProps(this), {

package/components/editable/styles.js

@@ -10,7 +10,6 @@ var defaults = {
     get border() {
       return "1px solid " + theme.color.danger;
     }
-
   }
 };
 var editable;
@@ -18,7 +17,7 @@ setDefault(function () {
   editable = deepDefaults(theme, {
     editable: defaults
   }).editable;
-  makeStyles == null ? void 0 : makeStyles.clearCache();
+  makeStyles == null || makeStyles.clearCache();
 });
 export { editable };
 export var makeStyles = cache(function makeStyles(k) {

package/components/form/form.js

@@ -16,43 +16,33 @@ var typeDefs = {
   starOnRequired: Boolean,
   size: ['default', 'small', 'mini']
 };
-
 var defaults = function defaults() {
   return {
     layout: 'horizontal',
     size: 'default'
   };
 };
-
 export var FORM = 'Form';
 export var RECORD_KEY = 'FormRecord';
 export var Form = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Form, _Component);
-
   function Form() {
     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.items = useRecordParent(RECORD_KEY);
     _this.config = useConfigContext();
     return _this;
   }
-
   var _proto = Form.prototype;
-
   _proto.init = function init() {
     provide(FORM, this);
   };
-
   _proto.validate = function validate() {
     var _context2;
-
     return _Promise.all(_mapInstanceProperty(_context2 = this.items).call(_context2, function (item) {
       return item.validate();
     })).then(function (values) {
@@ -61,43 +51,35 @@ export var Form = /*#__PURE__*/function (_Component) {
       });
     });
   };
-
   _proto.getFirstInvalidFormItem = function getFirstInvalidFormItem() {
     var _context3;
-
     return _findInstanceProperty(_context3 = this.items).call(_context3, function (item) {
       if (!item.isValid()) {
         return item;
       }
     });
   };
-
   _proto.submit = function submit(e) {
     var _this2 = this;
-
     this.validate().then(function (valid) {
       if (valid) {
         _this2.trigger('submit', e);
       }
     });
   };
-
   _proto.reset = function reset() {
     this.items.forEach(function (item) {
       return item.reset();
     });
   };
-
   _proto.onSubmit = function onSubmit(e) {
     e.preventDefault();
     this.submit(e);
   };
-
   return Form;
 }(Component);
 Form.template = template;
 Form.typeDefs = typeDefs;
 Form.defaults = defaults;
 Form.addMethod = addMethod;
-
 __decorate([bind], Form.prototype, "onSubmit", null);

package/components/form/form.vdt.js

@@ -4,17 +4,14 @@ import { getRestProps } from '../utils';
 import { makeFormStyles } from './styles';
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj;
-
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
-
   var _this$get = this.get(),
-      children = _this$get.children,
-      className = _this$get.className,
-      layout = _this$get.layout,
-      size = _this$get.size;
-
+    children = _this$get.children,
+    className = _this$get.className,
+    layout = _this$get.layout,
+    size = _this$get.size;
   var k = this.config.k;
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-form"] = true, _classNameObj[className] = className, _classNameObj[k + "-" + layout] = layout, _classNameObj[k + "-" + size] = size !== 'default', _classNameObj[makeFormStyles(k)] = true, _classNameObj);
   return _$cv('form', _extends({}, getRestProps(this), {