@king-design/vue 2.1.4 → 2.1.5

package/components/tree/useSelected.js

@@ -9,60 +9,77 @@ export function useSelected(getNodes) {
   instance.on('$receive:selectedKeys', function (v) {
     selectedKeys = new _Set(v);
   });
+
   function toggle(_x) {
     return _toggle.apply(this, arguments);
   }
+
   function _toggle() {
     _toggle = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(node) {
       var key, _instance$get, multiple;
+
       return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            if (!node.data.disabled) {
-              _context.next = 2;
-              break;
-            }
-            return _context.abrupt("return");
-          case 2:
-            key = node.key;
-            _instance$get = instance.get(), multiple = _instance$get.multiple;
-            if (selectedKeys.has(key)) {
-              selectedKeys.delete(key);
-            } else {
-              if (!multiple) {
-                selectedKeys.clear();
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!node.data.disabled) {
+                _context.next = 2;
+                break;
               }
-              selectedKeys.add(key);
-            }
-            instance.set('selectedKeys', _Array$from(selectedKeys));
-          case 6:
-          case "end":
-            return _context.stop();
+
+              return _context.abrupt("return");
+
+            case 2:
+              key = node.key;
+              _instance$get = instance.get(), multiple = _instance$get.multiple;
+
+              if (selectedKeys.has(key)) {
+                selectedKeys.delete(key);
+              } else {
+                if (!multiple) {
+                  selectedKeys.clear();
+                }
+
+                selectedKeys.add(key);
+              }
+
+              instance.set('selectedKeys', _Array$from(selectedKeys));
+
+            case 6:
+            case "end":
+              return _context.stop();
+          }
         }
       }, _callee);
     }));
     return _toggle.apply(this, arguments);
   }
+
   function getSelectedData() {
     var data = [];
     var size = selectedKeys.size;
     if (!size) return data;
     var count = 0;
+
     var loop = function loop(nodes) {
       for (var i = 0; i < nodes.length; i++) {
         var node = nodes[i];
+
         if (selectedKeys.has(node.key)) {
           data.push(node.data);
           if (++count === size) return;
         }
+
         if (node.children) {
           loop(node.children);
         }
       }
     };
+
     loop(getNodes());
     return data;
   }
+
   return {
     get: function get() {
       return selectedKeys;

package/components/tree/useTransitionEvent.js

@@ -1,18 +1,20 @@
 import _extends from "@babel/runtime-corejs3/helpers/extends";
 import { useInstance } from 'intact-vue-next';
-import { expandAnimationCallbacks } from '../utils';
-// for TreeSelect to refresh position
+import { expandAnimationCallbacks } from '../utils'; // for TreeSelect to refresh position
+
 export function useTransitionEvent() {
   var instance = useInstance();
   var _onAfterEnter = expandAnimationCallbacks.onAfterEnter,
-    _onAfterLeave = expandAnimationCallbacks.onAfterLeave;
+      _onAfterLeave = expandAnimationCallbacks.onAfterLeave;
   return _extends({}, expandAnimationCallbacks, {
     onAfterEnter: function onAfterEnter(el) {
       instance.trigger('transitionEnd');
+
       _onAfterEnter(el);
     },
     onAfterLeave: function onAfterLeave(el) {
       instance.trigger('transitionEnd');
+
       _onAfterLeave(el);
     }
   });

package/components/treeSelect/index.d.ts

@@ -0,0 +1,27 @@
+import { TypeDefs, Children, Key } from 'intact-vue-next';
+import { BaseSelect, BaseSelectProps, BaseSelectEvents, BaseSelectBlocks } from '../select/base';
+import { TreeProps } from '../tree';
+import type { DataItem } from '../tree/useNodes';
+export interface TreeSelectProps<K extends Key = Key, Multipe extends boolean = boolean, Checkbox extends boolean = boolean> extends BaseSelectProps<K, Multipe, Checkbox extends true ? K[] : K | null> {
+    data?: TreeProps<K>['data'];
+    uncorrelated?: boolean;
+    load?: TreeProps<K>['load'];
+    showLine?: boolean;
+    defaultExpandAll?: boolean;
+    checkbox?: Checkbox;
+    filter?: (keywords: string, data: DataItem<K>) => boolean;
+}
+export interface TreeSelectEvents extends BaseSelectEvents {
+}
+export interface TreeSelectBlocks<K> extends BaseSelectBlocks<K> {
+}
+export declare class TreeSelect<K extends Key = Key, Checkbox extends boolean = false, Multipe extends boolean = Checkbox extends true ? true : false> extends BaseSelect<TreeSelectProps<K, Multipe, Checkbox>, TreeSelectEvents, TreeSelectBlocks<K>> {
+    static template: string | import("intact").Template<any>;
+    static typeDefs: Required<TypeDefs<TreeSelectProps<Key, boolean, boolean>>>;
+    static defaults: () => Partial<TreeSelectProps<Key, boolean, boolean>>;
+    private value;
+    init(): void;
+    protected getPlaceholder(): string | number | boolean | import("misstime/dist/utils/types").VNode<any> | Children[];
+    protected getLabel(): Children;
+    private filter;
+}

package/components/treeSelect/index.js

@@ -13,6 +13,7 @@ import { isNullOrUndefined, isStringOrNumber } from 'intact-shared';
 import { useReceive } from '../../hooks/useReceive';
 import { useValue } from './useValue';
 import { bind } from '../utils';
+
 var typeDefs = _extends({}, BaseSelect.typeDefs, {
   data: Array,
   filter: Function,
@@ -22,30 +23,40 @@ var typeDefs = _extends({}, BaseSelect.typeDefs, {
   defaultExpandAll: Boolean,
   checkbox: Boolean
 });
+
 var defaults = function defaults() {
   return _extends({}, BaseSelect.defaults(), {
     defaultExpandAll: true,
     showLine: true
   });
 };
+
 export var TreeSelect = /*#__PURE__*/function (_BaseSelect) {
   _inheritsLoose(TreeSelect, _BaseSelect);
+
   function TreeSelect() {
     var _context;
+
     var _this;
+
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
+
     _this = _BaseSelect.call.apply(_BaseSelect, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
     _this.value = useValue();
     return _this;
   }
+
   var _proto = TreeSelect.prototype;
+
   _proto.init = function init() {
     var _this2 = this;
+
     _BaseSelect.prototype.init.call(this);
-    useEqualWidth();
-    // if we get checkbox is true, set mutiple to true forcely
+
+    useEqualWidth(); // if we get checkbox is true, set mutiple to true forcely
+
     useReceive(['checkbox', 'multiple'], function () {
       if (_this2.get('checkbox')) {
         _this2.set('multiple', true, {
@@ -54,19 +65,24 @@ export var TreeSelect = /*#__PURE__*/function (_BaseSelect) {
       }
     });
   };
+
   _proto.getPlaceholder = function getPlaceholder() {
     var _this$get = this.get(),
-      placeholder = _this$get.placeholder;
+        placeholder = _this$get.placeholder;
+
     return isNullOrUndefined(placeholder) ? _$('请选择') : placeholder;
   };
+
   _proto.getLabel = function getLabel() {
     var _this$get2 = this.get(),
-      data = _this$get2.data,
-      value = _this$get2.value,
-      multiple = _this$get2.multiple;
+        data = _this$get2.data,
+        value = _this$get2.value,
+        multiple = _this$get2.multiple;
+
     if (isNullOrUndefined(data) || isNullOrUndefined(value)) return;
     var label;
     var counts = 0;
+
     var loop = function loop(children) {
       return _findInstanceProperty(children).call(children, function (item) {
         if (!multiple) {
@@ -76,37 +92,48 @@ export var TreeSelect = /*#__PURE__*/function (_BaseSelect) {
           }
         } else {
           var index = value.indexOf(item.key);
+
           if (index > -1) {
-            if (!label) label = [];
-            // keep the order
+            if (!label) label = []; // keep the order
+
             label[index] = item.label;
+
             if (++counts === value.length) {
               return true;
             }
           }
         }
+
         if (item.children) {
           return loop(item.children);
         }
+
         return false;
       });
     };
+
     loop(data);
     return label;
   };
+
   _proto.filter = function filter(data) {
     var _context2, _context3;
+
     var keywords = this.input.keywords.value;
     if (!keywords) return true;
+
     var _this$get3 = this.get(),
-      filter = _filterInstanceProperty(_this$get3);
+        filter = _filterInstanceProperty(_this$get3);
+
     if (filter) return filter(keywords, data);
     keywords = keywords.toLowerCase();
     return isStringOrNumber(data.label) && _includesInstanceProperty(_context2 = String(data.label).toLowerCase()).call(_context2, keywords) || _includesInstanceProperty(_context3 = String(data.key).toLowerCase()).call(_context3, keywords);
   };
+
   return TreeSelect;
 }(BaseSelect);
 TreeSelect.template = template;
 TreeSelect.typeDefs = typeDefs;
 TreeSelect.defaults = defaults;
+
 __decorate([bind], TreeSelect.prototype, "filter", null);

package/components/treeSelect/index.spec.js

@@ -16,155 +16,192 @@ describe('TreeSelect', function () {
   });
   it('should select value correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _mount, instance, element, dropdown;
+
     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.click();
-          _context.next = 4;
-          return wait();
-        case 4:
-          dropdown = getElement('.k-tree-select-menu');
-          expect(dropdown.innerHTML).to.matchSnapshot();
-          dropdown.querySelector('.k-tree-text').click();
-          expect(instance.get('value')).to.eql('1');
-          _context.next = 10;
-          return wait(500);
-        case 10:
-          expect(getElement('.k-tree-select-menu')).to.be.undefined;
-        case 11:
-        case "end":
-          return _context.stop();
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
+            element.click();
+            _context.next = 4;
+            return wait();
+
+          case 4:
+            dropdown = getElement('.k-tree-select-menu');
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            dropdown.querySelector('.k-tree-text').click();
+            expect(instance.get('value')).to.eql('1');
+            _context.next = 10;
+            return wait(500);
+
+          case 10:
+            expect(getElement('.k-tree-select-menu')).to.be.undefined;
+
+          case 11:
+          case "end":
+            return _context.stop();
+        }
       }
     }, _callee);
   })));
   it('multiple', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var _mount2, instance, element, dropdown, _dropdown$querySelect, node1, node2;
+
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) switch (_context2.prev = _context2.next) {
-        case 0:
-          _mount2 = mount(MultipleDemo), instance = _mount2[0], element = _mount2[1];
-          element.click();
-          _context2.next = 4;
-          return wait();
-        case 4:
-          dropdown = getElement('.k-tree-select-menu');
-          _dropdown$querySelect = dropdown.querySelectorAll('.k-tree-text'), node1 = _dropdown$querySelect[0], node2 = _dropdown$querySelect[1];
-          node1.click();
-          node2.click();
-          expect(instance.get('values')).to.eql(['1', '1.1']);
-          node1.click();
-          expect(instance.get('values')).to.eql(['1.1']);
-          instance.set('values', ['1']);
-          _context2.next = 14;
-          return wait(500);
-        case 14:
-          expect(dropdown.innerHTML).to.matchSnapshot();
-          expect(element.innerHTML).to.matchSnapshot();
-        case 16:
-        case "end":
-          return _context2.stop();
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            _mount2 = mount(MultipleDemo), instance = _mount2[0], element = _mount2[1];
+            element.click();
+            _context2.next = 4;
+            return wait();
+
+          case 4:
+            dropdown = getElement('.k-tree-select-menu');
+            _dropdown$querySelect = dropdown.querySelectorAll('.k-tree-text'), node1 = _dropdown$querySelect[0], node2 = _dropdown$querySelect[1];
+            node1.click();
+            node2.click();
+            expect(instance.get('values')).to.eql(['1', '1.1']);
+            node1.click();
+            expect(instance.get('values')).to.eql(['1.1']);
+            instance.set('values', ['1']);
+            _context2.next = 14;
+            return wait(500);
+
+          case 14:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            expect(element.innerHTML).to.matchSnapshot();
+
+          case 16:
+          case "end":
+            return _context2.stop();
+        }
       }
     }, _callee2);
   })));
   it('checkbox', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
     var _mount3, instance, element, dropdown, texts, text211, text212;
+
     return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-      while (1) switch (_context3.prev = _context3.next) {
-        case 0:
-          _mount3 = mount(CheckboxDemo), instance = _mount3[0], element = _mount3[1];
-          element.click();
-          _context3.next = 4;
-          return wait();
-        case 4:
-          dropdown = getElement('.k-tree-select-menu');
-          texts = dropdown.querySelectorAll('.k-tree-text');
-          text211 = texts[5];
-          text212 = texts[6];
-          text211.click();
-          expect(instance.get('values')).to.eql(['2.1.1']);
-          text212.click();
-          expect(instance.get('values')).to.eql(['2']);
-          instance.set('values', []);
-          _context3.next = 15;
-          return wait();
-        case 15:
-          expect(dropdown.innerHTML).to.matchSnapshot();
-          expect(element.innerHTML).to.matchSnapshot();
-        case 17:
-        case "end":
-          return _context3.stop();
+      while (1) {
+        switch (_context3.prev = _context3.next) {
+          case 0:
+            _mount3 = mount(CheckboxDemo), instance = _mount3[0], element = _mount3[1];
+            element.click();
+            _context3.next = 4;
+            return wait();
+
+          case 4:
+            dropdown = getElement('.k-tree-select-menu');
+            texts = dropdown.querySelectorAll('.k-tree-text');
+            text211 = texts[5];
+            text212 = texts[6];
+            text211.click();
+            expect(instance.get('values')).to.eql(['2.1.1']);
+            text212.click();
+            expect(instance.get('values')).to.eql(['2']);
+            instance.set('values', []);
+            _context3.next = 15;
+            return wait();
+
+          case 15:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            expect(element.innerHTML).to.matchSnapshot();
+
+          case 17:
+          case "end":
+            return _context3.stop();
+        }
       }
     }, _callee3);
   })));
   it('filterable', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
     var _mount4, instance, element, dropdown, input, _dropdown$querySelect2, text2;
+
     return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-      while (1) switch (_context4.prev = _context4.next) {
-        case 0:
-          _mount4 = mount(FilterDemo), instance = _mount4[0], element = _mount4[1];
-          element.click();
-          _context4.next = 4;
-          return wait();
-        case 4:
-          dropdown = getElement('.k-tree-select-menu');
-          input = element.querySelector('.k-input-inner');
-          input.value = 'first';
-          dispatchEvent(input, 'input');
-          _context4.next = 10;
-          return wait(500);
-        case 10:
-          expect(dropdown.innerHTML).to.matchSnapshot();
-          _dropdown$querySelect2 = dropdown.querySelectorAll('.k-tree-text'), text2 = _dropdown$querySelect2[1];
-          text2.click();
-          expect(instance.get('value')).to.eql('2');
-        case 14:
-        case "end":
-          return _context4.stop();
+      while (1) {
+        switch (_context4.prev = _context4.next) {
+          case 0:
+            _mount4 = mount(FilterDemo), instance = _mount4[0], element = _mount4[1];
+            element.click();
+            _context4.next = 4;
+            return wait();
+
+          case 4:
+            dropdown = getElement('.k-tree-select-menu');
+            input = element.querySelector('.k-input-inner');
+            input.value = 'first';
+            dispatchEvent(input, 'input');
+            _context4.next = 10;
+            return wait(500);
+
+          case 10:
+            expect(dropdown.innerHTML).to.matchSnapshot();
+            _dropdown$querySelect2 = dropdown.querySelectorAll('.k-tree-text'), text2 = _dropdown$querySelect2[1];
+            text2.click();
+            expect(instance.get('value')).to.eql('2');
+
+          case 14:
+          case "end":
+            return _context4.stop();
+        }
       }
     }, _callee4);
   })));
   it('should not validate when click arrow of Tree', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
     var Demo, _mount5, instance, element, select;
+
     return _regeneratorRuntime.wrap(function _callee5$(_context6) {
-      while (1) switch (_context6.prev = _context6.next) {
-        case 0:
-          Demo = /*#__PURE__*/function (_Component) {
-            _inheritsLoose(Demo, _Component);
-            function Demo() {
-              var _context5;
-              var _this;
-              for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-                args[_key] = arguments[_key];
+      while (1) {
+        switch (_context6.prev = _context6.next) {
+          case 0:
+            Demo = /*#__PURE__*/function (_Component) {
+              _inheritsLoose(Demo, _Component);
+
+              function Demo() {
+                var _context5;
+
+                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(_context5 = [this]).call(_context5, args)) || this;
+                _this.Form = Form;
+                _this.FormItem = FormItem;
+                _this.TreeSelect = TreeSelect;
+                return _this;
               }
-              _this = _Component.call.apply(_Component, _concatInstanceProperty(_context5 = [this]).call(_context5, args)) || this;
-              _this.Form = Form;
-              _this.FormItem = FormItem;
-              _this.TreeSelect = TreeSelect;
-              return _this;
-            }
-            return Demo;
-          }(Component);
-          Demo.template = "\n                const {Form, FormItem, TreeSelect} = this;\n                <Form>\n                    <FormItem rules={{required: true}} value={this.get('value')}>\n                        <TreeSelect data={[{label: 'test', key: 'test'}]} v-model=\"value\" />\n                    </FormItem>\n                </Form>\n            ";
-          _mount5 = mount(Demo), instance = _mount5[0], element = _mount5[1];
-          select = element.querySelector('.k-select');
-          dispatchEvent(select, 'click');
-          _context6.next = 7;
-          return wait();
-        case 7:
-          dispatchEvent(select, 'focusout');
-          _context6.next = 10;
-          return wait(500);
-        case 10:
-          expect(element.querySelector('.k-form-error')).to.be.null;
-          dispatchEvent(select, 'click');
-          _context6.next = 14;
-          return wait(500);
-        case 14:
-          expect(element.querySelector('.k-form-error')).not.to.be.null;
-        case 15:
-        case "end":
-          return _context6.stop();
+
+              return Demo;
+            }(Component);
+
+            Demo.template = "\n                const {Form, FormItem, TreeSelect} = this;\n                <Form>\n                    <FormItem rules={{required: true}} value={this.get('value')}>\n                        <TreeSelect data={[{label: 'test', key: 'test'}]} v-model=\"value\" />\n                    </FormItem>\n                </Form>\n            ";
+            _mount5 = mount(Demo), instance = _mount5[0], element = _mount5[1];
+            select = element.querySelector('.k-select');
+            dispatchEvent(select, 'click');
+            _context6.next = 7;
+            return wait();
+
+          case 7:
+            dispatchEvent(select, 'focusout');
+            _context6.next = 10;
+            return wait(500);
+
+          case 10:
+            expect(element.querySelector('.k-form-error')).to.be.null;
+            dispatchEvent(select, 'click');
+            _context6.next = 14;
+            return wait(500);
+
+          case 14:
+            expect(element.querySelector('.k-form-error')).not.to.be.null;
+
+          case 15:
+          case "end":
+            return _context6.stop();
+        }
       }
     }, _callee5);
   })));

package/components/treeSelect/index.vdt.js

@@ -7,26 +7,30 @@ export default function ($props, $blocks, $__proto__) {
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
+
   var _this$get = this.get(),
-    data = _this$get.data,
-    uncorrelated = _this$get.uncorrelated,
-    load = _this$get.load,
-    showLine = _this$get.showLine,
-    defaultExpandAll = _this$get.defaultExpandAll,
-    checkbox = _this$get.checkbox,
-    multiple = _this$get.multiple,
-    filterable = _this$get.filterable;
+      data = _this$get.data,
+      uncorrelated = _this$get.uncorrelated,
+      load = _this$get.load,
+      showLine = _this$get.showLine,
+      defaultExpandAll = _this$get.defaultExpandAll,
+      checkbox = _this$get.checkbox,
+      multiple = _this$get.multiple,
+      filterable = _this$get.filterable;
+
   var _this$value = this.value,
-    selectedKeys = _this$value.selectedKeys,
-    checkedKeys = _this$value.checkedKeys,
-    treeRef = _this$value.treeRef,
-    onChangeCheckedKeys = _this$value.onChangeCheckedKeys,
-    onChangeSelectedKeys = _this$value.onChangeSelectedKeys;
+      selectedKeys = _this$value.selectedKeys,
+      checkedKeys = _this$value.checkedKeys,
+      treeRef = _this$value.treeRef,
+      onChangeCheckedKeys = _this$value.onChangeCheckedKeys,
+      onChangeSelectedKeys = _this$value.onChangeSelectedKeys;
   return _$su.call($this, null, function ($blocks) {
     var _$blocks = {},
-      __$blocks = _$ex({}, $blocks);
+        __$blocks = _$ex({}, $blocks);
+
     return (_$blocks['base-menu'] = function ($super) {
       var _$cn2;
+
       return _$cc(DropdownMenu, {
         'className': _$cn((_$cn2 = {
           'k-tree-select-menu': true
@@ -50,9 +54,11 @@ export default function ($props, $blocks, $__proto__) {
       });
     }, __$blocks['base-menu'] = function ($super, data) {
       var block = $blocks['base-menu'];
+
       var callBlock = function callBlock() {
         return _$blocks['base-menu'].call($this, $super, data);
       };
+
       return block ? block.call($this, callBlock, data) : callBlock();
     }), __$blocks;
   }.call($this, $blocks), $__proto__);

package/components/treeSelect/styles.js

@@ -6,6 +6,7 @@ var defaults = {
   get transition() {
     return theme.transition.middle;
   },
+
   maxHeight: "400px",
   padding: "3px 6px"
 };