@king-design/intact 2.1.3 → 2.1.5

package/components/cascader/index.spec.ts

@@ -135,6 +135,14 @@ describe('Cascader', () => {
         dropdown1.querySelector<HTMLElement>('.k-dropdown-item')!.click();
         await wait();
         expect(instance.get('value')).to.eql(['hunan', 'yueyang', 'yueyanglou']);
+
+        // show again to test the position
+        input.click();
+        await wait();
+        const [_dropdown1, _dropdown2, _dropdown3] = getElements('.k-cascader-menu')!;
+        expect(_dropdown1.style.top).not.eql('0px');
+        expect(_dropdown2.style.top).not.eql('0px');
+        expect(_dropdown3.style.top).not.eql('0px');
     });
 
     it('no data for init data', async () => {
@@ -261,4 +269,45 @@ describe('Cascader', () => {
         expect(element.innerHTML).to.matchSnapshot();
         expect(instance.get('value')).to.eql(['beijing', 'haidian']);
     });
+
+    it('should select correct value', async () => {
+         class Demo extends Component {
+            static template = `
+                const {Cascader} = this;
+                <Cascader data={this.get('data')} v-model="value" />
+            `;
+            static defaults() {
+                return {
+                    value: ['beijing', 'haidian'],
+                    data: [
+                        {
+                            value: 'beijing',
+                            label: '北京',
+                            children: [
+                                {
+                                    value: 'haidian',
+                                    label: '海淀区'
+                                },
+                            ]
+                        },
+                        {
+                            value: 'hunan',
+                            label: '湖南',
+                        },
+                    ]
+                }
+            }
+            private Cascader = Cascader;
+        }
+
+        const [instance, element] = mount(Demo);
+        dispatchEvent(element, 'click');
+        await wait();
+
+        const [dropdown1, dropdown2] = getElements('.k-cascader-menu');
+        const [item1, item2] = dropdown1.querySelectorAll(':scope > .k-dropdown-item');
+        dispatchEvent(item2, 'click');
+        await wait();
+        expect(instance.get('value')).to.eql(['hunan']);
+    });
 });

package/components/cascader/useValue.ts

@@ -80,7 +80,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
-        const newValue = showedValue.value.slice(0);
+        const newValue = showedValue.value.slice(0, level);
         newValue[level] = value;
         setValue(newValue);
     }

package/components/dropdown/menu.ts

@@ -6,6 +6,7 @@ import {useTransition} from './useTransition';
 import {useMenuKeyboard} from './useKeyboard';
 import {useMouseOutsidable} from '../../hooks/useMouseOutsidable';
 import {FeedbackCallback} from './usePosition';
+import { usePositionForDropdownMenu } from './usePosition';
 
 export interface DropdownMenuProps { }
 export interface DropdownMenuEvents { }
@@ -29,6 +30,7 @@ export class DropdownMenu<
     init() {
         provide(DROPDOWN_MENU, this);
         useMouseOutsidable(this.elementRef);
+        usePositionForDropdownMenu();
     }
 
     // no matter what the trigger is, we should show menu when enter into it.
@@ -78,4 +80,4 @@ function useKeyboardForDropdownMenu(dropdown: Dropdown) {
     });
 
     return {lock};
-}
+}

package/components/dropdown/usePosition.ts

@@ -1,5 +1,5 @@
-import {useInstance, findDomFromVNode} from 'intact';
-import type {Dropdown} from './';
+import {useInstance, findDomFromVNode, onBeforeUnmount} from 'intact';
+import type {Dropdown, DropdownMenu} from './';
 import {Options, position, Feedback} from '../position';
 import {noop, isObject, isFunction} from 'intact-shared';
 import { isEqualObject } from '../utils';
@@ -115,3 +115,15 @@ export function usePosition() {
 
     return {handle, positioned};
 }
+
+export function usePositionForDropdownMenu() {
+    const instance = useInstance() as DropdownMenu;
+    /**
+     * Meybe the DropdownMenu has changed by specified key
+     * so, we must reset the positioned.value beforeUnmount
+     * #956
+     */
+    onBeforeUnmount(() => {
+        instance.dropdown.positionHook.positioned.value = false;
+    });
+}

package/components/select/useFocusout.ts

@@ -3,7 +3,7 @@ import {BaseSelect} from './base';
 
 /**
  * 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/es/components/cascader/index.spec.js

@@ -193,7 +193,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) {
@@ -248,9 +248,19 @@ describe('Cascader', function () {
             return wait();
 
           case 34:
-            expect(instance.get('value')).to.eql(['hunan', 'yueyang', 'yueyanglou']);
+            expect(instance.get('value')).to.eql(['hunan', 'yueyang', 'yueyanglou']); // show again to test the position
 
-          case 35:
+            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();
         }
@@ -283,7 +293,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) {
@@ -337,7 +347,7 @@ describe('Cascader', function () {
             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;
@@ -447,4 +457,71 @@ 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/es/components/cascader/useValue.js

@@ -91,7 +91,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/es/components/dropdown/menu.js

@@ -8,6 +8,7 @@ import { DROPDOWN } from './dropdown';
 import { useTransition } from './useTransition';
 import { useMenuKeyboard } from './useKeyboard';
 import { useMouseOutsidable } from '../../hooks/useMouseOutsidable';
+import { usePositionForDropdownMenu } from './usePosition';
 export var DROPDOWN_MENU = 'DropdownMenu';
 export var DropdownMenu = /*#__PURE__*/function (_Component) {
   _inheritsLoose(DropdownMenu, _Component);
@@ -36,6 +37,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/es/components/dropdown/usePosition.d.ts

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

package/es/components/dropdown/usePosition.js

@@ -1,5 +1,5 @@
 import _extends from "@babel/runtime-corejs3/helpers/extends";
-import { useInstance, findDomFromVNode } from 'intact';
+import { useInstance, findDomFromVNode, onBeforeUnmount } from 'intact';
 import { position } from '../position';
 import { noop, isObject, isFunction } from 'intact-shared';
 import { isEqualObject } from '../utils';
@@ -122,4 +122,16 @@ 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/es/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/es/components/select/useFocusout.js

@@ -2,7 +2,7 @@ import _Object$assign from "@babel/runtime-corejs3/core-js/object/assign";
 import { useInstance, createRef } from 'intact';
 /**
  * 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
  */
 

package/es/index.d.ts

@@ -1,5 +1,5 @@
 /*!
- * @king-design v2.1.3
+ * @king-design v2.1.5
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -57,4 +57,4 @@ export * from './components/tree';
 export * from './components/treeSelect';
 export * from './components/upload';
 export * from './components/wave';
-export declare const version = "2.1.3";
+export declare const version = "2.1.5";

package/es/index.js

@@ -1,5 +1,5 @@
 /*!
- * @king-design v2.1.3
+ * @king-design v2.1.5
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -59,5 +59,5 @@ export * from './components/tree';
 export * from './components/treeSelect';
 export * from './components/upload';
 export * from './components/wave';
-export var version = '2.1.3';
+export var version = '2.1.5';
 /* generate end */

package/index.ts

@@ -1,5 +1,5 @@
 /*!
- * @king-design v2.1.3
+ * @king-design v2.1.5
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -62,6 +62,6 @@ export * from './components/treeSelect';
 export * from './components/upload';
 export * from './components/wave';
 
-export const version = '2.1.3';
+export const version = '2.1.5';
 
 /* generate end */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@king-design/intact",
-  "version": "2.1.3",
+  "version": "2.1.5",
   "description": "A component library written in Intact for Intact, Vue, React and Angular",
   "main": "es/index.js",
   "scripts": {
@@ -33,7 +33,8 @@
     "prelease-minor": "lerna version preminor --preid beta --force-publish && npm run _publish -- --tag=beta",
     "prelease-major": "lerna version premajor --preid beta --force-publish && npm run _publish -- --tag=beta",
     "upload:resources": "gulp upload:resources",
-    "update:deps": "lerna exec -- yarn --registry=https://registry.npmjs.org"
+    "update:deps": "lerna exec -- yarn --registry=https://registry.npmjs.org",
+    "proxychains4:deploy:doc": "proxychains4 npx gulp doc:build && npx gulp doc:upload && proxychains4 npx gulp doc:push"
   },
   "repository": {
     "type": "git",
@@ -117,7 +118,6 @@
     "highlight.js": "^10.4.1",
     "history": "^5.0.0",
     "html-webpack-plugin": "5.3.1",
-    "intact-react": "^3.0.26",
     "istanbul-instrumenter-loader": "^3.0.0",
     "js-yaml": "^4.1.0",
     "karma": "^6.3.2",
@@ -179,7 +179,7 @@
     "dayjs": "^1.10.7",
     "downloadjs": "^1.4.7",
     "enquire.js": "^2.1.6",
-    "intact": "^3.0.26",
+    "intact": "^3.0.28",
     "monaco-editor": "^0.26.1",
     "mxgraphx": "^4.0.7",
     "resize-observer-polyfill": "^1.5.1",