@king-design/react 3.0.0-beta.0 → 3.0.0-beta.2

package/components/switch/index.spec.js

@@ -1,6 +1,7 @@
 import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
 import BasicDemo from '~/components/switch/demos/basic';
+import DisabledDemo from '~/components/switch/demos/disabled';
 import ValueDemo from '~/components/switch/demos/value';
 import WidthHeightDemo from '~/components/switch/demos/widthHeight';
 import { mount, unmount, dispatchEvent, wait } from '../../test/utils';
@@ -9,14 +10,14 @@ describe('Switch', function () {
     unmount();
   });
   it('change value by clicking', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-    var _mount, instance, element, _element$querySelecto, el, disabledEl, handle;
+    var _mount, instance, element, _element$querySelecto, el, handle;
 
     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-switch'), el = _element$querySelecto[0], disabledEl = _element$querySelecto[1];
+            _element$querySelecto = element.querySelectorAll('.k-switch'), el = _element$querySelecto[0];
             el.click();
             _context.next = 5;
             return wait();
@@ -38,29 +39,61 @@ describe('Switch', function () {
 
           case 16:
             expect(instance.get('value')).to.be.false;
-            disabledEl.click();
-            _context.next = 20;
-            return wait();
-
-          case 20:
-            expect(element.outerHTML).to.matchSnapshot();
 
-          case 21:
+          case 17:
           case "end":
             return _context.stop();
         }
       }
     }, _callee);
   })));
-  it('change value by draging', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-    var _mount2, instance, element, _element$querySelecto2, el, disabledEl;
+  it('disabled', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+    var _mount2, instance, element, el;
 
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
       while (1) {
         switch (_context2.prev = _context2.next) {
           case 0:
-            _mount2 = mount(BasicDemo), instance = _mount2[0], element = _mount2[1];
-            _element$querySelecto2 = element.querySelectorAll('.k-switch-handle'), el = _element$querySelecto2[0], disabledEl = _element$querySelecto2[1];
+            _mount2 = mount(DisabledDemo), instance = _mount2[0], element = _mount2[1];
+            el = element.querySelector('.k-switch');
+            el.click();
+            _context2.next = 5;
+            return wait();
+
+          case 5:
+            expect(element.outerHTML).to.matchSnapshot();
+            dispatchEvent(el, 'mousedown', {
+              which: 1,
+              clientX: 0
+            });
+            dispatchEvent(document, 'mousemove', {
+              clientX: 30
+            });
+            dispatchEvent(document, 'mouseup', {
+              clientX: 30
+            });
+            _context2.next = 11;
+            return wait();
+
+          case 11:
+            expect(element.outerHTML).to.matchSnapshot();
+
+          case 12:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2);
+  })));
+  it('change value by draging', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
+    var _mount3, instance, element, _element$querySelecto2, el;
+
+    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$querySelecto2 = element.querySelectorAll('.k-switch-handle'), el = _element$querySelecto2[0];
             dispatchEvent(el, 'mousedown', {
               which: 1,
               clientX: 0
@@ -68,7 +101,7 @@ describe('Switch', function () {
             dispatchEvent(document, 'mousemove', {
               clientX: 1
             });
-            _context2.next = 6;
+            _context3.next = 6;
             return wait();
 
           case 6:
@@ -77,7 +110,7 @@ describe('Switch', function () {
             dispatchEvent(document, 'mouseup', {
               clientX: 1
             });
-            _context2.next = 10;
+            _context3.next = 10;
             return wait();
 
           case 10:
@@ -93,7 +126,7 @@ describe('Switch', function () {
             dispatchEvent(document, 'mouseup', {
               clientX: 30
             });
-            _context2.next = 17;
+            _context3.next = 17;
             return wait();
 
           case 17:
@@ -109,7 +142,7 @@ describe('Switch', function () {
             dispatchEvent(document, 'mouseup', {
               clientX: -30
             });
-            _context2.next = 24;
+            _context3.next = 24;
             return wait();
 
           case 24:
@@ -122,43 +155,27 @@ describe('Switch', function () {
             dispatchEvent(document, 'mouseup', {
               clientX: 0
             });
-            _context2.next = 29;
+            _context3.next = 29;
             return wait();
 
           case 29:
-            expect(instance.get('value')).to.be.true; // disabled
-
-            dispatchEvent(disabledEl, 'mousedown', {
-              which: 1,
-              clientX: 0
-            });
-            dispatchEvent(document, 'mousemove', {
-              clientX: 30
-            });
-            dispatchEvent(document, 'mouseup', {
-              clientX: 30
-            });
-            _context2.next = 35;
-            return wait();
-
-          case 35:
-            expect(element.outerHTML).to.matchSnapshot();
+            expect(instance.get('value')).to.be.true;
 
-          case 36:
+          case 30:
           case "end":
-            return _context2.stop();
+            return _context3.stop();
         }
       }
-    }, _callee2);
+    }, _callee3);
   })));
-  it('drag switch which has custom width and height', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-    var _mount3, instance, element, _element$querySelecto3, el;
+  it('drag switch which has custom width and height', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
+    var _mount4, instance, element, _element$querySelecto3, el;
 
-    return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
       while (1) {
-        switch (_context3.prev = _context3.next) {
+        switch (_context4.prev = _context4.next) {
           case 0:
-            _mount3 = mount(WidthHeightDemo), instance = _mount3[0], element = _mount3[1];
+            _mount4 = mount(WidthHeightDemo), instance = _mount4[0], element = _mount4[1];
             _element$querySelecto3 = element.querySelectorAll('.k-switch-handle'), el = _element$querySelecto3[2];
             dispatchEvent(el, 'mousedown', {
               which: 1,
@@ -170,7 +187,7 @@ describe('Switch', function () {
             dispatchEvent(document, 'mouseup', {
               clientX: 50
             });
-            _context3.next = 7;
+            _context4.next = 7;
             return wait();
 
           case 7:
@@ -185,7 +202,7 @@ describe('Switch', function () {
             dispatchEvent(document, 'mouseup', {
               clientX: -50
             });
-            _context3.next = 13;
+            _context4.next = 13;
             return wait();
 
           case 13:
@@ -193,24 +210,24 @@ describe('Switch', function () {
 
           case 14:
           case "end":
-            return _context3.stop();
+            return _context4.stop();
         }
       }
-    }, _callee3);
+    }, _callee4);
   })));
-  it('change value by keypress', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
-    var _mount4, instance, element, el;
+  it('change value by keypress', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
+    var _mount5, instance, element, el;
 
-    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+    return _regeneratorRuntime.wrap(function _callee5$(_context5) {
       while (1) {
-        switch (_context4.prev = _context4.next) {
+        switch (_context5.prev = _context5.next) {
           case 0:
-            _mount4 = mount(BasicDemo), instance = _mount4[0], element = _mount4[1];
+            _mount5 = mount(BasicDemo), instance = _mount5[0], element = _mount5[1];
             el = element.querySelector('.k-switch');
             dispatchEvent(el, 'keypress', {
               keyCode: 13
             });
-            _context4.next = 5;
+            _context5.next = 5;
             return wait();
 
           case 5:
@@ -218,7 +235,7 @@ describe('Switch', function () {
             dispatchEvent(el, 'keypress', {
               keyCode: 13
             });
-            _context4.next = 9;
+            _context5.next = 9;
             return wait();
 
           case 9:
@@ -226,30 +243,30 @@ describe('Switch', function () {
 
           case 10:
           case "end":
-            return _context4.stop();
+            return _context5.stop();
         }
       }
-    }, _callee4);
+    }, _callee5);
   })));
-  it('custom the value', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
-    var _mount5, instance, element, _element$querySelecto4, el1, el2;
+  it('custom the value', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
+    var _mount6, instance, element, _element$querySelecto4, el1, el2;
 
-    return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+    return _regeneratorRuntime.wrap(function _callee6$(_context6) {
       while (1) {
-        switch (_context5.prev = _context5.next) {
+        switch (_context6.prev = _context6.next) {
           case 0:
-            _mount5 = mount(ValueDemo), instance = _mount5[0], element = _mount5[1];
+            _mount6 = mount(ValueDemo), instance = _mount6[0], element = _mount6[1];
             _element$querySelecto4 = element.querySelectorAll('.k-switch'), el1 = _element$querySelecto4[0], el2 = _element$querySelecto4[1];
             el1.click();
             el2.click();
-            _context5.next = 6;
+            _context6.next = 6;
             return wait();
 
           case 6:
             expect(element.outerHTML).to.matchSnapshot();
             el1.click();
             el2.click();
-            _context5.next = 11;
+            _context6.next = 11;
             return wait();
 
           case 11:
@@ -257,9 +274,9 @@ describe('Switch', function () {
 
           case 12:
           case "end":
-            return _context5.stop();
+            return _context6.stop();
         }
       }
-    }, _callee5);
+    }, _callee6);
   })));
 });

package/components/table/cell.js

@@ -16,12 +16,7 @@ export var TableCell = /*#__PURE__*/function (_Component) {
     var isSame = true;
 
     for (var key in lastProps) {
-      if (lastProps[key] !== nextProps[key]) {
-        isSame = false;
-        break;
-      }
-
-      if (key === 'props' && nextProps.props.$blocks) {
+      if (lastProps[key] !== nextProps[key] || key === 'props' && nextProps.props.$blocks) {
         isSame = false;
         break;
       }

package/components/table/cell.vdt.js

@@ -5,7 +5,7 @@ import { Button } from '../button';
 import { Icon } from '../icon';
 import { getTextByChildren } from '../utils';
 var _$tmp0 = {
-  'className': 'ion-ios-arrow-right',
+  'className': 'k-icon-right',
   'size': 'small'
 };
 export default function ($props, $blocks, $__proto__) {

package/components/table/column.vdt.js

@@ -6,7 +6,7 @@ import { Button } from '../button';
 import { Icon } from '../icon';
 import { Checkbox } from '../checkbox';
 import { makeGroupMenuStyles } from './styles';
-import { isStringOrNumber, get } from 'intact-shared';
+import { isStringOrNumber, get, isArray } from 'intact-shared';
 import { context as GroupContext } from './useGroup';
 import { context as SortableContext } from './useSortable';
 import { linkEvent } from 'intact';
@@ -17,16 +17,15 @@ import { stopPropagation } from '../utils';
 import { Input } from '../input';
 import { _$ } from '../../i18n';
 var _$tmp0 = {
-  'className': 'ion-android-arrow-dropdown'
+  'className': 'k-icon-search'
 };
 var _$tmp1 = {
-  'className': 'ion-ios-search'
+  'className': 'k-icon-up k-asc',
+  'size': 'mini'
 };
 var _$tmp2 = {
-  'className': 'ion-android-arrow-dropup k-asc'
-};
-var _$tmp3 = {
-  'className': 'ion-android-arrow-dropdown k-desc'
+  'className': 'k-icon-down k-desc',
+  'size': 'mini'
 };
 export default function ($props, $blocks, $__proto__) {
   var _this = this;
@@ -50,9 +49,14 @@ export default function ($props, $blocks, $__proto__) {
   var _this$group = this.group,
       onSelect = _this$group.onSelect,
       isChecked = _this$group.isChecked,
-      getGroupText = _this$group.getGroupText,
       keywords = _this$group.keywords,
-      filteredGroup = _this$group.filteredGroup;
+      filteredGroup = _this$group.filteredGroup,
+      onShow = _this$group.onShow,
+      reset = _this$group.reset,
+      confirm = _this$group.confirm,
+      dropdownRef = _this$group.dropdownRef,
+      localGroupValue = _this$group.localGroupValue,
+      isEmptyValue = _this$group.isEmptyValue;
   return _$cc(TableContext.Consumer, {
     'children': function children(checkType) {
       return _$cc(GroupContext.Consumer, {
@@ -80,7 +84,6 @@ export default function ($props, $blocks, $__proto__) {
                         'k-column-sortable': sortable
                       }, _classNameObj[className] = className, _classNameObj);
                       var groupValue = currentGroup && currentGroup[key];
-                      var groupText = getGroupText(groupValue);
                       var type = sort && sort.key === key && sort.type;
                       var checked;
                       return _$ce(2, 'th', [resizable && _this.$vNode.props.prevVNode ? _$ce(2, 'div', null, 1, 'k-table-resize', {
@@ -88,7 +91,7 @@ export default function ($props, $blocks, $__proto__) {
                           e._vNode = _this.$vNode;
                           onStart(e);
                         }
-                      }) : undefined, _$ce(2, 'div', [_$ce(2, 'div', [(_$blocks['title'] = function ($super) {
+                      }) : undefined, _$ce(2, 'div', [_$ce(2, 'div', (_$blocks['title'] = function ($super) {
                         return title;
                       }, __$blocks['title'] = function ($super, data) {
                         var block = $blocks['title'];
@@ -98,7 +101,7 @@ export default function ($props, $blocks, $__proto__) {
                         };
 
                         return block ? block.call($this, callBlock, data) : callBlock();
-                      }, __$blocks['title'](_$no)), groupText], 0, 'k-table-title-text c-ellipsis'), group ? _$cc(Dropdown, {
+                      }, __$blocks['title'](_$no)), 0, 'k-table-title-text c-ellipsis'), group ? _$cc(Dropdown, {
                         'position': {
                           my: 'center top',
                           at: 'center bottom+5',
@@ -107,16 +110,16 @@ export default function ($props, $blocks, $__proto__) {
                         'key': 'dropdown',
                         'trigger': 'click',
                         'ev-show': function evShow() {
-                          return keywords.set('');
+                          return onShow(groupValue);
                         },
-                        'children': [_$cc(Button, {
-                          'icon': true,
-                          'size': 'mini',
-                          'className': 'k-table-group',
+                        'ref': dropdownRef,
+                        'children': [_$cc(Icon, {
+                          'className': 'k-icon-down-squared k-table-group',
                           'ev-click': function evClick(e) {
                             return e._ignoreSortable = true;
                           },
-                          'children': _$cc(Icon, _$tmp0)
+                          'hoverable': true,
+                          'color': isEmptyValue(groupValue) ? null : 'primary'
                         }), _$cc(DropdownMenu, {
                           'className': _$cn((_$cn2 = {
                             "k-table-group-dropdown": true
@@ -133,7 +136,7 @@ export default function ($props, $blocks, $__proto__) {
                                   __$blocks = _$ex({}, $blocks);
 
                               return (_$blocks['suffix'] = function ($super) {
-                                return _$cc(Icon, _$tmp1);
+                                return _$cc(Icon, _$tmp0);
                               }, __$blocks['suffix'] = function ($super, data) {
                                 var block = $blocks['suffix'];
 
@@ -147,24 +150,37 @@ export default function ($props, $blocks, $__proto__) {
                           }), 2, 'k-table-group-header'), _$ce(2, 'div', _$ma(filteredGroup.value, function ($value, $key) {
                             return _$cc(DropdownItem, {
                               'ev-select': function evSelect() {
-                                return onSelect($value.value, groupValue, onChange);
+                                return onSelect($value.value, onChange);
                               },
                               'hideOnSelect': !multiple,
                               'className': _$cn({
-                                'k-active': checked = isChecked($value.value, groupValue)
+                                'k-active': checked = isChecked($value.value)
                               }),
                               'children': multiple ? _$cc(Checkbox, {
                                 'value': checked,
                                 'children': $value.label
                               }) : _$ce(2, 'span', $value.label, 0)
                             });
-                          }, $this), 4, 'k-table-group-body')]
+                          }, $this), 4, 'k-table-group-body'), multiple ? _$ce(2, 'div', [_$cc(Button, {
+                            'type': 'none',
+                            'size': 'small',
+                            'disabled': isEmptyValue(localGroupValue.value),
+                            'ev-click': reset,
+                            'children': '重置'
+                          }), _$cc(Button, {
+                            'type': 'primary',
+                            'size': 'small',
+                            'ev-click': function evClick() {
+                              return confirm(onChange);
+                            },
+                            'children': '确定'
+                          })], 4, 'k-table-group-footer') : undefined]
                         })]
-                      }, 'dropdown') : undefined, sortable ? _$ce(2, 'div', [_$cc(Icon, _$tmp2), _$cc(Icon, _$tmp3)], 4, _$cn((_$cn3 = {
+                      }, 'dropdown', dropdownRef) : undefined, sortable ? _$ce(2, 'div', [_$cc(Icon, _$tmp1), _$cc(Icon, _$tmp2)], 4, _$cn((_$cn3 = {
                         'k-column-sort': true
                       }, _$cn3["k-" + type] = type, _$cn3))) : undefined], 0, 'k-table-title')], 0, _$cn(classNameObj), {
                         'style': style,
-                        'title': isStringOrNumber(title) ? title + (groupText || '') : null,
+                        'title': isStringOrNumber(title) ? title : null,
                         'ev-click': sortable ? linkEvent(key, onChangeSort) : null,
                         'colspan': cols,
                         'rowspan': rows