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

package/components/tooltip/styles.d.ts

@@ -21,7 +21,7 @@ declare const defaults: {
     smallPadding: string;
 };
 export declare let tooltip: typeof defaults;
-export declare type Theme = 'dark' | 'light';
+export type Theme = 'dark' | 'light';
 export declare const themes: Theme[];
 export declare const makeStyles: {
     (k: string): string;

package/components/tooltip/styles.js

@@ -7,19 +7,15 @@ import '../../styles/global';
 import { cache } from '../utils';
 var defaults = {
   padding: '8px 12px',
-
   get color() {
     return theme.color.text;
   },
-
   bgColor: '#fff',
   lineHeight: 1.4,
   maxWidth: '312px',
-
   get boxShadow() {
     return theme.middleBoxShadow;
   },
-
   // arrow
   arrow: {
     borderColor: 'rgba(221, 221, 221, .5)',
@@ -34,13 +30,10 @@ var defaults = {
     get bgColor() {
       return theme.color.title;
     },
-
     color: '#fff',
-
     get arrowBorderColor() {
       return theme.color.title;
     }
-
   },
   smallPadding: '4px'
 };
@@ -49,7 +42,7 @@ setDefault(function () {
   tooltip = deepDefaults(theme, {
     tooltip: defaults
   }).tooltip;
-  makeStyles == null ? void 0 : makeStyles.clearCache();
+  makeStyles == null || makeStyles.clearCache();
 });
 export var themes = ['dark', 'light'];
 var directionMap = {
@@ -60,15 +53,13 @@ var directionMap = {
 };
 export var makeStyles = cache(function makeStyles(k) {
   var arrowLong = tooltip.arrow.width;
-  var arrowShort = "calc(" + arrowLong + " - 1px)"; // use &.${k}-tooltip-content to override css in dropdown menu
-
+  var arrowShort = "calc(" + arrowLong + " - 1px)";
+  // use &.${k}-tooltip-content to override css in dropdown menu
   return /*#__PURE__*/css("&.", k, "-tooltip-content{max-width:", tooltip.maxWidth, ";min-width:0;padding:", tooltip.padding, ";line-height:", tooltip.lineHeight, ";word-wrap:break-word;pointer-events:none;box-shadow:", tooltip.boxShadow, ";&.", k, "-hoverable,&.", k, "-always{pointer-events:all;}.", k, "-tooltip-arrow{pointer-events:none;&:before,&{position:absolute;display:block;border-style:solid;border-color:transparent;}&:before{content:' ';}&.", k, "-top,&.", k, "-bottom{&:before,&{border-width:", arrowLong, " ", arrowShort, ";}&:before{left:calc(-1 * ", arrowShort, ");}}&.", k, "-top{top:calc(-2 * ", arrowLong, ");&:before{top:calc(-", arrowLong, " + 1px);}}&.", k, "-bottom{bottom:calc(-2 * ", arrowLong, ");&:before{bottom:calc(-", arrowLong, " + 1px);}}&.", k, "-left,&.", k, "-right{&:before,&{border-width:", arrowShort, " ", arrowLong, ";}&:before{top:calc(-1 * ", arrowShort, ");}}&.", k, "-left{left:calc(-2 * ", arrowLong, ");&:before{left:calc(-", arrowLong, " + 1px);}}&.", k, "-right{right:calc(-2 * ", arrowLong, ");&:before{right:calc(-", arrowLong, " + 1px);}}}", _mapInstanceProperty(themes).call(themes, function (theme) {
     var _context;
-
     var borderColor;
     var bgColor;
     var color;
-
     if (theme === 'dark') {
       borderColor = tooltip.dark.arrowBorderColor;
       bgColor = tooltip.dark.bgColor;
@@ -78,7 +69,6 @@ export var makeStyles = cache(function makeStyles(k) {
       bgColor = tooltip.bgColor;
       color = tooltip.color;
     }
-
     return /*#__PURE__*/css("&.", k, "-", theme, "{background:", bgColor, ";color:", color, ";.", k, "-tooltip-arrow{", _mapInstanceProperty(_context = _Object$keys(directionMap)).call(_context, function (direction) {
       var borderDirection = directionMap[direction];
       return /*#__PURE__*/css("&.", k, "-", direction, "{border-", borderDirection, "-color:", borderColor, ";&:before{border-", borderDirection, "-color:", bgColor, ";}}");

package/components/tooltip/tooltip.js

@@ -3,7 +3,6 @@ import _extends from "@babel/runtime-corejs3/helpers/extends";
 import { Dropdown } from '../dropdown/dropdown';
 import { _$ } from '../../i18n';
 import { themes } from './styles';
-
 var typeDefs = _extends({}, Dropdown.typeDefs, {
   showArrow: Boolean,
   theme: themes,
@@ -15,7 +14,6 @@ var typeDefs = _extends({}, Dropdown.typeDefs, {
   size: ['small', 'default'],
   content: null
 });
-
 var defaults = function defaults() {
   return _extends({}, Dropdown.defaults(), {
     showArrow: true,
@@ -34,45 +32,34 @@ var defaults = function defaults() {
     size: 'default'
   });
 };
-
 var events = _extends({}, Dropdown.events, {
   ok: true,
   cancel: true
 });
-
 export var Tooltip = /*#__PURE__*/function (_Dropdown) {
   _inheritsLoose(Tooltip, _Dropdown);
-
   function Tooltip() {
     return _Dropdown.apply(this, arguments) || this;
   }
-
   var _proto = Tooltip.prototype;
-
   _proto.show = function show(shouldFocus) {
     if (shouldFocus === void 0) {
       shouldFocus = false;
     }
-
     if (this.get('disabled')) return;
     clearTimeout(this.timer);
     this.set('value', true);
   };
-
   _proto.hide = function hide(immediately) {
     if (this.get('always')) return;
-
     if (this.get('hoverable')) {
       return _Dropdown.prototype.hide.call(this, immediately);
-    } // tooltip can show any number sub-tooltips, we should not close the showed tooltip
+    }
+    // tooltip can show any number sub-tooltips, we should not close the showed tooltip
     // #885
-
-
     this.showedDropdown = null;
-
     _Dropdown.prototype.hide.call(this, true);
   };
-
   return Tooltip;
 }(Dropdown);
 Tooltip.typeDefs = typeDefs;

package/components/tooltip/useArrow.js

@@ -9,41 +9,38 @@ export function useArrow() {
   onBeforeUnmount(function () {
     instance.dropdown.off('positioned', updateArrow);
   });
-
   function updateArrow(feedback) {
     if (!instance.dropdown.get('showArrow')) return;
-    arrowType.set(feedback[feedback.important]); // we must calcuate style after set arrow type and view has updated
-
+    arrowType.set(feedback[feedback.important]);
+    // we must calcuate style after set arrow type and view has updated
     nextTick(function () {
       if (instance.$unmounted) return;
       var arrow = arrowRef.value;
       var target = feedback.target,
-          element = feedback.element;
-
+        element = feedback.element;
       if (feedback.important === 'vertical') {
         var arrowWidth = arrow.offsetWidth;
-        var left; // if (feedback.horizontal === 'center') {
+        var left;
+        // if (feedback.horizontal === 'center') {
         // left = (element.width - arrowWidth) / 2;
         // } else {
-
-        left = target.left - element.left + (target.width - arrowWidth) / 2; // }
-
+        left = target.left - element.left + (target.width - arrowWidth) / 2;
+        // }
         left = clamp(left, 1, element.width - 1 - arrowWidth);
         arrow.setAttribute('style', "left: " + left + "px");
       } else {
         var arrowHeight = arrow.offsetHeight;
-        var top; // if (feedback.vertical === 'center') {
+        var top;
+        // if (feedback.vertical === 'center') {
         // top = (element.height - arrowHeight) / 2;
         // } else {
-
-        top = target.top - element.top + target.height / 2 - arrowHeight / 2; // }
-
+        top = target.top - element.top + target.height / 2 - arrowHeight / 2;
+        // }
         top = clamp(top, 1, element.height - 1 - arrowHeight);
         arrow.setAttribute('style', "top: " + top + "px");
       }
     });
   }
-
   return {
     arrowType: arrowType,
     arrowRef: arrowRef

package/components/transfer/index.d.ts

@@ -18,7 +18,7 @@ export interface TransferProps<K extends string = 'key', L extends string = 'lab
     enableAdd?: () => boolean;
     enableRemove?: () => boolean;
 }
-export declare type TransferDataItem<A extends string = 'key', B extends string = 'label'> = {
+export type TransferDataItem<A extends string = 'key', B extends string = 'label'> = {
     [K in A]: Key;
 } & {
     [K in B]?: Children;

package/components/transfer/index.js

@@ -25,7 +25,6 @@ var typeDefs = {
   enableAdd: Function,
   enableRemove: Function
 };
-
 var defaults = function defaults() {
   return {
     data: [],
@@ -39,23 +38,18 @@ var defaults = function defaults() {
     rightTitle: _$('已选择')
   };
 };
-
 var events = {
   add: true,
   remove: true
 };
 export var Transfer = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Transfer, _Component);
-
   function Transfer() {
     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.transfer = useTransfer();
     _this.filter = useFilter(_this.transfer.rightData);
@@ -63,25 +57,19 @@ export var Transfer = /*#__PURE__*/function (_Component) {
     _this.config = useConfigContext();
     return _this;
   }
-
   var _proto = Transfer.prototype;
-
   _proto.getData = function getData() {
     return this.transfer.rightData.value;
   };
-
   _proto.getCheckedData = function getCheckedData(model) {
     var data = _filterInstanceProperty(this).getFilterData(model);
-
     var _this$get = this.get(),
-        keyName = _this$get.keyName;
-
+      keyName = _this$get.keyName;
     var checkedKeys = this.get(model + "CheckedKeys");
     return _filterInstanceProperty(data).call(data, function (item) {
       return ~checkedKeys.indexOf(item[keyName]);
     });
   };
-
   return Transfer;
 }(Component);
 Transfer.template = template;

package/components/transfer/index.spec.js

@@ -9,122 +9,102 @@ describe('Transfer', function () {
   });
   it('should only fix leftChecked when data changed', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var _mount, instance, element, transfer, checkAll, data;
-
     return _regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
-            transfer = instance.refs.__test;
-            checkAll = element.querySelector('.k-checkbox');
-            checkAll.click();
-            _context.next = 6;
-            return wait();
-
-          case 6:
-            data = [{
-              label: '1',
-              key: 'a1'
-            }, {
-              label: '2',
-              key: 'a2'
-            }];
-            instance.set('data', data);
-            _context.next = 10;
-            return wait();
-
-          case 10:
-            expect(transfer.check.isCheckAll('left')).to.be.false;
-            expect(transfer.get('leftCheckedKeys')).to.eql([]);
-            expect(transfer.get('rightCheckedKeys')).to.eql([]);
-            expect(instance.get('value').length).to.eql(2); // keep the checked item when the key in the new data
-
-            checkAll.click();
-            _context.next = 17;
-            return wait();
-
-          case 17:
-            data = [{
-              label: '1',
-              key: 'a1'
-            }, {
-              label: '3',
-              key: 'a3'
-            }];
-            instance.set('data', data);
-            _context.next = 21;
-            return wait();
-
-          case 21:
-            expect(transfer.get('leftCheckedKeys')).to.eql(['a1']);
-            instance.set('data', []);
-            _context.next = 25;
-            return wait();
-
-          case 25:
-            expect(transfer.get('leftCheckedKeys')).to.eql([]);
-
-          case 26:
-          case "end":
-            return _context.stop();
-        }
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
+          transfer = instance.refs.__test;
+          checkAll = element.querySelector('.k-checkbox');
+          checkAll.click();
+          _context.next = 6;
+          return wait();
+        case 6:
+          data = [{
+            label: '1',
+            key: 'a1'
+          }, {
+            label: '2',
+            key: 'a2'
+          }];
+          instance.set('data', data);
+          _context.next = 10;
+          return wait();
+        case 10:
+          expect(transfer.check.isCheckAll('left')).to.be.false;
+          expect(transfer.get('leftCheckedKeys')).to.eql([]);
+          expect(transfer.get('rightCheckedKeys')).to.eql([]);
+          expect(instance.get('value').length).to.eql(2);
+          // keep the checked item when the key in the new data
+          checkAll.click();
+          _context.next = 17;
+          return wait();
+        case 17:
+          data = [{
+            label: '1',
+            key: 'a1'
+          }, {
+            label: '3',
+            key: 'a3'
+          }];
+          instance.set('data', data);
+          _context.next = 21;
+          return wait();
+        case 21:
+          expect(transfer.get('leftCheckedKeys')).to.eql(['a1']);
+          instance.set('data', []);
+          _context.next = 25;
+          return wait();
+        case 25:
+          expect(transfer.get('leftCheckedKeys')).to.eql([]);
+        case 26:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   })));
   it('add and remove', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
     var _mount2, instance, element, leftFirst, _element$querySelecto, remove, add, rightFirst;
-
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-      while (1) {
-        switch (_context2.prev = _context2.next) {
-          case 0:
-            _mount2 = mount(BasicDemo), instance = _mount2[0], element = _mount2[1];
-            leftFirst = element.querySelector('.k-transfer-list .k-checkbox');
-            leftFirst.click();
-            _context2.next = 5;
-            return wait();
-
-          case 5:
-            expect(element.outerHTML).to.matchSnapshot();
-            _element$querySelecto = element.querySelectorAll('.k-btn'), remove = _element$querySelecto[0], add = _element$querySelecto[1];
-            add.click();
-            _context2.next = 10;
-            return wait(500);
-
-          case 10:
-            expect(element.outerHTML).to.matchSnapshot();
-            rightFirst = element.querySelector('.k-transfer-panel:nth-child(3) .k-transfer-list .k-checkbox');
-            rightFirst.click();
-            _context2.next = 15;
-            return wait();
-
-          case 15:
-            expect(element.outerHTML).to.matchSnapshot();
-            remove.click();
-            _context2.next = 19;
-            return wait(500);
-
-          case 19:
-            expect(element.outerHTML).to.matchSnapshot();
-
-          case 20:
-          case "end":
-            return _context2.stop();
-        }
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _mount2 = mount(BasicDemo), instance = _mount2[0], element = _mount2[1];
+          leftFirst = element.querySelector('.k-transfer-list .k-checkbox');
+          leftFirst.click();
+          _context2.next = 5;
+          return wait();
+        case 5:
+          expect(element.outerHTML).to.matchSnapshot();
+          _element$querySelecto = element.querySelectorAll('.k-btn'), remove = _element$querySelecto[0], add = _element$querySelecto[1];
+          add.click();
+          _context2.next = 10;
+          return wait(500);
+        case 10:
+          expect(element.outerHTML).to.matchSnapshot();
+          rightFirst = element.querySelector('.k-transfer-panel:nth-child(3) .k-transfer-list .k-checkbox');
+          rightFirst.click();
+          _context2.next = 15;
+          return wait();
+        case 15:
+          expect(element.outerHTML).to.matchSnapshot();
+          remove.click();
+          _context2.next = 19;
+          return wait(500);
+        case 19:
+          expect(element.outerHTML).to.matchSnapshot();
+        case 20:
+        case "end":
+          return _context2.stop();
       }
     }, _callee2);
   })));
   it('checkAll and uncheckAll', function () {
     var _mount3 = mount(BasicDemo),
-        instance = _mount3[0],
-        element = _mount3[1];
-
+      instance = _mount3[0],
+      element = _mount3[1];
     var tree = instance.refs.__test;
-
     var _element$querySelecto2 = element.querySelectorAll('.k-transfer-title .k-checkbox'),
-        leftCheckAll = _element$querySelecto2[0],
-        rightCheckAll = _element$querySelecto2[1];
-
+      leftCheckAll = _element$querySelecto2[0],
+      rightCheckAll = _element$querySelecto2[1];
     leftCheckAll.click();
     expect(tree.get('leftCheckedKeys')).to.eql([2, 4]);
     rightCheckAll.click();
@@ -136,105 +116,90 @@ describe('Transfer', function () {
   });
   it('check with shift key', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
     var _mount4, instance, element, tree, data, _element$querySelecto3, first, second, last;
-
     return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-      while (1) {
-        switch (_context3.prev = _context3.next) {
-          case 0:
-            _mount4 = mount(BasicDemo), instance = _mount4[0], element = _mount4[1];
-            tree = instance.refs.__test;
-            data = instance.get('data');
-            instance.set('value', [data[1].key]);
-            _context3.next = 6;
-            return wait();
-
-          case 6:
-            _element$querySelecto3 = element.querySelectorAll('.k-transfer-list .k-transfer-item:not(.k-disabled) input'), first = _element$querySelecto3[0], second = _element$querySelecto3[1], last = _element$querySelecto3[2];
-            first.click();
-            dispatchEvent(last, 'click', {
-              shiftKey: true
-            });
-            expect(tree.get('leftCheckedKeys')).to.eql([0, 2, 4]);
-            dispatchEvent(second, 'click', {
-              shiftKey: true
-            });
-            expect(tree.get('leftCheckedKeys')).to.eql([0, 2]);
-            dispatchEvent(last, 'click', {
-              shiftKey: true
-            });
-            expect(tree.get('leftCheckedKeys')).to.eql([0, 2, 4]);
-            first.click();
-            dispatchEvent(last, 'click', {
-              shiftKey: true
-            });
-            expect(tree.get('leftCheckedKeys')).to.eql([]);
-            dispatchEvent(second, 'click', {
-              shiftKey: true
-            });
-            expect(tree.get('leftCheckedKeys')).to.eql([4]);
-            dispatchEvent(last, 'click', {
-              shiftKey: true
-            });
-            expect(tree.get('leftCheckedKeys')).to.eql([]);
-
-          case 21:
-          case "end":
-            return _context3.stop();
-        }
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          _mount4 = mount(BasicDemo), instance = _mount4[0], element = _mount4[1];
+          tree = instance.refs.__test;
+          data = instance.get('data');
+          instance.set('value', [data[1].key]);
+          _context3.next = 6;
+          return wait();
+        case 6:
+          _element$querySelecto3 = element.querySelectorAll('.k-transfer-list .k-transfer-item:not(.k-disabled) input'), first = _element$querySelecto3[0], second = _element$querySelecto3[1], last = _element$querySelecto3[2];
+          first.click();
+          dispatchEvent(last, 'click', {
+            shiftKey: true
+          });
+          expect(tree.get('leftCheckedKeys')).to.eql([0, 2, 4]);
+          dispatchEvent(second, 'click', {
+            shiftKey: true
+          });
+          expect(tree.get('leftCheckedKeys')).to.eql([0, 2]);
+          dispatchEvent(last, 'click', {
+            shiftKey: true
+          });
+          expect(tree.get('leftCheckedKeys')).to.eql([0, 2, 4]);
+          first.click();
+          dispatchEvent(last, 'click', {
+            shiftKey: true
+          });
+          expect(tree.get('leftCheckedKeys')).to.eql([]);
+          dispatchEvent(second, 'click', {
+            shiftKey: true
+          });
+          expect(tree.get('leftCheckedKeys')).to.eql([4]);
+          dispatchEvent(last, 'click', {
+            shiftKey: true
+          });
+          expect(tree.get('leftCheckedKeys')).to.eql([]);
+        case 21:
+        case "end":
+          return _context3.stop();
       }
     }, _callee3);
   })));
   it('filter', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
     var _mount5, instance, element, transfer, checkAll;
-
     return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-      while (1) {
-        switch (_context4.prev = _context4.next) {
-          case 0:
-            this.timeout(0);
-            _mount5 = mount(LabelDemo), instance = _mount5[0], element = _mount5[1];
-            transfer = instance.refs.__test;
-            transfer.set('leftKeywords', '0');
-            _context4.next = 6;
-            return wait(500);
-
-          case 6:
-            expect(element.innerHTML).to.matchSnapshot();
-            checkAll = element.querySelector('.k-transfer-title .k-checkbox');
-            checkAll.click();
-            _context4.next = 11;
-            return wait();
-
-          case 11:
-            expect(element.innerHTML).to.matchSnapshot();
-            transfer.set('leftKeywords', '');
-            _context4.next = 15;
-            return wait(500);
-
-          case 15:
-            expect(element.innerHTML).to.matchSnapshot();
-            checkAll.click();
-            _context4.next = 19;
-            return wait();
-
-          case 19:
-            expect(element.innerHTML).to.matchSnapshot();
-            transfer.set('leftKeywords', '0');
-            _context4.next = 23;
-            return wait();
-
-          case 23:
-            transfer.set('leftKeywords', '');
-            _context4.next = 26;
-            return wait(500);
-
-          case 26:
-            expect(element.innerHTML).to.matchSnapshot();
-
-          case 27:
-          case "end":
-            return _context4.stop();
-        }
+      while (1) switch (_context4.prev = _context4.next) {
+        case 0:
+          this.timeout(0);
+          _mount5 = mount(LabelDemo), instance = _mount5[0], element = _mount5[1];
+          transfer = instance.refs.__test;
+          transfer.set('leftKeywords', '0');
+          _context4.next = 6;
+          return wait(500);
+        case 6:
+          expect(element.innerHTML).to.matchSnapshot();
+          checkAll = element.querySelector('.k-transfer-title .k-checkbox');
+          checkAll.click();
+          _context4.next = 11;
+          return wait();
+        case 11:
+          expect(element.innerHTML).to.matchSnapshot();
+          transfer.set('leftKeywords', '');
+          _context4.next = 15;
+          return wait(500);
+        case 15:
+          expect(element.innerHTML).to.matchSnapshot();
+          checkAll.click();
+          _context4.next = 19;
+          return wait();
+        case 19:
+          expect(element.innerHTML).to.matchSnapshot();
+          transfer.set('leftKeywords', '0');
+          _context4.next = 23;
+          return wait();
+        case 23:
+          transfer.set('leftKeywords', '');
+          _context4.next = 26;
+          return wait(500);
+        case 26:
+          expect(element.innerHTML).to.matchSnapshot();
+        case 27:
+        case "end":
+          return _context4.stop();
       }
     }, _callee4, this);
   })));