@king-design/react 2.0.13-beta.0 → 2.0.14

package/__tests__/__snapshots__/React Demos.md

@@ -1280,7 +1280,7 @@
 ####   `Table animation`
 
 ```
-"<div><button class=\"k-btn k-primary css-12uxt25\" tabindex=\"0\" type=\"button\">增加一行</button><button class=\"k-btn k-primary css-12uxt25\" tabindex=\"0\" type=\"button\">删除一行</button><button class=\"k-btn k-primary css-12uxt25\" tabindex=\"0\" type=\"button\">增加一列</button><div class=\"k-table css-gxoqtj\"><div class=\"k-table-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 3\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-resize\"></div><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 3</div></div></th></tr></thead><tbody><tr data-key=\"Cell 1-1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 1-1\">Cell 1-1</td><td title=\"Cell 1-3\">Cell 1-3</td></tr><tr data-key=\"Cell 2-1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 2-1\">Cell 2-1</td><td title=\"Cell 2-3\">Cell 2-3</td></tr></tbody></table></div></div></div>"
+"<div><button class=\"k-btn k-primary css-12uxt25\" tabindex=\"0\" type=\"button\">增加一行</button><button class=\"k-btn k-primary css-12uxt25\" tabindex=\"0\" type=\"button\">删除一行</button><button class=\"k-btn k-primary css-12uxt25\" tabindex=\"0\" type=\"button\">增加一列</button><div class=\"k-table css-gxoqtj\"><div class=\"k-table-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 3\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-resize\"></div><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 3</div></div></th></tr></thead><tbody><tr data-key=\"Cell 1-1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 1-1\">Cell 1-1</td><td title=\"Cell 1-3\">Cell 1-3</td></tr><tr data-key=\"Cell 2-1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 2-1\">Cell 2-1</td><td title=\"Cell 2-3\">Cell 2-3</td></tr></tbody></table></div></div><div class=\"k-table css-gxoqtj\"><div class=\"k-table-wrapper\"><table><colgroup><col width=\"40\"><col><col></colgroup><thead><tr><th rowspan=\"1\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></th><th title=\"Title 1\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 1</div></div></th><th title=\"Title 3\" colspan=\"1\" rowspan=\"1\"><div class=\"k-table-resize\"></div><div class=\"k-table-title\"><div class=\"k-table-title-text c-ellipsis\">Title 3</div></div></th></tr></thead><tbody><tr data-key=\"Cell 1-1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 1-1\">Cell 1-1</td><td title=\"Cell 1-3\">Cell 1-3</td></tr><tr data-key=\"Cell 2-1\"><td class=\"k-table-check\"><label class=\"k-checkbox css-rt2md4\" tabindex=\"0\"><span class=\"k-checkbox-wrapper\"><input type=\"checkbox\" tabindex=\"-1\" value=\"true\"></span></label></td><td title=\"Cell 2-1\">Cell 2-1</td><td title=\"Cell 2-3\">Cell 2-3</td></tr></tbody></table></div></div></div>"
 ```
 
 ####   `Table basic`

package/__tests__/components/drawer.spec.tsx

@@ -39,6 +39,7 @@ describe('Drawer', () => {
     it('should handle event correctly', async () => {
         const click1 = sinon.spy(() => console.log(1));
         const click2 = sinon.spy(() => console.log(2));
+        const click3 = sinon.spy(() => console.log(3));
 
         ReactDOM.render(
             <div>
@@ -53,11 +54,18 @@ describe('Drawer', () => {
                         <div className="click" onClick={click2}>click</div>
                     </Card>
                 </Drawer>
+                <Drawer value={true} title="3">
+                    <div>
+                        <Card>
+                            <div className="click" onClick={click3}>click</div>
+                        </Card>
+                    </div>
+                </Drawer>
             </div>,
             container
         );
 
-        const [element1, element2] = document.querySelectorAll<HTMLElement>('.click');
+        const [element1, element2, element3] = document.querySelectorAll<HTMLElement>('.click');
 
         dispatchEvent(element1, 'click');
         await wait();
@@ -66,5 +74,9 @@ describe('Drawer', () => {
         dispatchEvent(element2, 'click');
         await wait();
         expect(click2.callCount).to.eql(1);
+
+        dispatchEvent(element3, 'click');
+        await wait();
+        expect(click3.callCount).to.eql(1);
     });
 });

package/__tests__/index.ts

@@ -39,7 +39,7 @@ describe('React Demos', () => {
     }
 
     testDemos(reactReq, async (Demo) => {
-        const [instance, element] = mount(wrap(Demo as any));
+        const [instance, element] = mount(wrap(Demo as any) as any);
         await wait(100);
         // FIXME: I don't know why the width of `autoWidth` input is an unexpected value
         // while we run test on Github Actions.

package/components/cascader/useValue.js

@@ -36,7 +36,7 @@ export function useValue() {
       });
     }
   });
-  instance.watch('_show', function (value) {
+  instance.watch('show', function (value) {
     if (value) {
       showedValue.set(last(values.value) || []);
     }

package/components/code/index.d.ts

@@ -1,5 +1,5 @@
 import { Component, TypeDefs } from 'intact-react';
-import type { editor } from 'monaco-editor';
+import type { editor, default as monaco } from 'monaco-editor';
 import type { Events } from '../types';
 export interface CodeProps {
     value?: string;
@@ -11,7 +11,7 @@ export interface CodeProps {
     options?: editor.IStandaloneEditorConstructionOptions;
 }
 export interface CodeEvents {
-    ready: [editor.IStandaloneCodeEditor, typeof editor];
+    ready: [editor.IStandaloneCodeEditor, typeof editor, typeof monaco];
 }
 export declare class Code extends Component<CodeProps, CodeEvents> {
     static template: string | import("intact").Template<any>;

package/components/code/useEditor.js

@@ -29,7 +29,7 @@ export function useEditor() {
       }, options));
       watch(Editor, codeEditor);
       loading.set(false);
-      instance.trigger('ready', codeEditor, Editor);
+      instance.trigger('ready', codeEditor, Editor, monaco);
     });
   });
   onBeforeUnmount(function () {

package/components/form/styles.js

@@ -50,7 +50,7 @@ setDefault(function () {
   }).form;
 });
 export function makeItemStyles() {
-  return /*#__PURE__*/css("display:table;position:relative;table-layout:fixed;&:not(:last-of-type){margin-bottom:", form.item.gap, ";}&.k-fluid{width:100%;}.k-form-label{display:table-cell;width:", form.item.labelWidth, ";text-align:", form.item.labelTextAlign, ";padding-right:", form.item.labelGap, ";line-height:", form.item.labelLineHeight, ";}.k-form-star{color:", form.item.starColor, ";margin-right:", form.item.starGap, ";}.k-form-content{display:table-cell;vertical-align:middle;position:relative;}.k-form-error{position:absolute;color:", form.item.errorColor, ";font-size:", form.item.errorFontSize, ";left:0;right:0;display:flex;align-items:center;&.k-ellipsis{.k-form-error-more{display:inline-block;}}}.k-form-error-more{line-height:", form.item.errorFontSize, ";display:none;}&.k-invalid{.k-input{.k-input-inner{border:", form.item.invalidBorder, ";position:relative;z-index:1;}}.k-select,.k-checkbox-wrapper,.k-radio-wrapper{border:", form.item.invalidBorder, "!important;}.k-select .k-input .k-input-inner{border:none;}}.k-form-item{display:block;width:auto;}.k-form-append{display:table-cell;padding:", form.item.appendPadding, ";vertical-align:middle;}");
+  return /*#__PURE__*/css("display:table;position:relative;table-layout:fixed;&:not(:last-of-type){margin-bottom:", form.item.gap, ";}&.k-fluid{width:100%;}.k-form-label{display:table-cell;width:", form.item.labelWidth, ";text-align:", form.item.labelTextAlign, ";padding-right:", form.item.labelGap, ";line-height:", form.item.labelLineHeight, ";}.k-form-star{color:", form.item.starColor, ";margin-right:", form.item.starGap, ";}.k-form-content{display:table-cell;vertical-align:middle;position:relative;}.k-form-error{position:absolute;color:", form.item.errorColor, ";font-size:", form.item.errorFontSize, ";left:0;right:0;display:flex;align-items:center;&.k-ellipsis{.k-form-error-more{display:inline-block;}}}.k-form-error-more{line-height:", form.item.errorFontSize, ";display:none;}&.k-invalid{.k-input{.k-input-inner{border:", form.item.invalidBorder, ";position:relative;z-index:1;}}.k-select,.k-checkbox-wrapper,.k-radio-wrapper{border:", form.item.invalidBorder, "!important;}.k-select .k-input .k-input-inner{border:none;}}.k-form-item{&,.k-form-content{display:block;width:auto;}}.k-form-append{display:table-cell;padding:", form.item.appendPadding, ";vertical-align:middle;}");
 }
 export function makeFormStyles() {
   var _context;

package/components/select/base.d.ts

@@ -20,7 +20,7 @@ export interface BaseSelectProps<V, Multipe extends boolean = boolean, Attach =
     placeholder?: Children;
     container?: Container;
     width?: string | number;
-    _show?: boolean;
+    show?: boolean;
 }
 export interface BaseSelectEvents {
     keydown: [KeyboardEvent];

package/components/select/base.js

@@ -27,7 +27,7 @@ var typeDefs = {
   placeholder: [String, Number],
   container: [Function, String],
   width: [String, Number],
-  _show: Boolean
+  show: Boolean
 };
 
 var defaults = function defaults() {
@@ -65,7 +65,7 @@ export var BaseSelect = /*#__PURE__*/function (_Component) {
 
   _proto.init = function init() {
     provide(SELECT, this);
-    useShowHideEvents('_show'); // this.input = useInput();
+    useShowHideEvents('show'); // this.input = useInput();
 
     this.watch('value', this.position, {
       presented: true
@@ -81,11 +81,11 @@ export var BaseSelect = /*#__PURE__*/function (_Component) {
   };
 
   _proto.show = function show() {
-    this.set('_show', true);
+    this.set('show', true);
   };
 
   _proto.hide = function hide() {
-    this.set('_show', false);
+    this.set('show', false);
   };
 
   _proto.resetKeywords = function resetKeywords(keywords) {

package/components/select/base.vdt.js

@@ -40,7 +40,7 @@ export default function ($props, $blocks, $__proto__) {
       inline = _this$get.inline,
       style = _this$get.style,
       width = _this$get.width,
-      _show = _this$get._show;
+      show = _this$get.show;
 
   var classNameObj = (_classNameObj = {
     'k-select': true,
@@ -94,7 +94,7 @@ export default function ($props, $blocks, $__proto__) {
             'name': 'k-fade',
             'appear': false,
             'children': !multiple && filterable ? _$cc(Input, {
-              'value': _show ? keywords : label,
+              'value': show ? keywords : label,
               'ev-$change:value': onInput,
               'disabled': disabled,
               'placeholder': label || placeholder,
@@ -103,7 +103,7 @@ export default function ($props, $blocks, $__proto__) {
               'fluid': true,
               'inline': true,
               'key': 'input',
-              'readonly': !_show,
+              'readonly': !show,
               'waveDisabled': true
             }, 'input', inputRef) : !filterable && !hasValue ? _$ce(2, 'div', placeholder, 0, 'k-select-placeholder c-ellipsis', null, 'placeholder') : !multiple ? _$ce(2, 'div', (_$blocks['value'] = function ($super) {
               return label;
@@ -155,7 +155,7 @@ export default function ($props, $blocks, $__proto__) {
               'inline': true,
               'size': size,
               'key': 'filter',
-              'readonly': !_show,
+              'readonly': !show,
               'waveDisabled': true
             }, 'filter', inputRef) : undefined], 0, _$cn({
               "k-select-values": true,
@@ -195,9 +195,9 @@ export default function ($props, $blocks, $__proto__) {
             return block ? block.call($this, callBlock, data) : callBlock();
           }, __$blocks['base-menu'](_$no))],
           'ev-$model:value': function ev$modelValue($v) {
-            $this.set('_show', $v);
+            $this.set('show', $v);
           },
-          'value': $this.get('_show')
+          'value': $this.get('show')
         }, null, _this.dropdownRef)
       });
     }

package/components/select/useEqualWidth.js

@@ -1,7 +1,7 @@
 import { useInstance, findDomFromVNode } from 'intact-react';
 export function useEqualWidth() {
   var instance = useInstance();
-  instance.watch('_show', setWidth, {
+  instance.watch('show', setWidth, {
     presented: true
   });
 

package/components/select/useFocusout.js

@@ -20,7 +20,7 @@ export function useFocusout() {
   function onFocusout(e) {
     instance.trigger('focusout', e);
 
-    if (instance.get('_show')) {
+    if (instance.get('show')) {
       e.stopPropagation();
     }
   }

package/components/select/useInput.js

@@ -25,7 +25,7 @@ export function useInput(resetKeywords) {
     }
   }
 
-  component.on('$changed:_show', function (show) {
+  component.on('$changed:show', function (show) {
     if (show) {
       focusInput();
       resetKeywords(keywords);

package/components/table/row.d.ts

@@ -23,6 +23,7 @@ export interface TableRowProps {
     onToggleSpreadRow: (key: TableRowKey) => void;
     onBeforeUnmount: (key: TableRowKey) => void;
     offsetMap: Record<Key, number>;
+    animation: boolean;
     draggable: boolean;
     draggingKey: TableRowKey | null;
     onRowDragStart: DragCallback;

package/components/table/row.vdt.js

@@ -5,7 +5,7 @@ import { getClassAndStyleForFixed } from './useFixedColumns';
 import { Checkbox } from '../checkbox';
 import { Radio } from '../radio';
 import { TableCell } from './cell';
-import { createElementVNode, className as cx } from 'intact';
+import { createElementVNode, className as cx, createFragment } from 'intact';
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj,
       _this = this;
@@ -34,7 +34,8 @@ export default function ($props, $blocks, $__proto__) {
       key = _this$get.key,
       offsetMap = _this$get.offsetMap,
       draggable = _this$get.draggable,
-      draggingKey = _this$get.draggingKey;
+      draggingKey = _this$get.draggingKey,
+      animation = _this$get.animation;
 
   var classNameObj = (_classNameObj = {
     'k-disabled': disabled,
@@ -110,16 +111,14 @@ export default function ($props, $blocks, $__proto__) {
       'key': columnKey
     }, columnKey));
   });
-
-  var rows = _$cc(TransitionGroup, {
+  var rows = animation ? _$cc(TransitionGroup, {
     'name': 'k-fade-expand',
     'move': false,
     'children': vNodes
-  });
+  }) : createFragment(vNodes, 8);
   /* const rows = vNodes; */
   // for performance, no normalize
 
-
   return createElementVNode(2, 'tr', rows, 2, cx(classNameObj), {
     'data-key': key,
     'ev-mouseenter': this.onMouseEnter,

package/components/table/table.d.ts

@@ -34,6 +34,7 @@ export interface TableProps<T = any, K extends TableRowKey = TableRowKey, C exte
     minColWidth?: number;
     widthStoreKey?: string;
     draggable?: boolean;
+    animation?: boolean | [boolean, boolean];
 }
 export interface TableEvents<T = any, K extends TableRowKey = number> {
     clickRow: [T, number, K];

package/components/table/table.js

@@ -56,7 +56,8 @@ var typeDefs = {
   resizable: Boolean,
   minColWidth: Number,
   widthStoreKey: String,
-  draggable: Boolean
+  draggable: Boolean,
+  animation: [Boolean, Array]
 };
 
 var defaults = function defaults() {
@@ -69,7 +70,8 @@ var defaults = function defaults() {
     rowExpandable: true,
     childrenKey: 'children',
     indent: 32,
-    minColWidth: 40
+    minColWidth: 40,
+    animation: true
   };
 };
 

package/components/table/table.vdt.js

@@ -57,7 +57,10 @@ export default function ($props, $blocks, $__proto__) {
       tooltipContainer = _this$get.tooltipContainer,
       showIndeterminate = _this$get.showIndeterminate,
       resizable = _this$get.resizable,
-      draggable = _this$get.draggable;
+      draggable = _this$get.draggable,
+      _animation = _this$get.animation;
+
+  var animation = !Array.isArray(_animation) ? [_animation, _animation] : _animation;
 
   var _this$columns$getData = this.columns.getData(),
       columns = _this$columns$getData.columns,
@@ -130,10 +133,8 @@ export default function ($props, $blocks, $__proto__) {
           'children': _$cc(FixedColumnsContext.Provider, {
             'value': offsetMap,
             'children': _$ce(2, 'thead', _$ma(columns, function ($value, $key) {
-              return _$ce(2, 'tr', _$cc(TransitionGroup, {
-                'name': 'k-fade-expand',
-                'move': false,
-                'children': [$key === 0 && checkType !== 'none' ? _$cv('th', _extends({}, getClassAndStyleForFixed({
+              return _$ce(2, 'tr', function () {
+                var ths = [$key === 0 && checkType !== 'none' ? _$cv('th', _extends({}, getClassAndStyleForFixed({
                   fixed: hasFixedLeft ? 'left' : false
                 }, 0), {
                   'rowspan': maxRows,
@@ -143,8 +144,13 @@ export default function ($props, $blocks, $__proto__) {
                   'indeterminate': showIndeterminate && allCheckedStatus == AllCheckedStatus.Indeterminate,
                   'ev-$change:value': toggleCheckedAll,
                   'disabled': !hasData
-                }) : undefined) : undefined, $value]
-              }), 2);
+                }) : undefined) : undefined, $value];
+                return animation[1] ? _$cc(TransitionGroup, {
+                  'name': 'k-fade-expand',
+                  'move': false,
+                  'children': ths
+                }) : ths;
+              }(), 0);
             }, $this), 4)
           })
         })
@@ -181,115 +187,116 @@ export default function ($props, $blocks, $__proto__) {
     return block ? block.call($this, callBlock, data) : callBlock();
   }, __$blocks['empty'](_$no)), 0, 'k-table-empty', {
     'colspan': colCount
-  }), 2, null, null, 'table-empty') : _$cc(TransitionGroup, {
-    'name': 'k-fade-in-left',
-    'move': !draggingKey.value,
-    'children': function () {
-      var rows = [];
-      loopData(function (value, index, level, hidden) {
-        // don't render if row is hidden
-        if (hidden) return hidden;
-        var status = allStatus[index];
-        var key = allKeys[index];
-        var spreaded = isSpreaded(key);
-        var hasChildren = !!childrenKey && Array.isArray(value[childrenKey]);
-        var indentSize = indent ? indent * level : 0;
+  }), 2, null, null, 'table-empty') : function () {
+    var rows = [];
+    loopData(function (value, index, level, hidden) {
+      // don't render if row is hidden
+      if (hidden) return hidden;
+      var status = allStatus[index];
+      var key = allKeys[index];
+      var spreaded = isSpreaded(key);
+      var hasChildren = !!childrenKey && Array.isArray(value[childrenKey]);
+      var indentSize = indent ? indent * level : 0;
 
-        var row = _$cc(TableRow, {
-          'key': key,
-          'cols': cols,
-          'data': value,
-          'checkType': checkType,
-          'hasFixedLeft': hasFixedLeft,
-          'onClick': _this.clickRow,
-          'checked': status.checked,
-          'indeterminate': status.indeterminate,
-          'index': index,
-          'disabled': status.disabled,
-          'allDisabled': status.allDisabled,
-          'className': _$cn(rowClassName && rowClassName(value, index, key)),
-          'merge': merge,
-          'grid': getGrid(),
-          'onChangeChecked': onChangeChecked,
-          'selected': isSelected(key),
-          'spreaded': spreaded,
-          'hasChildren': hasChildren,
-          'indent': indentSize,
-          'onToggleSpreadRow': toggleSpreadRow,
-          'onBeforeUnmount': _this.resetRowStatus.onRowBeforeUnmount,
-          'offsetMap': offsetMap,
-          'draggable': draggable,
-          'draggingKey': draggingKey.value,
-          'onRowDragStart': onRowDragStart,
-          'onRowDragEnd': onRowDragEnd,
-          'onRowDragOver': onRowDragOver
-        }, key);
+      var row = _$cc(TableRow, {
+        'key': key,
+        'cols': cols,
+        'data': value,
+        'checkType': checkType,
+        'hasFixedLeft': hasFixedLeft,
+        'onClick': _this.clickRow,
+        'checked': status.checked,
+        'indeterminate': status.indeterminate,
+        'index': index,
+        'disabled': status.disabled,
+        'allDisabled': status.allDisabled,
+        'className': _$cn(rowClassName && rowClassName(value, index, key)),
+        'merge': merge,
+        'grid': getGrid(),
+        'onChangeChecked': onChangeChecked,
+        'selected': isSelected(key),
+        'spreaded': spreaded,
+        'hasChildren': hasChildren,
+        'indent': indentSize,
+        'onToggleSpreadRow': toggleSpreadRow,
+        'onBeforeUnmount': _this.resetRowStatus.onRowBeforeUnmount,
+        'offsetMap': offsetMap,
+        'animation': animation[1],
+        'draggable': draggable,
+        'draggingKey': draggingKey.value,
+        'onRowDragStart': onRowDragStart,
+        'onRowDragEnd': onRowDragEnd,
+        'onRowDragOver': onRowDragOver
+      }, key);
 
-        if ($blocks.tooltip) {
-          var content = (_$blocks['tooltip'] = function ($super) {
-            return null;
-          }, __$blocks['tooltip'] = function ($super, data) {
-            var block = $blocks['tooltip'];
+      if ($blocks.tooltip) {
+        var content = (_$blocks['tooltip'] = function ($super) {
+          return null;
+        }, __$blocks['tooltip'] = function ($super, data) {
+          var block = $blocks['tooltip'];
 
-            var callBlock = function callBlock() {
-              return _$blocks['tooltip'].call($this, $super, data);
-            };
+          var callBlock = function callBlock() {
+            return _$blocks['tooltip'].call($this, $super, data);
+          };
 
-            return block ? block.call($this, callBlock, data) : callBlock();
-          }, __$blocks['tooltip'](_$no, [value, index]));
-          row = _$cc(Tooltip, {
-            'key': key,
-            'position': tooltipPosition,
-            'container': tooltipContainer,
-            'children': row,
-            '$blocks': function ($blocks) {
-              var _$blocks = {},
-                  __$blocks = _$ex({}, $blocks);
+          return block ? block.call($this, callBlock, data) : callBlock();
+        }, __$blocks['tooltip'](_$no, [value, index]));
+        row = _$cc(Tooltip, {
+          'key': key,
+          'position': tooltipPosition,
+          'container': tooltipContainer,
+          'children': row,
+          '$blocks': function ($blocks) {
+            var _$blocks = {},
+                __$blocks = _$ex({}, $blocks);
 
-              return (_$blocks['content'] = function ($super) {
-                return content;
-              }, __$blocks['content'] = function ($super, data) {
-                var block = $blocks['content'];
+            return (_$blocks['content'] = function ($super) {
+              return content;
+            }, __$blocks['content'] = function ($super, data) {
+              var block = $blocks['content'];
 
-                var callBlock = function callBlock() {
-                  return _$blocks['content'].call($this, $super, data);
-                };
+              var callBlock = function callBlock() {
+                return _$blocks['content'].call($this, $super, data);
+              };
 
-                return block ? block.call($this, callBlock, data) : callBlock();
-              }), __$blocks;
-            }.call($this, _$em)
-          }, key);
-        }
+              return block ? block.call($this, callBlock, data) : callBlock();
+            }), __$blocks;
+          }.call($this, _$em)
+        }, key);
+      }
 
-        rows.push(row);
+      rows.push(row);
 
-        if ($blocks.expand) {
-          var expanded = isExpanded(key);
-          rows.push(_$ce(2, 'tr', _$ce(2, 'td', _$cc(Transition, _extends({}, expandAnimationCallbacks, {
-            'children': expanded ? _$ce(2, 'div', (_$blocks['expand'] = function ($super) {
-              return null;
-            }, __$blocks['expand'] = function ($super, data) {
-              var block = $blocks['expand'];
+      if ($blocks.expand) {
+        var expanded = isExpanded(key);
+        rows.push(_$ce(2, 'tr', _$ce(2, 'td', _$cc(Transition, _extends({}, expandAnimationCallbacks, {
+          'children': expanded ? _$ce(2, 'div', (_$blocks['expand'] = function ($super) {
+            return null;
+          }, __$blocks['expand'] = function ($super, data) {
+            var block = $blocks['expand'];
 
-              var callBlock = function callBlock() {
-                return _$blocks['expand'].call($this, $super, data);
-              };
+            var callBlock = function callBlock() {
+              return _$blocks['expand'].call($this, $super, data);
+            };
 
-              return block ? block.call($this, callBlock, data) : callBlock();
-            }, __$blocks['expand'](_$no, [value, index])), 0, 'k-table-expand') : undefined
-          })), 2, null, {
-            'colspan': colCount
-          }), 2, _$cn({
-            "k-expand": true,
-            'k-expanded': expanded
-          }), null, key + ".$expand"));
-        }
+            return block ? block.call($this, callBlock, data) : callBlock();
+          }, __$blocks['expand'](_$no, [value, index])), 0, 'k-table-expand') : undefined
+        })), 2, null, {
+          'colspan': colCount
+        }), 2, _$cn({
+          "k-expand": true,
+          'k-expanded': expanded
+        }), null, key + ".$expand"));
+      }
 
-        return hidden || !spreaded;
-      });
-      return rows;
-    }()
-  }), 0);
+      return hidden || !spreaded;
+    });
+    return animation[0] ? _$cc(TransitionGroup, {
+      'name': 'k-fade-in-left',
+      'move': !draggingKey.value,
+      'children': rows
+    }) : rows;
+  }(), 0);
 
   var tableWidthPx = tableWidth.value ? tableWidth.value + "px" : null;
   var _this$stickyScrollbar = this.stickyScrollbar,

package/components/tooltip/index.d.ts

@@ -8,6 +8,6 @@ export interface TooltipProps extends BaseTooltipProps {
 export interface TooltipBlocks extends BaseTooltipBlocks, TooltipContentBlocks {
     content: null;
 }
-declare class _Tooltip extends BaseTooltip<TooltipProps, TooltipEvents, TooltipBlocks> {
+export declare class _Tooltip extends BaseTooltip<TooltipProps, TooltipEvents, TooltipBlocks> {
 }
 export declare const Tooltip: typeof _Tooltip;

package/components/wave/styles.js

@@ -13,5 +13,5 @@ setDefault(function () {
 });
 export function makeStyles(color, inset) {
   var waveEffect = /*#__PURE__*/keyframes("100%{top:calc(", inset, " + ", wave.inset, ");bottom:calc(", inset, " + ", wave.inset, ");left:calc(", inset, " + ", wave.inset, ");right:calc(", inset, " + ", wave.inset, ");opacity:0.05;}");
-  return /*#__PURE__*/css("position:relative;&::after{display:block;content:'';position:absolute;top:", inset, ";bottom:", inset, ";left:", inset, ";right:", inset, ";opacity:0.4;border-radius:4px;z-index:2;animation:", waveEffect, " .2s ease-in;animation-fill-mode:forwards;border:2px solid ", color, ";}&.k-circle,&.k-radio-wrapper{&:after{border-radius:calc(", theme.large.height, " / 2 + 4px);}}");
+  return /*#__PURE__*/css("position:relative;&::after{display:block;content:'';position:absolute;top:", inset, ";bottom:", inset, ";left:", inset, ";right:", inset, ";opacity:0.4;border-radius:4px;z-index:2;animation:", waveEffect, " .2s ease-in;animation-fill-mode:forwards;border:2px solid ", color, ";pointer-events:none;}&.k-circle,&.k-radio-wrapper{&:after{border-radius:calc(", theme.large.height, " / 2 + 4px);}}");
 }

package/index.d.ts

@@ -1,5 +1,5 @@
 /*!
- * @king-design v2.0.13-beta.0
+ * @king-design v2.0.14
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -57,7 +57,7 @@ export * from './components/tree';
 export * from './components/treeSelect';
 export * from './components/upload';
 export * from './components/wave';
-export declare const version = "2.0.13-beta.0";
+export declare const version = "2.0.14";
 
 
 export {normalize} from 'intact-react';

package/index.js

@@ -1,5 +1,5 @@
 /*!
- * @king-design v2.0.13-beta.0
+ * @king-design v2.0.14
  *
  * Copyright (c) Kingsoft Cloud
  * Released under the MIT License
@@ -59,7 +59,7 @@ export * from './components/tree';
 export * from './components/treeSelect';
 export * from './components/upload';
 export * from './components/wave';
-export var version = '2.0.13-beta.0';
+export var version = '2.0.14';
 /* generate end */
 
 export {normalize} from 'intact-react';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@king-design/react",
-  "version": "2.0.13-beta.0",
+  "version": "2.0.14",
   "description": "King-Design UI components for React.",
   "keywords": [
     "component",
@@ -37,7 +37,7 @@
     "dayjs": "^1.10.7",
     "downloadjs": "^1.4.7",
     "enquire.js": "^2.1.6",
-    "intact-react": "3.0.13",
+    "intact-react": "3.0.14",
     "monaco-editor": "^0.26.1",
     "mxgraphx": "^4.0.7",
     "resize-observer-polyfill": "^1.5.1",

package/styles/global.js

@@ -12,6 +12,6 @@ var slideDirections = {
   right: 'left center 0'
 }; // TODO: update global when theme changed
 
-injectGlobal("html{--var-wave-color:", theme.color.primary, ";box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,SF Pro SC,SF Pro Text,Helvetica Neue,Helvetica,PingFang SC,Segoe UI,Roboto,Hiragino Sans GB,arial,microsoft yahei ui,Microsoft YaHei,SimSun,sans-serif;}body{font-size:", theme.fontSize, ";line-height:", theme.lineHeight, ";margin:0;padding:0;color:", theme.color.text, ";}*,*:before,*:after{box-sizing:inherit;}", _mapInstanceProperty(_context = _Object$keys(slideDirections)).call(_context, function (direction) {
+injectGlobal("html{--var-wave-color:", theme.color.primary, ";box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,SF Pro SC,SF Pro Text,Helvetica Neue,Helvetica,PingFang SC,Segoe UI,Roboto,Hiragino Sans GB,arial,microsoft yahei ui,Microsoft YaHei,sans-serif;}body{font-size:", theme.fontSize, ";line-height:", theme.lineHeight, ";margin:0;padding:0;color:", theme.color.text, ";}*,*:before,*:after{box-sizing:inherit;}", _mapInstanceProperty(_context = _Object$keys(slideDirections)).call(_context, function (direction) {
   return "\n            .k-slide" + direction + "-enter-from,\n            .k-slide" + direction + "-leave-to {\n                transform-origin: " + slideDirections[direction] + ";\n                opacity: 0;\n                transform: " + (direction === 'down' || direction === 'up' ? "scaleY(.8)" : 'scaleX(.8)') + ";\n            }\n            .k-slide" + direction + "-enter-active,\n            .k-slide" + direction + "-leave-active {\n                transform-origin: " + slideDirections[direction] + ";\n                transition: opacity " + theme.transition.large + ", transform " + theme.transition.large + " !important;\n                pointer-events: none;\n            }\n        ";
 }).join(''), " .k-fade-enter-from,.k-fade-leave-to{opacity:0!important;}.k-fade-enter-active,.k-fade-leave-active{transition:opacity ", theme.transition.large, ";}.k-fade-leave-active:not(tr){position:absolute;}.k-fade-move{transition:transform ", theme.transition.large, ";}.k-scale-enter-from,.k-scale-leave-to{transform:scale(0);}.k-scale-enter-active,.k-scale-leave-active{transition:transform ", theme.transition.large, ";}.k-expand-enter-from,.k-expand-leave-to{opacity:0;overflow:hidden;}.k-expand-enter-active,.k-expand-leave-active{transition:all ", theme.transition.large, "!important;overflow:hidden;}.k-expand-move{transition:transform ", theme.transition.large, ";}.k-dropdown-enter-from,.k-dropdown-leave-to{opacity:0;transform:translateY(-20px);}.k-dropdown-enter-active,.k-dropdown-leave-active,.k-dropdown-move{transition:all ", theme.transition.large, ";}.k-dropdown-leave-active{position:absolute!important;}.k-dropdown-move{transition:transform ", theme.transition.large, ";}.k-fade-in-left-enter-from,.k-fade-in-left-leave-to{opacity:0;transform:translate3d(-15px, 0, 0);}.k-fade-in-left-enter-active,.k-fade-in-left-leave-active{transition:all ", theme.transition.large, ";td{background:", palette(theme.color.primary, -4), "!important;}}.k-fade-in-left-move{transition:transform ", theme.transition.large, ";}.k-fade-expand-enter-from,.k-fade-expand-leave-to{opacity:0;}.k-fade-expand-enter-active,.k-fade-expand-leave-active{transition:all ", theme.transition.large, ";background:", palette(theme.color.primary, -4), "!important;}.c-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.c-hidden{display:none;}.c-middle{display:inline-block;vertical-align:middle;}");

package/yarn-error.log

@@ -1,25 +1,25 @@
 Arguments: 
-  /Users/javey/.nvm/versions/node/v14.17.3/bin/node /Users/javey/.node/corepack/yarn/1.22.15/bin/yarn.js
+  /home/javey/.nvm/versions/node/v14.21.3/bin/node /usr/share/yarn/bin/yarn.js
 
 PATH: 
-  /Users/javey/Workspaces/kpc/node_modules/.bin:/Users/javey/.nvm/versions/node/v14.17.3/bin:/Users/javey/.cargo/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin:/Users/javey/.nvm/versions/node/v14.17.3/bin:/Users/javey/.cargo/bin:/Users/javey/.bin:/Users/javey/.bin
+  /home/javey/.nvm/versions/node/v14.21.3/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/home/javey/Workspaces/kpc/node_modules/.bin:/home/javey/.nvm/versions/node/v14.21.3/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin:/snap/bin
 
 Yarn version: 
-  1.22.15
+  1.22.19
 
 Node version: 
-  14.17.3
+  14.21.3
 
 Platform: 
-  darwin x64
+  linux x64
 
 Trace: 
-  Error: https://registry.yarnpkg.com/intact/-/intact-3.0.10.tgz: ENOENT: no such file or directory, open '/Users/javey/Library/Caches/Yarn/v6/npm-intact-3.0.10-eab07b631228e2cbeb1445fe2ad9ce0fbf6d45b3-integrity/node_modules/intact/.yarn-tarball.tgz'
+  Error: https://registry.npmmirror.com/dayjs/-/dayjs-1.10.7.tgz: ENOENT: no such file or directory, open '/home/javey/.cache/yarn/v6/npm-dayjs-1.10.7-2cf5f91add28116748440866a0a1d26f3a6ce468-integrity/node_modules/dayjs/.yarn-tarball.tgz'
 
 npm manifest: 
   {
     "name": "@king-design/react",
-    "version": "2.0.8",
+    "version": "2.0.13",
     "description": "King-Design UI components for React.",
     "keywords": [
       "component",
@@ -56,7 +56,7 @@ npm manifest:
       "dayjs": "^1.10.7",
       "downloadjs": "^1.4.7",
       "enquire.js": "^2.1.6",
-      "intact-react": "3.0.10",
+      "intact-react": "3.0.14",
       "monaco-editor": "^0.26.1",
       "mxgraphx": "^4.0.7",
       "resize-observer-polyfill": "^1.5.1",
@@ -358,29 +358,29 @@ Lockfile:
       parent-module "^1.0.0"
       resolve-from "^4.0.0"
   
-  intact-react@3.0.9:
-    version "3.0.9"
-    resolved "https://registry.yarnpkg.com/intact-react/-/intact-react-3.0.9.tgz#03c01b33ea05a0d8d09341c752897569325dfe44"
-    integrity sha512-QSwmy13k7rXZz7T9qwqNtKEX2CdbPOCFJYje3WOrf9AWAG/NX6tzggLM1Br6Rf3kcuq7LrsOiW1LEcvgJrz3Rg==
+  intact-react@3.0.13:
+    version "3.0.13"
+    resolved "https://registry.yarnpkg.com/intact-react/-/intact-react-3.0.13.tgz#bbe9bb5afa2c67cfc058a4557ce28b7a52f30952"
+    integrity sha512-RegeLioJOCneDDgg2BfPt5Zuzn0RL+FuvVhyyakc5nPvMfxKOKXY7VbvYGCV3DeYwpPPn+AmY5ZHAyoqPQCiGQ==
     dependencies:
-      intact "^3.0.9"
+      intact "^3.0.13"
       tslib "^2.3.1"
   
-  intact-shared@^3.0.9:
-    version "3.0.9"
-    resolved "https://registry.yarnpkg.com/intact-shared/-/intact-shared-3.0.9.tgz#de7c67de2bfd5078a729d20c84182cd43610db48"
-    integrity sha512-c/T+EyJeBCIh4XGphVOK7tH3t+J4FXoknzV/gSTiZYsLZDSGA2cBRD6z6NGWGDnj/XAXPbFaFIAFKXNhCaTjNQ==
+  intact-shared@^3.0.13:
+    version "3.0.13"
+    resolved "https://registry.yarnpkg.com/intact-shared/-/intact-shared-3.0.13.tgz#e8e6f36d95cded2d9d5a3e1302a3315e9d182cf6"
+    integrity sha512-DClf1YscE9RYOeYAY3BFv1UuFt5SvrO2kLL9QbZbWGDaroEVuX/2F2UcisjE3PNbDvVtZ8+pbRZ8P/kZy9YnNQ==
   
-  intact@^3.0.9:
-    version "3.0.9"
-    resolved "https://registry.yarnpkg.com/intact/-/intact-3.0.9.tgz#a4c0b3574d97c77c62cd1a1e84d6e27742888e6f"
-    integrity sha512-liBz/xo0XAKIuXBoBs0G6yvWHGJTb43ChF4AUJzQNr4CHX5YWZPgIKGvw34UScBmYWpu3SzwvMDLs7aoVDITxg==
+  intact@^3.0.13:
+    version "3.0.13"
+    resolved "https://registry.yarnpkg.com/intact/-/intact-3.0.13.tgz#19c7cb0424e532b68a4a3f5f43229ddd0d3f8709"
+    integrity sha512-RTZOY72BOXOcpb1BswmhDMtbOLo0EoiHFT/HBjpXUTRu2TRnNm5yFh0VIF7dL1ZREYxiKEpvPUFIoFhwjMRzRg==
     dependencies:
-      intact-shared "^3.0.9"
-      misstime "^3.0.9"
+      intact-shared "^3.0.13"
+      misstime "^3.0.13"
       tslib "^2.2.0"
-      vdt "^3.0.9"
-      vdt-compiler "^3.0.9"
+      vdt "^3.0.13"
+      vdt-compiler "^3.0.13"
   
   is-arrayish@^0.2.1:
     version "0.2.1"
@@ -409,12 +409,12 @@ Lockfile:
     resolved "https://registry.npmmirror.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
     integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
   
-  misstime@^3.0.9:
-    version "3.0.9"
-    resolved "https://registry.yarnpkg.com/misstime/-/misstime-3.0.9.tgz#0f6094109768c71c7fc4bdd47aba7e847c12f672"
-    integrity sha512-LYgnqiU2eucjimJbjM5p4VHNR27mVAl8ISbolYUHQS9J0fk2JN00MPH7H4uEbCAFmSrVVHLAJgQ+qGRj+/GNeg==
+  misstime@^3.0.13:
+    version "3.0.13"
+    resolved "https://registry.yarnpkg.com/misstime/-/misstime-3.0.13.tgz#b9f614627eda9fe25b7db08768fa08858dce61e2"
+    integrity sha512-a5Md2dpyyT+0tRAHdIQi1NEWfFOPfPTvqpvqJ1CzT8zZDd/DesGjCt4+pAi88fBcDnmdw213PMe1lNwvSlmo0A==
     dependencies:
-      intact-shared "^3.0.9"
+      intact-shared "^3.0.13"
   
   monaco-editor@^0.26.1:
     version "0.26.1"
@@ -519,22 +519,22 @@ Lockfile:
     resolved "https://registry.npmmirror.com/tslib/-/tslib-2.3.1.tgz#e8a335add5ceae51aa261d32a490158ef042ef01"
     integrity sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==
   
-  vdt-compiler@^3.0.9:
-    version "3.0.9"
-    resolved "https://registry.yarnpkg.com/vdt-compiler/-/vdt-compiler-3.0.9.tgz#4d33cedd92bf622b553869480ef3f1c1e0490bea"
-    integrity sha512-pK9aQUxcpXs6fho5bJ8jrlp/jfBJPomLUtSFexK6nDgShw4yTmXErZUV51tnSSXauO4QsF75OLFdvgcH+F1/Tg==
+  vdt-compiler@^3.0.13:
+    version "3.0.13"
+    resolved "https://registry.yarnpkg.com/vdt-compiler/-/vdt-compiler-3.0.13.tgz#bfbf4f58b60ee4ad9b571c43e50bd872f62c59ff"
+    integrity sha512-lNTsB9M4mGmcUr21hro1lOcVHFXQBsO14c3K6WUlOGQgJvjp4ELhjIIbaL525Q//O08geviNuvf1V2gK/4Xtmg==
     dependencies:
-      intact-shared "^3.0.9"
-      misstime "^3.0.9"
+      intact-shared "^3.0.13"
+      misstime "^3.0.13"
       tslib "^2.2.0"
   
-  vdt@^3.0.9:
-    version "3.0.9"
-    resolved "https://registry.yarnpkg.com/vdt/-/vdt-3.0.9.tgz#de3b3259cb2dfd7934c0bb179c6de1b3b4ac025a"
-    integrity sha512-TyKJxDaIDryxdseZW7UXN9lQMngTygFPazhQ+O2M+biH6QzP1yk7iTYH4BPKoyJGEfd3zm7z1n/ifRdMRXp7Tw==
+  vdt@^3.0.13:
+    version "3.0.13"
+    resolved "https://registry.yarnpkg.com/vdt/-/vdt-3.0.13.tgz#ca74d3469529468c997f0b7bf12c6a7c5ea81a59"
+    integrity sha512-AOzc0FInl4CfRod5p/dG5C54pocLOhr1W+e+vxeHpHs2RLAICyGXYEoUvQTwzEIJC4iXgD/unzsX+6BJTnintQ==
     dependencies:
-      intact-shared "^3.0.9"
-      misstime "^3.0.9"
+      intact-shared "^3.0.13"
+      misstime "^3.0.13"
       tslib "^2.2.0"
   
   yaml@^1.7.2: