@king-design/intact 2.0.16 → 2.1.0

package/es/components/table/useDraggable.js

@@ -2,7 +2,7 @@ import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/slic
 import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/splice";
 import { useInstance, nextTick } from 'intact';
 import { useState } from '../../hooks/useState';
-export function useDraggable() {
+export function useDraggable(data) {
   var instance = useInstance();
   var draggingKey = useState(null);
   var originIndex;
@@ -13,7 +13,7 @@ export function useDraggable() {
     draggingIndex = originIndex = tableRow.get('index');
     var key = tableRow.get('key');
     draggingKey.set(key);
-    originData = instance.get('data');
+    originData = data.value;
     instance.trigger('dragstart', {
       key: key,
       from: draggingIndex
@@ -28,20 +28,23 @@ export function useDraggable() {
     var newIndex = tableRow.get('index');
     if (newIndex === draggingIndex) return; // swap data
 
-    var data = _sliceInstanceProperty(_context = instance.get('data')).call(_context);
+    var newData = _sliceInstanceProperty(_context = data.value).call(_context);
 
-    var item = _spliceInstanceProperty(data).call(data, draggingIndex, 1)[0];
+    var item = _spliceInstanceProperty(newData).call(newData, draggingIndex, 1)[0];
 
-    _spliceInstanceProperty(data).call(data, newIndex, 0, item);
+    _spliceInstanceProperty(newData).call(newData, newIndex, 0, item);
 
     draggingIndex = newIndex;
-    instance.set('data', data);
+    data.set(newData);
   }
 
   function onRowDragEnd(e, tableRow) {
-    e.preventDefault();
-    instance.set('data', originData);
+    e.preventDefault(); // revert to origin data, then set to new data to trigger animation
+
+    var newData = data.value;
+    data.set(originData);
     nextTick(function () {
+      data.set(newData);
       draggingKey.set(null);
       instance.trigger('dragend', {
         key: tableRow.get('key'),

package/es/components/table/useGroup.js

@@ -12,6 +12,9 @@ export function useGroup() {
   var instance = useInstance();
   var keywords = useState('');
   var filteredGroup = useState(instance.get('group'));
+  instance.on('$receive:group', function (group) {
+    return filteredGroup.set(group);
+  });
 
   function onSelect(value, groupValue, onChange) {
     var _instance$get = instance.get(),

package/es/components/table/useMerge.d.ts

@@ -1,5 +1,6 @@
 import { Props } from 'intact';
 import type { TableColumnProps } from './column';
+import { State } from '../../hooks/useState';
 export declare type TableMerge<T = any, CheckType = 'checkbox'> = (row: T, column: CheckType extends 'none' ? Props<TableColumnProps> : Props<TableColumnProps> | null, rowIndex: number, columnIndex: number) => TableMergeConfig | undefined;
 export declare type TableMergeConfig = {
     colspan?: number;
@@ -10,6 +11,6 @@ export declare type TableGridItem = {
     spans: TableMergeConfig | undefined;
 };
 export declare type TableGrid = TableGridItem[][];
-export declare function useMerge(getCols: () => Props<TableColumnProps>[]): {
+export declare function useMerge(getCols: () => Props<TableColumnProps>[], data: State<unknown[] | undefined>): {
     getGrid: () => TableGrid;
 };

package/es/components/table/useMerge.js

@@ -1,5 +1,6 @@
 import { useInstance } from 'intact';
-export function useMerge(getCols) {
+import { watchState } from '../../hooks/useState';
+export function useMerge(getCols, data) {
   var instance = useInstance();
   var grid = [];
 
@@ -8,12 +9,11 @@ export function useMerge(getCols) {
 
     var _instance$get = instance.get(),
         merge = _instance$get.merge,
-        data = _instance$get.data,
         checkType = _instance$get.checkType;
 
-    if (!data || !data.length || !merge) return;
+    if (!data.value || !data.value.length || !merge) return;
     var cols = getCols();
-    data.forEach(function (data, rowIndex) {
+    data.value.forEach(function (data, rowIndex) {
       var currentRow = [];
       grid.push(currentRow);
       var columnIndexOffset = 0;
@@ -71,6 +71,7 @@ export function useMerge(getCols) {
   }
 
   instance.on('$receive:children', handleSpans);
+  watchState(data, handleSpans);
   return {
     getGrid: getGrid
   };

package/es/components/table/usePagination.d.ts

@@ -0,0 +1,8 @@
+import { Pagination, PaginationChangeData } from '../pagination';
+export declare function usePagination(): {
+    data: import("../../hooks/useState").State<any[] | undefined>;
+    value: import("../../hooks/useState").State<number>;
+    limit: import("../../hooks/useState").State<number>;
+    onChange: (data: PaginationChangeData) => void;
+    paginationRef: import("intact").RefObject<Pagination>;
+};

package/es/components/table/usePagination.js

@@ -0,0 +1,81 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/slice";
+import { useInstance, createRef } from 'intact';
+import { useState } from '../../hooks/useState';
+import { Pagination } from '../pagination';
+import { isObject } from 'intact-shared';
+import { useReceive } from '../../hooks/useReceive';
+var defaultPagination = Pagination.defaults();
+export function usePagination() {
+  var instance = useInstance();
+  var data = useState(instance.get('data'));
+  var value = useState(defaultPagination.value);
+  var limit = useState(defaultPagination.limit);
+  var paginationRef = createRef(); // for unit test
+
+  useReceive(['data', 'pagination'], function () {
+    handleData();
+  });
+
+  function handleData() {
+    var _instance$get = instance.get(),
+        _data = _instance$get.data,
+        pagination = _instance$get.pagination;
+
+    if (!_data) {
+      data.set(undefined);
+      return;
+    }
+
+    if (!pagination) {
+      data.set(_data);
+      return;
+    }
+
+    if (isObject(pagination)) {
+      if (pagination.value) {
+        value.set(pagination.value);
+      }
+
+      if (pagination.limit) {
+        limit.set(pagination.limit);
+      }
+    }
+
+    updateDataByPage();
+  }
+
+  function updateDataByPage() {
+    var _instance$get2 = instance.get(),
+        _data = _instance$get2.data;
+
+    var index = (value.value - 1) * limit.value;
+    data.set(_sliceInstanceProperty(_data).call(_data, index, index + limit.value));
+  }
+
+  function onChange(data) {
+    var _instance$get3 = instance.get(),
+        pagination = _instance$get3.pagination;
+
+    value.set(data.value);
+    limit.set(data.limit);
+    updateDataByPage();
+
+    if (isObject(pagination)) {
+      instance.set('pagination', _extends({}, pagination, {
+        value: value.value,
+        limit: limit.value
+      }));
+    }
+
+    instance.trigger('changePage', data);
+  }
+
+  return {
+    data: data,
+    value: value,
+    limit: limit,
+    onChange: onChange,
+    paginationRef: paginationRef
+  };
+}

package/es/components/table/useTree.d.ts

@@ -1,5 +1,6 @@
 import type { TableRowKey } from './table';
-export declare function useTree(): {
+import { State } from '../../hooks/useState';
+export declare function useTree(data: State<any[] | undefined>): {
     isSpreaded: (key: TableRowKey) => boolean;
     toggleSpreadRow: (key: TableRowKey) => void;
     loopData: <T>(cb: (value: any, index: number, level: number, meta: T | null) => T, shouldBreak?: boolean) => void;

package/es/components/table/useTree.js

@@ -1,7 +1,7 @@
 import { useInstance } from 'intact';
 import { inArray } from './useChecked';
 import { toggleArray } from '../utils';
-export function useTree() {
+export function useTree(data) {
   var instance = useInstance();
 
   function isSpreaded(key) {
@@ -18,10 +18,9 @@ export function useTree() {
     }
 
     var _instance$get = instance.get(),
-        childrenKey = _instance$get.childrenKey,
-        data = _instance$get.data;
+        childrenKey = _instance$get.childrenKey;
 
-    loopDataWithChildrenKey(data, childrenKey, cb, shouldBreak);
+    loopDataWithChildrenKey(data.value, childrenKey, cb, shouldBreak);
   }
 
   return {

package/es/components/tooltip/index.spec.js

@@ -540,8 +540,10 @@ describe('Tooltip', function () {
 
               _proto.mounted = function mounted() {
                 var element = findDomFromVNode(this.$lastInput, true);
-                var windowHeight = window.innerHeight || document.documentElement.clientHeight;
-                element.parentNode.style.height = windowHeight * 2 + "px";
+                var style = element.style;
+                style.position = 'fixed';
+                style.top = '-200px'; // const windowHeight = window.innerHeight || document.documentElement.clientHeight;
+                // (element.parentNode as HTMLElement).style.height = `${windowHeight * 2}px`;
               };
 
               return Demo;
@@ -555,23 +557,20 @@ describe('Tooltip', function () {
               };
             };
 
-            _mount9 = mount(Demo), i = _mount9[0];
-            _context11.next = 6;
-            return wait(500);
+            _mount9 = mount(Demo), i = _mount9[0]; // await wait(500);
+            // window.scrollTo(0, 10000);
 
-          case 6:
-            window.scrollTo(0, 10000);
             i.set('show', true);
-            _context11.next = 10;
+            _context11.next = 7;
             return wait(500);
 
-          case 10:
+          case 7:
             content = getElement('.k-tooltip-content');
             console.log(content.outerHTML);
             console.log(_JSON$stringify(content.getBoundingClientRect()));
             expect(content.getBoundingClientRect().top < 0).to.be.true;
 
-          case 14:
+          case 11:
           case "end":
             return _context11.stop();
         }

package/es/components/tooltip/tooltip.d.ts

@@ -23,6 +23,5 @@ export declare class Tooltip<T extends TooltipProps = TooltipProps, E extends To
     static typeDefs: Required<TypeDefs<TooltipProps>>;
     static defaults: () => Partial<TooltipProps>;
     static events: Events<TooltipEvents>;
-    protected alwaysPortal: boolean;
     hide(immediately: boolean): void;
 }

package/es/components/tooltip/tooltip.js

@@ -1,6 +1,5 @@
 import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
 import _extends from "@babel/runtime-corejs3/helpers/extends";
-import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
 import { Dropdown } from '../dropdown/dropdown';
 import { _$ } from '../../i18n';
 import { themes } from './styles';
@@ -44,17 +43,7 @@ export var Tooltip = /*#__PURE__*/function (_Dropdown) {
   _inheritsLoose(Tooltip, _Dropdown);
 
   function Tooltip() {
-    var _context;
-
-    var _this;
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _Dropdown.call.apply(_Dropdown, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
-    _this.alwaysPortal = true;
-    return _this;
+    return _Dropdown.apply(this, arguments) || this;
   }
 
   var _proto = Tooltip.prototype;

package/es/index.d.ts

@@ -1,5 +1,5 @@
 /*!
- * @king-design v2.0.16
+ * @king-design v2.1.0
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -9,7 +9,7 @@
  */
 export { _$, localize } from './i18n';
 export { bind } from './components/utils';
-export { setTheme } from './styles/theme';
+export { setTheme, theme } from './styles/theme';
 export * from './components/affix';
 export * from './components/badge';
 export * from './components/breadcrumb';
@@ -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.0.16";
+export declare const version = "2.1.0";

package/es/index.js

@@ -1,5 +1,5 @@
 /*!
- * @king-design v2.0.16
+ * @king-design v2.1.0
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -9,7 +9,7 @@
  */
 export { _$, localize } from './i18n';
 export { bind } from './components/utils';
-export { setTheme } from './styles/theme';
+export { setTheme, theme } from './styles/theme';
 /* generate start */
 
 export * from './components/affix';
@@ -59,5 +59,5 @@ export * from './components/tree';
 export * from './components/treeSelect';
 export * from './components/upload';
 export * from './components/wave';
-export var version = '2.0.16';
+export var version = '2.1.0';
 /* generate end */

package/es/packages/kpc-react/__tests__/components/cascader.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/es/packages/kpc-react/__tests__/components/cascader.spec.js

@@ -0,0 +1,79 @@
+import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
+import React, { useState } from 'react';
+import * as ReactDOM from 'react-dom';
+import { Cascader } from '../../';
+import { getElement, wait } from '../../../../test/utils';
+describe('Cascader', function () {
+  var container;
+  beforeEach(function () {
+    container = document.createElement('div');
+    document.body.appendChild(container);
+  });
+  afterEach(function () {
+    ReactDOM.unmountComponentAtNode(container);
+    document.body.removeChild(container);
+  });
+  it('should hide all menu on selected', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var App, select, dropdown1, _dropdown1$querySelec, item1, dropdown2, _dropdown2$querySelec, item11;
+
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            App = function _App() {
+              var _useState = useState([]),
+                  value = _useState[0],
+                  setValue = _useState[1];
+
+              return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Cascader, {
+                data: [{
+                  value: 'a',
+                  label: 'a',
+                  children: [{
+                    value: 'b',
+                    label: 'b'
+                  }]
+                }],
+                value: value,
+                multiple: true,
+                filterable: true,
+                onChangeValue: function onChangeValue(v) {
+                  setValue(v);
+                }
+              }));
+            };
+
+            ReactDOM.render( /*#__PURE__*/React.createElement(App, null), container);
+            select = container.querySelector('.k-cascader');
+            select.click();
+            _context.next = 6;
+            return wait();
+
+          case 6:
+            dropdown1 = getElement('.k-cascader-menu');
+            _dropdown1$querySelec = dropdown1.querySelectorAll(':scope > .k-dropdown-item'), item1 = _dropdown1$querySelec[0];
+            item1.click();
+            _context.next = 11;
+            return wait();
+
+          case 11:
+            dropdown2 = getElement('.k-cascader-menu');
+            _dropdown2$querySelec = dropdown2.querySelectorAll(':scope > .k-dropdown-item'), item11 = _dropdown2$querySelec[0];
+            item11.click();
+            _context.next = 16;
+            return wait(500);
+
+          case 16:
+            // should hide all menu
+            expect(dropdown1.style.display).to.eql('none');
+            expect(dropdown2.style.display).to.eql('none');
+
+          case 18:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  })));
+});

package/es/site/data/components/dialog/demos/basic/react.js

@@ -50,7 +50,10 @@ var Demo = /*#__PURE__*/function (_React$Component) {
       ref: function ref(i) {
         return _this2.__demo = i;
       }
-    }, "Dialog Body", /*#__PURE__*/React.createElement(Select, null)));
+    }, "Dialog Body", this.state.show ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, {
+      filterable: true,
+      multiple: true
+    })) : undefined));
   };
 
   return Demo;

package/es/site/data/components/input/demos/autoRows/index.d.ts

@@ -0,0 +1,9 @@
+export { default as data } from './index.json';
+import { Component } from 'intact';
+export default class extends Component {
+    static template: string | import("intact").Template<any>;
+    static defaults(): {
+        value1: string;
+        value2: string;
+    };
+}

package/es/site/data/components/input/demos/autoRows/index.js

@@ -0,0 +1,24 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import template from './index.vdt';
+
+var default_1 = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(default_1, _Component);
+
+  function default_1() {
+    return _Component.apply(this, arguments) || this;
+  }
+
+  default_1.defaults = function defaults() {
+    return {
+      value1: '',
+      value2: ''
+    };
+  };
+
+  return default_1;
+}(Component);
+
+default_1.template = template;
+export { default_1 as default };

package/es/site/data/components/input/demos/autoRows/react.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export default class Demo extends React.Component {
+    state: {
+        value1: string;
+        value2: string;
+    };
+    render(): JSX.Element;
+}

package/es/site/data/components/input/demos/autoRows/react.js

@@ -0,0 +1,62 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import React from 'react';
+import { Input } from '@king-design/react';
+
+var Demo = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Demo, _React$Component);
+
+  function Demo() {
+    var _context;
+
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _React$Component.call.apply(_React$Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.state = {
+      value1: '',
+      value2: ''
+    };
+    return _this;
+  }
+
+  var _proto = Demo.prototype;
+
+  _proto.render = function render() {
+    var _this2 = this;
+
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Input, {
+      value: this.state.value1,
+      onChangeValue: function onChangeValue(value1) {
+        return _this2.setState({
+          value1: value1
+        });
+      },
+      type: "textarea",
+      placeholder: "please enter",
+      fluid: true,
+      rows: "auto"
+    }), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Input, {
+      value: this.state.value2,
+      onChangeValue: function onChangeValue(value2) {
+        return _this2.setState({
+          value2: value2
+        });
+      },
+      type: "textarea",
+      placeholder: "please enter",
+      fluid: true,
+      rows: {
+        min: 3,
+        max: 5
+      }
+    }));
+  };
+
+  return Demo;
+}(React.Component);
+
+export { Demo as default };

package/es/site/data/components/input/demos/password/index.d.ts

@@ -0,0 +1,5 @@
+export { default as data } from './index.json';
+import { Component } from 'intact';
+export default class extends Component {
+    static template: string | import("intact").Template<any>;
+}

package/es/site/data/components/input/demos/password/index.js

@@ -0,0 +1,17 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import template from './index.vdt';
+
+var default_1 = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(default_1, _Component);
+
+  function default_1() {
+    return _Component.apply(this, arguments) || this;
+  }
+
+  return default_1;
+}(Component);
+
+default_1.template = template;
+export { default_1 as default };

package/es/site/data/components/input/demos/password/react.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export default class Demo extends React.Component {
+    private __demo;
+    render(): JSX.Element;
+}

package/es/site/data/components/input/demos/password/react.js

@@ -0,0 +1,41 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import React from 'react';
+import { Input } from '@king-design/react';
+
+var Demo = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Demo, _React$Component);
+
+  function Demo() {
+    var _context;
+
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _React$Component.call.apply(_React$Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.__demo = void 0;
+    return _this;
+  }
+
+  var _proto = Demo.prototype;
+
+  _proto.render = function render() {
+    var _this2 = this;
+
+    return /*#__PURE__*/React.createElement(Input, {
+      placeholder: "password",
+      type: "password",
+      showPassword: true,
+      ref: function ref(i) {
+        return _this2.__demo = i;
+      }
+    });
+  };
+
+  return Demo;
+}(React.Component);
+
+export { Demo as default };

package/es/site/data/components/input/demos/textarea/react.js

@@ -14,11 +14,13 @@ var Demo = /*#__PURE__*/function (_React$Component) {
   _proto.render = function render() {
     return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Input, {
       type: "textarea",
-      placeholder: "please enter"
+      placeholder: "please enter",
+      fluid: true
     }), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Input, {
       type: "textarea",
       rows: "5",
-      placeholder: "please enter"
+      placeholder: "please enter",
+      fluid: true
     }));
   };
 

package/es/site/data/components/table/demos/hideHeader/index.d.ts

@@ -0,0 +1,12 @@
+export { default as data } from './index.json';
+import { Component } from 'intact';
+export default class extends Component {
+    static template: string | import("intact").Template<any>;
+    static defaults(): {
+        data: {
+            a: string;
+            b: string;
+        }[];
+        hideHeader: boolean;
+    };
+}