@king-design/vue 3.1.4 → 3.1.6

package/components/cascader/index.spec.js

@@ -160,7 +160,7 @@ describe('Cascader', function () {
     }, _callee5);
   })));
   it('filter', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
-    var _mount5, instance, element, input, dropdown, dropdown1;
+    var _mount5, instance, element, input, dropdown, dropdown1, _getElements2, _dropdown1, _dropdown2, _dropdown3;
     return _regeneratorRuntime.wrap(function _callee6$(_context6) {
       while (1) switch (_context6.prev = _context6.next) {
         case 0:
@@ -207,7 +207,16 @@ describe('Cascader', function () {
           return wait();
         case 34:
           expect(instance.get('value')).to.eql(['hunan', 'yueyang', 'yueyanglou']);
-        case 35:
+          // show again to test the position
+          input.click();
+          _context6.next = 38;
+          return wait();
+        case 38:
+          _getElements2 = getElements('.k-cascader-menu'), _dropdown1 = _getElements2[0], _dropdown2 = _getElements2[1], _dropdown3 = _getElements2[2];
+          expect(_dropdown1.style.top).not.eql('0px');
+          expect(_dropdown2.style.top).not.eql('0px');
+          expect(_dropdown3.style.top).not.eql('0px');
+        case 42:
         case "end":
           return _context6.stop();
       }
@@ -234,7 +243,7 @@ describe('Cascader', function () {
     }, _callee7);
   })));
   it('duplicated sub data', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee8() {
-    var Demo, _mount7, instance, element, _getElements2, dropdown1, dropdown2, _dropdown1$querySelec4, item1, item2, _dropdown2$querySelec3, item21, dropdown3, _dropdown3$querySelec2, item31;
+    var Demo, _mount7, instance, element, _getElements3, dropdown1, dropdown2, _dropdown1$querySelec4, item1, item2, _dropdown2$querySelec3, item21, dropdown3, _dropdown3$querySelec2, item31;
     return _regeneratorRuntime.wrap(function _callee8$(_context9) {
       while (1) switch (_context9.prev = _context9.next) {
         case 0:
@@ -278,7 +287,7 @@ describe('Cascader', function () {
           _context9.next = 6;
           return wait();
         case 6:
-          _getElements2 = getElements('.k-cascader-menu'), dropdown1 = _getElements2[0], dropdown2 = _getElements2[1];
+          _getElements3 = getElements('.k-cascader-menu'), dropdown1 = _getElements3[0], dropdown2 = _getElements3[1];
           _dropdown1$querySelec4 = dropdown1.querySelectorAll(':scope > .k-dropdown-item'), item1 = _dropdown1$querySelec4[0], item2 = _dropdown1$querySelec4[1];
           expect(item1.classList.contains('k-selected')).to.be.true;
           expect(item2.classList.contains('k-selected')).to.be.false;
@@ -370,4 +379,58 @@ describe('Cascader', function () {
       }
     }, _callee9);
   })));
+  it('should select correct value', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee10() {
+    var Demo, _mount9, instance, element, _getElements4, dropdown1, dropdown2, _dropdown1$querySelec6, item1, item2;
+    return _regeneratorRuntime.wrap(function _callee10$(_context13) {
+      while (1) switch (_context13.prev = _context13.next) {
+        case 0:
+          Demo = /*#__PURE__*/function (_Component3) {
+            _inheritsLoose(Demo, _Component3);
+            function Demo() {
+              var _context12;
+              var _this3;
+              for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+                args[_key3] = arguments[_key3];
+              }
+              _this3 = _Component3.call.apply(_Component3, _concatInstanceProperty(_context12 = [this]).call(_context12, args)) || this;
+              _this3.Cascader = Cascader;
+              return _this3;
+            }
+            Demo.defaults = function defaults() {
+              return {
+                value: ['beijing', 'haidian'],
+                data: [{
+                  value: 'beijing',
+                  label: '北京',
+                  children: [{
+                    value: 'haidian',
+                    label: '海淀区'
+                  }]
+                }, {
+                  value: 'hunan',
+                  label: '湖南'
+                }]
+              };
+            };
+            return Demo;
+          }(Component);
+          Demo.template = "\n                const {Cascader} = this;\n                <Cascader data={this.get('data')} v-model=\"value\" />\n            ";
+          _mount9 = mount(Demo), instance = _mount9[0], element = _mount9[1];
+          dispatchEvent(element, 'click');
+          _context13.next = 6;
+          return wait();
+        case 6:
+          _getElements4 = getElements('.k-cascader-menu'), dropdown1 = _getElements4[0], dropdown2 = _getElements4[1];
+          _dropdown1$querySelec6 = dropdown1.querySelectorAll(':scope > .k-dropdown-item'), item1 = _dropdown1$querySelec6[0], item2 = _dropdown1$querySelec6[1];
+          dispatchEvent(item2, 'click');
+          _context13.next = 11;
+          return wait();
+        case 11:
+          expect(instance.get('value')).to.eql(['hunan']);
+        case 12:
+        case "end":
+          return _context13.stop();
+      }
+    }, _callee10);
+  })));
 });

package/components/cascader/useValue.js

@@ -74,7 +74,7 @@ export function useValue() {
     // maybe the showedValue has the leaf value when we set it on show menu,
     // if we select by clicking, the showedValue has not the leaf value,
     // no matter which case, we set the last value by level
-    var newValue = _sliceInstanceProperty(_context4 = showedValue.value).call(_context4, 0);
+    var newValue = _sliceInstanceProperty(_context4 = showedValue.value).call(_context4, 0, level);
     newValue[level] = value;
     setValue(newValue);
   }

package/components/datepicker/index.spec.js

@@ -801,22 +801,27 @@ describe('Datepicker', function () {
             first = calendar1.querySelectorAll('.k-calendar-item')[17];
             second = calendar2.querySelectorAll('.k-calendar-item')[17];
             first.click();
+            // should stay at date panel
+            _context21.next = 12;
+            return wait();
+          case 12:
+            expect(calendar1.querySelector('.k-days')).be.exist;
             second.click();
-            _context21.next = 13;
+            _context21.next = 16;
             return wait();
-          case 13:
+          case 16:
             dispatchEvent(calendar1.querySelector('.k-scroll-select-wrapper .k-active').nextElementSibling, 'click');
             dispatchEvent(calendar2.querySelector('.k-scroll-select-wrapper .k-active').previousElementSibling, 'click');
             content.querySelector('.k-datepicker-footer .k-btn').click();
-            _context21.next = 18;
+            _context21.next = 21;
             return wait();
-          case 18:
+          case 21:
             value2 = instance.get('time');
             expect(value2).have.lengthOf(2);
             expect(_mapInstanceProperty(value2).call(value2, function (item) {
               return item.split(' ')[1];
             })).eql(['01:00:00', '22:59:59']);
-          case 21:
+          case 24:
           case "end":
             return _context21.stop();
         }

package/components/datepicker/useValue.js

@@ -61,7 +61,15 @@ export function useValue(formats, disabled, panel) {
     }
     setValue(_value, false);
     if (type === 'datetime') {
-      panel.changePanel(PanelTypes.Time, flag);
+      if (range) {
+        // only change to time panel after selected start and end date
+        if (_value.length === 2) {
+          panel.changePanel(PanelTypes.Time, PanelFlags.Start);
+          panel.changePanel(PanelTypes.Time, PanelFlags.End);
+        }
+      } else {
+        panel.changePanel(PanelTypes.Time, flag);
+      }
     } else if (!multiple && (!range || _value.length === 2)) {
       instance.hide();
     }

package/components/dropdown/menu.js

@@ -9,6 +9,7 @@ import { useTransition } from './useTransition';
 import { useMenuKeyboard } from './useKeyboard';
 import { useMouseOutsidable } from '../../hooks/useMouseOutsidable';
 import { useConfigContext } from '../config';
+import { usePositionForDropdownMenu } from './usePosition';
 export var DROPDOWN_MENU = 'DropdownMenu';
 export var DropdownMenu = /*#__PURE__*/function (_Component) {
   _inheritsLoose(DropdownMenu, _Component);
@@ -32,6 +33,7 @@ export var DropdownMenu = /*#__PURE__*/function (_Component) {
   _proto.init = function init() {
     provide(DROPDOWN_MENU, this);
     useMouseOutsidable(this.elementRef);
+    usePositionForDropdownMenu();
   }
   // no matter what the trigger is, we should show menu when enter into it.
   ;

package/components/dropdown/usePosition.d.ts

@@ -6,3 +6,4 @@ export declare function usePosition(): {
         value: boolean;
     };
 };
+export declare function usePositionForDropdownMenu(): void;

package/components/dropdown/usePosition.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime-corejs3/helpers/extends";
-import { useInstance, findDomFromVNode } from 'intact-vue-next';
+import { useInstance, findDomFromVNode, onBeforeUnmount } from 'intact-vue-next';
 import { position } from '../position';
 import { noop, isObject, isFunction } from 'intact-shared';
 import { isEqualObject } from '../utils';
@@ -112,4 +112,15 @@ export function usePosition() {
     handle: handle,
     positioned: positioned
   };
+}
+export function usePositionForDropdownMenu() {
+  var instance = useInstance();
+  /**
+   * Meybe the DropdownMenu has changed by specified key
+   * so, we must reset the positioned.value beforeUnmount
+   * #956
+   */
+  onBeforeUnmount(function () {
+    instance.dropdown.positionHook.positioned.value = false;
+  });
 }

package/components/select/useFocusout.d.ts

@@ -1,6 +1,6 @@
 /**
  * don't trigger focusout event when layer is showing,
- * only trigger focusout when it hidden to make FormItem to validate it
+ * only trigger focusout when it is hidden to make FormItem to validate it
  * #449
  */
 export declare function useFocusout(): {

package/components/select/useFocusout.js

@@ -2,7 +2,7 @@ import _Object$assign from "@babel/runtime-corejs3/core-js/object/assign";
 import { useInstance, createRef } from 'intact-vue-next';
 /**
  * don't trigger focusout event when layer is showing,
- * only trigger focusout when it hidden to make FormItem to validate it
+ * only trigger focusout when it is hidden to make FormItem to validate it
  * #449
  */
 export function useFocusout() {

package/index.d.ts

@@ -1,5 +1,5 @@
 /*!
- * @king-design v3.1.4
+ * @king-design v3.1.6
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -60,7 +60,7 @@ export * from './components/tree';
 export * from './components/treeSelect';
 export * from './components/upload';
 export * from './components/wave';
-export declare const version = "3.1.4";
+export declare const version = "3.1.6";
 
 
 export {normalize} from 'intact-vue-next';

package/index.js

@@ -1,5 +1,5 @@
 /*!
- * @king-design v3.1.4
+ * @king-design v3.1.6
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -61,7 +61,7 @@ export * from './components/tree';
 export * from './components/treeSelect';
 export * from './components/upload';
 export * from './components/wave';
-export var version = '3.1.4';
+export var version = '3.1.6';
 /* generate end */
 
 export {normalize} from 'intact-vue-next';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@king-design/vue",
-  "version": "3.1.4",
+  "version": "3.1.6",
   "description": "King-Design UI components for Vue3.0.",
   "keywords": [
     "component",
@@ -37,7 +37,7 @@
     "@emotion/css": "^11.5.0",
     "dayjs": "^1.10.7",
     "enquire.js": "^2.1.6",
-    "intact-vue-next": "3.0.26",
+    "intact-vue-next": "3.0.29",
     "monaco-editor": "^0.26.1",
     "mxgraphx": "^4.0.7",
     "resize-observer-polyfill": "^1.5.1",