@king-design/vue 2.1.4 → 2.1.5

package/components/tooltip/styles.d.ts

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

package/components/tooltip/styles.js

@@ -6,9 +6,11 @@ import { deepDefaults } from '../../styles/utils';
 import '../../styles/global';
 var defaults = {
   padding: '8px 12px',
+
   get color() {
     return theme.color.text;
   },
+
   bgColor: '#fff',
   lineHeight: 1.4,
   maxWidth: '300px',
@@ -26,10 +28,13 @@ var defaults = {
     get bgColor() {
       return theme.color.text;
     },
+
     color: '#fff',
+
     get arrowBorderColor() {
       return theme.color.text;
     }
+
   },
   smallPadding: '4px'
 };
@@ -48,13 +53,15 @@ var directionMap = {
 };
 export default function makeStyles() {
   var arrowLong = tooltip.arrow.width;
-  var arrowShort = "calc(" + arrowLong + " - 2px)";
-  // use &.k-tooltip-content to override css in dropdown menu
+  var arrowShort = "calc(" + arrowLong + " - 2px)"; // 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;&.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;
@@ -64,6 +71,7 @@ export default function makeStyles() {
       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,6 +3,7 @@ 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,
@@ -14,6 +15,7 @@ var typeDefs = _extends({}, Dropdown.typeDefs, {
   size: ['small', 'default'],
   content: null
 });
+
 var defaults = function defaults() {
   return _extends({}, Dropdown.defaults(), {
     showArrow: true,
@@ -32,34 +34,45 @@ 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,38 +9,41 @@ 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 type TransferDataItem<A extends string = 'key', B extends string = 'label'> = {
+export declare type TransferDataItem<A extends string = 'key', B extends string = 'label'> = {
     [K in A]: Key;
 } & {
     [K in B]?: Children;

package/components/transfer/index.js

@@ -24,6 +24,7 @@ var typeDefs = {
   enableAdd: Function,
   enableRemove: Function
 };
+
 var defaults = function defaults() {
   return {
     data: [],
@@ -37,37 +38,48 @@ 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);
     _this.check = useCheck(_filterInstanceProperty(_this));
     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,102 +9,122 @@ 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();
@@ -116,90 +136,105 @@ 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);
   })));