@king-design/intact 3.2.2-beta.0 → 3.3.1

package/es/components/breadcrumb/index.vdt.js

@@ -1,9 +1,13 @@
 import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/splice";
-import { createElementVNode as _$ce, noop as _$no, className as _$cn, createVNode as _$cv } from 'intact';
+import { createElementVNode as _$ce, createUnknownComponentVNode as _$cc, noop as _$no, className as _$cn, createVNode as _$cv } from 'intact';
 import { getRestProps, mapChildren } from '../utils';
 import { BreadcrumbItem } from './item';
 import { makeStyles } from './styles';
+import { Icon } from '../icon';
+var _$tmp0 = {
+  'className': 'k-icon-right'
+};
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj;
   $blocks || ($blocks = {});
@@ -17,7 +21,7 @@ export default function ($props, $blocks, $__proto__) {
     className = _this$get.className;
   var k = this.config.k;
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-breadcrumb"] = true, _classNameObj[className] = className, _classNameObj[makeStyles(k)] = true, _classNameObj);
-  var separatorVNode = _$ce(2, 'span', (_$blocks['separator'] = function ($super) {
+  var separatorVNode = _$ce(2, 'span', !$blocks.separator && !separator ? _$cc(Icon, _$tmp0) : (_$blocks['separator'] = function ($super) {
     return separator;
   }, __$blocks['separator'] = function ($super, data) {
     var block = $blocks['separator'];

package/es/components/cascader/index.js

@@ -1,6 +1,7 @@
 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 _valuesInstanceProperty from "@babel/runtime-corejs3/core-js/instance/values";
 import template from './index.vdt';
 import { BaseSelect } from '../select/base';
 import { _$ } from '../../i18n';
@@ -41,7 +42,7 @@ export var Cascader = /*#__PURE__*/function (_BaseSelect) {
     _this.value = useValue();
     _this.label = useLabel(_this.fields);
     _this.load = useLoad(_this.fields);
-    _this.filterable = useFilterable(_this.input.keywords, _this.value.setValue, _this.fields);
+    _this.filterable = useFilterable(_this.input.keywords, _this.value.setValue, _this.fields, _valuesInstanceProperty(_this.value));
     _this.positionObj = {
       my: 'left top',
       at: 'right top',

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

@@ -433,4 +433,36 @@ describe('Cascader', function () {
       }
     }, _callee10);
   })));
+  it('should only show submenu while the root menu will show', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee11() {
+    var _mount10, instance, element, _element$querySelecto2, dom, input;
+    return _regeneratorRuntime.wrap(function _callee11$(_context14) {
+      while (1) switch (_context14.prev = _context14.next) {
+        case 0:
+          _mount10 = mount(FilterDemo), instance = _mount10[0], element = _mount10[1];
+          instance.set('values', [['beijing', 'haidian']]);
+          _context14.next = 4;
+          return wait();
+        case 4:
+          _element$querySelecto2 = element.querySelectorAll('.k-cascader'), dom = _element$querySelecto2[1];
+          dispatchEvent(dom, 'click');
+          _context14.next = 8;
+          return wait();
+        case 8:
+          input = dom.querySelector('.k-input-inner'); // should show layer when input empty string
+          input.value = 's';
+          dispatchEvent(input, 'input');
+          _context14.next = 13;
+          return wait();
+        case 13:
+          document.body.click();
+          _context14.next = 16;
+          return wait();
+        case 16:
+          expect(getElement('.k-cascader-menu')).to.not.exist;
+        case 17:
+        case "end":
+          return _context14.stop();
+      }
+    }, _callee11);
+  })));
 });

package/es/components/cascader/index.vdt.js

@@ -17,7 +17,8 @@ export default function ($props, $blocks, $__proto__) {
     trigger = _this$get.trigger,
     filterable = _this$get.filterable,
     fields = _this$get.fields,
-    multiple = _this$get.multiple;
+    multiple = _this$get.multiple,
+    show = _this$get.show;
   var k = this.config.k;
   var baseMenuStyles = makeMenuStyles(k);
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-cascader-menu"] = true, _classNameObj[makeMenuStyles(k)] = true, _classNameObj);
@@ -41,7 +42,7 @@ export default function ($props, $blocks, $__proto__) {
     }
     return _mapInstanceProperty(data).call(data, function (item, index) {
       var value = getField(item, 'value');
-      var showed = isShowed(value, level);
+      var showed = show && isShowed(value, level);
       var selected = parentSelected && isSelected(value, level);
       var children = getField(item, 'children');
       var Item = function Item() {
@@ -74,7 +75,8 @@ export default function ($props, $blocks, $__proto__) {
   var _this$filterable = this.filterable,
     filter = _filterInstanceProperty(_this$filterable),
     keywords = _this$filterable.keywords.value,
-    selectByFilter = _this$filterable.selectByFilter;
+    selectByFilter = _this$filterable.selectByFilter,
+    isSelectedItem = _this$filterable.isSelectedItem;
   return _$su.call($this, {
     'className': _$cn(k + "-cascader")
   }, function ($blocks) {
@@ -93,9 +95,12 @@ export default function ($props, $blocks, $__proto__) {
           var items = filter();
           if (!items.length) return _$ce(2, 'div', _$('无匹配数据'), 0, _$cn(k + "-cascader-empty"));
           return _$ma(items, function ($value, $key) {
+            var _$cn4;
             return _$cc(DropdownItem, {
               'ev-select': selectByFilter.bind(null, $value),
               'disabled': $value.disabled,
+              'hideOnSelect': !multiple,
+              'className': _$cn((_$cn4 = {}, _$cn4[k + "-selected"] = isSelectedItem($value), _$cn4)),
               'children': function () {
                 // highlight keywords
                 var label = _mapInstanceProperty($value).call($value, function (item) {

package/es/components/cascader/styles.js

@@ -43,5 +43,5 @@ export var makeMenuStyles = cache(function makeMenuStyles(k) {
   return /*#__PURE__*/css("min-width:", cascader.width, "!important;height:", cascader.height, ";overflow:auto;.", k, "-cascader-arrow{float:right;height:100%;margin-left:", cascader.arrowGap, ";line-height:inherit;}.", k, "-cascader-loading{display:block;text-align:center;margin-top:", cascader.loadingGap, ";}.", k, "-cascader-empty{padding:", cascader.empty.padding, ";color:", cascader.empty.color, ";text-align:center;}.", k, "-cascader-option{&.", k, "-selected{color:", cascader.selectedColor, ";}&.", k, "-active{background:", cascader.activeBgColor, ";}}");
 });
 export var makeFilterMenuStyles = cache(function makeFilterMenuStyles(k) {
-  return /*#__PURE__*/css("min-width:", _filterInstanceProperty(cascader).minWidth, "!important;height:auto;max-height:", _filterInstanceProperty(cascader).maxHeight, ";em{font-style:normal;color:", _filterInstanceProperty(cascader).highlightColor, ";}");
+  return /*#__PURE__*/css("min-width:", _filterInstanceProperty(cascader).minWidth, "!important;height:auto;max-height:", _filterInstanceProperty(cascader).maxHeight, ";em{font-style:normal;color:", _filterInstanceProperty(cascader).highlightColor, ";}.", k, "-dropdown-item.", k, "-selected{color:", cascader.selectedColor, ";}");
 });

package/es/components/cascader/useFilterable.d.ts

@@ -2,8 +2,9 @@ import type { CascaderData } from './';
 import { State } from '../../hooks/useState';
 import type { Value } from './useValue';
 import type { useFields } from './useFields';
-export declare function useFilterable(keywords: State<string>, setValue: (value: Value) => void, getField: ReturnType<typeof useFields>): {
+export declare function useFilterable(keywords: State<string>, setValue: (value: Value) => void, getField: ReturnType<typeof useFields>, values: State<Value[]>): {
     filter: () => CascaderData<any>[][];
     selectByFilter: (data: CascaderData<any>[]) => void;
     keywords: State<string>;
+    isSelectedItem: (data: CascaderData<any>[]) => boolean;
 };

package/es/components/cascader/useFilterable.js

@@ -1,9 +1,11 @@
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js/instance/filter";
 import _includesInstanceProperty from "@babel/runtime-corejs3/core-js/instance/includes";
 import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/slice";
+import _findInstanceProperty from "@babel/runtime-corejs3/core-js/instance/find";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
 import { useInstance } from 'intact';
-export function useFilterable(keywords, setValue, getField) {
+import { isEqualArray } from '../utils';
+export function useFilterable(keywords, setValue, getField, values) {
   var instance = useInstance();
   function filter() {
     var ret = [];
@@ -44,14 +46,23 @@ export function useFilterable(keywords, setValue, getField) {
     return ret;
   }
   function selectByFilter(data) {
-    var value = _mapInstanceProperty(data).call(data, function (item) {
+    setValue(getValue(data));
+  }
+  function isSelectedItem(data) {
+    var _context2;
+    return !!_findInstanceProperty(_context2 = values.value).call(_context2, function (value) {
+      return isEqualArray(value, getValue(data));
+    });
+  }
+  function getValue(data) {
+    return _mapInstanceProperty(data).call(data, function (item) {
       return getField(item, 'value');
     });
-    setValue(value);
   }
   return {
     filter: filter,
     selectByFilter: selectByFilter,
-    keywords: keywords
+    keywords: keywords,
+    isSelectedItem: isSelectedItem
   };
 }

package/es/components/config/index.d.ts

@@ -2,11 +2,13 @@ import { ProviderProps } from '../context';
 import { Component } from 'intact';
 export interface ConfigProps {
     classNamePrefix?: string;
+    disableWave?: boolean;
 }
 declare const ConfigConsumer: import("intact").ComponentConstructor<Component<import("../context").ConsumerProps<ConfigProps>, {}, {}, {}>>;
 declare function useConfigContext(): {
     cls: (name: string) => string;
     readonly k: string;
+    readonly disableWave: boolean;
 };
 /**
  * for vue/react type checking

package/es/components/config/index.js

@@ -12,6 +12,9 @@ function useConfigContext() {
     },
     get k() {
       return config.value.classNamePrefix || 'k';
+    },
+    get disableWave() {
+      return config.value.disableWave || false;
     }
   };
 }

package/es/components/datepicker/index.d.ts

@@ -4,6 +4,7 @@ import { State } from '../../hooks/useState';
 import { Shortcut } from './shortcuts';
 import { BasePicker, BasePickerProps, BasePickerEvents, BasePickerBlocks, Value } from './basepicker';
 export * as shortcuts from './shortcuts';
+export { dayjs };
 export interface DatepickerProps<V extends Value = Value, M extends boolean = boolean, R extends boolean = boolean> extends BasePickerProps<V extends string ? V : V | string, M, R> {
     type?: 'date' | 'datetime' | 'year' | 'month';
     shortcuts?: Shortcut[];

package/es/components/datepicker/index.js

@@ -5,6 +5,7 @@ import { __decorate } from "tslib";
 import { provide } from 'intact';
 import template from './index.vdt';
 import { DATEPICKER } from './constants';
+import dayjs from './dayjs';
 import { useValue } from './useValue';
 import { isNullOrUndefined } from 'intact-shared';
 import { _$ } from '../../i18n';
@@ -17,6 +18,7 @@ import { useKeyboards } from './useKeyboards';
 import { BasePicker } from './basepicker';
 import * as _shortcuts from './shortcuts';
 export { _shortcuts as shortcuts };
+export { dayjs };
 var typeDefs = _extends({}, BasePicker.typeDefs, {
   type: ['date', 'datetime', 'year', 'month'],
   shortcuts: Array

package/es/components/dialog/base.d.ts

@@ -52,6 +52,7 @@ export declare class BaseDialog<T extends BaseDialogProps = BaseDialogProps, E e
     protected config: {
         cls: (name: string) => string;
         readonly k: string;
+        readonly disableWave: boolean;
     };
     init(): void;
     show(props?: T): void;

package/es/components/divider/index.d.ts

@@ -0,0 +1,14 @@
+import { Component, TypeDefs } from 'intact';
+export interface DividerProps {
+    borderType?: 'solid' | 'dashed' | 'dotted' | 'double';
+    position?: 'left' | 'right' | 'center';
+    type?: 'vertical' | 'horizontal';
+    theme?: 'light' | 'dark';
+    margin?: 'large' | 'default' | 'small' | 'none' | number;
+}
+export declare class Divider extends Component<DividerProps> {
+    static template: string | import("intact").Template<any>;
+    static typeDefs: Required<TypeDefs<DividerProps>>;
+    static defaults: () => Partial<DividerProps>;
+    private config;
+}

package/es/components/divider/index.js

@@ -0,0 +1,38 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import { Component } from 'intact';
+import template from './index.vdt';
+import { useConfigContext } from '../config';
+var typeDefs = {
+  borderType: ['solid', 'dashed', 'dotted', 'double'],
+  position: ['left', 'right', 'center'],
+  type: ['vertical', 'horizontal'],
+  theme: ['light', 'dark'],
+  margin: ['large', 'default', 'small', 'none', Number]
+};
+var defaults = function defaults() {
+  return {
+    borderType: 'solid',
+    position: 'center',
+    type: 'horizontal',
+    theme: 'light',
+    margin: 'default'
+  };
+};
+export var Divider = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(Divider, _Component);
+  function Divider() {
+    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.config = useConfigContext();
+    return _this;
+  }
+  return Divider;
+}(Component);
+Divider.template = template;
+Divider.typeDefs = typeDefs;
+Divider.defaults = defaults;

package/es/components/divider/index.spec.d.ts

@@ -0,0 +1 @@
+

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

@@ -0,0 +1 @@
+"use strict";

package/es/components/divider/index.vdt.js

@@ -0,0 +1,31 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import { createVNode as _$cv, className as _$cn, createElementVNode as _$ce } from 'intact';
+import { makeStyles } from './styles';
+import { getRestProps, addStyle } from '../utils';
+export default function ($props, $blocks, $__proto__) {
+  var _classNameObj;
+  $blocks || ($blocks = {});
+  $props || ($props = {});
+  var $this = this;
+  var _this$get = this.get(),
+    children = _this$get.children,
+    className = _this$get.className,
+    borderType = _this$get.borderType,
+    position = _this$get.position,
+    type = _this$get.type,
+    theme = _this$get.theme,
+    margin = _this$get.margin,
+    style = _this$get.style;
+  var k = this.config.k;
+  var _style = {};
+  if (typeof margin === 'number') {
+    var _margin = type === 'vertical' ? "0 " + margin + "px" : margin + "px 0";
+    _style.margin = _margin;
+  }
+  var classNameObj = (_classNameObj = {}, _classNameObj[k + "-divider"] = true, _classNameObj[k + "-" + (theme === 'dark' ? 'dark' : 'light')] = theme, _classNameObj[k + "-" + type] = type, _classNameObj[k + "-" + margin] = margin && typeof margin !== 'number', _classNameObj[k + "-with-text"] = children && type === 'horizontal', _classNameObj[k + "-" + position] = position !== 'center', _classNameObj[makeStyles(k, borderType)] = true, _classNameObj[className] = className, _classNameObj);
+  return _$cv('div', _extends({}, getRestProps(this), {
+    'className': _$cn(classNameObj),
+    'style': addStyle(style, _style)
+  }), children && type === 'horizontal' ? _$ce(2, 'div', children, 0, _$cn(k + "-divider-text")) : undefined);
+}
+;

package/es/components/divider/styles.d.ts

@@ -0,0 +1,5 @@
+import '../../styles/global';
+export declare const makeStyles: {
+    (k: string, borderType: string): string;
+    clearCache(): {};
+};

package/es/components/divider/styles.js

@@ -0,0 +1,35 @@
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
+import { css } from '@emotion/css';
+import { theme, setDefault } from '../../styles/theme';
+import { deepDefaults } from '../../styles/utils';
+import '../../styles/global';
+import { cache } from '../utils';
+var sizes = ['large', 'default', 'small'];
+var defaults = {
+  positionOffset: '5%',
+  get borderColor() {
+    return theme.color.darkBorder;
+  },
+  light: {
+    get borderColor() {
+      return theme.color.disabledBg;
+    }
+  },
+  large: {
+    get margin() {
+      return theme.large.padding;
+    }
+  }
+};
+var divider;
+setDefault(function () {
+  divider = deepDefaults(theme, {
+    divider: defaults
+  }).divider;
+  makeStyles == null || makeStyles.clearCache();
+});
+export var makeStyles = cache(function makeStyles(k, borderType) {
+  return /*#__PURE__*/css("&.", k, "-divider{padding:0;border-top:1px ", borderType, " ", divider.borderColor, ";}&.", k, "-light{border-top-color:", divider.light.borderColor, ";&.", k, "-with-text{&::before,&::after{border-top-color:", divider.light.borderColor, ";}}&.", k, "-vertical{border-right-color:", divider.light.borderColor, ";}}&.", k, "-vertical{border-top:0;display:inline-block;height:100%;border-right:1px solid ", divider.borderColor, ";vertical-align:middle;}&.", k, "-horizontal{width:100%;min-width:100%;}&.", k, "-with-text{border-top:0;display:flex;align-items:center;white-space:nowrap;text-align:center;&::before,&::after{width:50%;content:'';transform:translateY(50%);border-top:1px solid ", divider.borderColor, ";}}.", k, "-divider-text{padding:0 16px;}&.", k, "-left{&::before{width:", divider.positionOffset, ";}&::after{width:calc(100% - ", divider.positionOffset, ");}}&.", k, "-right{&::before{width:calc(100% - ", divider.positionOffset, ");}&::after{width:", divider.positionOffset, ";}}", _mapInstanceProperty(sizes).call(sizes, function (size) {
+    return /*#__PURE__*/css("&.", k, "-", size, "{margin:", theme[size].margin, " 0;&.", k, "-vertical{margin:0 ", theme[size].margin, ";}}");
+  }), ";");
+});

package/es/components/dropdown/dropdown.js

@@ -177,8 +177,8 @@ Dropdown.template = function () {
   if (this.$isVue || this.$isVueNext) {
     if (Array.isArray(children)) {
       children = _filterInstanceProperty(children).call(children, function (child) {
-        return child !== ' ';
-      });
+        return child !== ' ' && child;
+      } /* comment is null in vue3 */);
     }
   }
   if (process.env.NODE_ENV !== 'production') {

package/es/components/dropdown/menu.js

@@ -75,7 +75,7 @@ function useKeyboardForDropdownMenu(dropdown) {
     return focusByIndex(0);
   };
   // In Cascader the menu may have been replaced by another menu, in this case,
-  // if the dropdown has showed while we mounted the menu, add keydown listener
+  // if the dropdown has showed while we mounted the menu, add the keydown listener
   if (dropdown.get('value')) {
     onShow();
   }

package/es/components/ellipsis/index.d.ts

@@ -0,0 +1,16 @@
+import { Component, TypeDefs } from 'intact';
+import { Options } from '../position';
+export type Position = Options;
+export interface EllipsisProps {
+    maxLines?: number;
+    disabled?: boolean;
+    position?: Position | 'left' | 'bottom' | 'right' | 'top';
+    theme?: 'light' | 'dark';
+}
+export declare class Ellipsis extends Component<EllipsisProps> {
+    static template: string | import("intact").Template<any>;
+    static typeDefs: Required<TypeDefs<EllipsisProps>>;
+    static defaults: () => Partial<EllipsisProps>;
+    private ellipsis;
+    private config;
+}

package/es/components/ellipsis/index.js

@@ -0,0 +1,36 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import { Component } from 'intact';
+import template from './index.vdt';
+import { useEllipsis } from './useEllipsis';
+import { useConfigContext } from '../config';
+var typeDefs = {
+  maxLines: Number,
+  disabled: Boolean,
+  position: [Object, 'left', 'bottom', 'right', 'top'],
+  theme: ['light', 'dark']
+};
+var defaults = function defaults() {
+  return {
+    disabled: false,
+    theme: 'light'
+  };
+};
+export var Ellipsis = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(Ellipsis, _Component);
+  function Ellipsis() {
+    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.ellipsis = useEllipsis();
+    _this.config = useConfigContext();
+    return _this;
+  }
+  return Ellipsis;
+}(Component);
+Ellipsis.template = template;
+Ellipsis.typeDefs = typeDefs;
+Ellipsis.defaults = defaults;

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

@@ -0,0 +1,94 @@
+import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
+import BasicDemo from '~/components/ellipsis/demos/basic';
+import { mount, unmount, dispatchEvent, getElement, wait } from '../../test/utils';
+describe('Ellipsis', function () {
+  afterEach(function () {
+    return unmount();
+  });
+  it('should support drag Ellipsis', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var _mount, instance, element, _element$querySelecto, ellipsis1, ellipsis2, dragLine, children1, content1, children2, content2;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _mount = mount(BasicDemo), instance = _mount[0], element = _mount[1];
+          _element$querySelecto = element.querySelectorAll('.k-ellipsis'), ellipsis1 = _element$querySelecto[0], ellipsis2 = _element$querySelecto[1];
+          dragLine = element.querySelector('.k-split-line-wrapper'); // There is no tooltip content by default
+          expect(getElement('.k-tooltip-content')).to.be.undefined;
+          // mouse move
+          dispatchEvent(dragLine, 'mousedown', {
+            which: 1,
+            clientX: 200,
+            clientY: 0
+          });
+          dispatchEvent(document, 'mousemove', {
+            clientX: 100,
+            clientY: 0
+          });
+          dispatchEvent(dragLine, 'mouseup');
+          _context.next = 9;
+          return wait(200);
+        case 9:
+          expect(element.outerHTML).to.matchSnapshot();
+          // mouseenter ellipsis dom
+          children1 = ellipsis1.firstElementChild;
+          dispatchEvent(children1, 'mouseenter');
+          _context.next = 14;
+          return wait(0);
+        case 14:
+          expect(children1.classList.contains('k-dropdown-open')).to.be.true;
+          content1 = getElement('.k-tooltip-content');
+          expect(content1.textContent).eql('测试测试测试测试测试测试');
+          children2 = ellipsis2.firstElementChild;
+          dispatchEvent(children2, 'mouseenter');
+          _context.next = 21;
+          return wait(0);
+        case 21:
+          content2 = getElement('.k-tooltip-content');
+          expect(content2.textContent).eql('最大几行忽略最大几行忽略最大几行忽略');
+        case 23:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  })));
+  it('should disabled tooltip', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+    var _mount2, instance, element, ellipsis3, dragLine, children3;
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _mount2 = mount(BasicDemo), instance = _mount2[0], element = _mount2[1];
+          ellipsis3 = element.querySelectorAll('.k-ellipsis')[2];
+          dragLine = element.querySelector('.k-split-line-wrapper');
+          dispatchEvent(dragLine, 'mousedown', {
+            which: 1,
+            clientX: 200,
+            clientY: 0
+          });
+          dispatchEvent(document, 'mousemove', {
+            clientX: 300,
+            clientY: 0
+          });
+          dispatchEvent(dragLine, 'mouseup');
+          _context2.next = 8;
+          return wait(200);
+        case 8:
+          // disabled close tooltip
+          expect(ellipsis3.firstElementChild.classList.contains('k-dropdown-open')).to.be.false;
+          instance.set('disabled', false);
+          _context2.next = 12;
+          return wait();
+        case 12:
+          children3 = ellipsis3.firstElementChild;
+          dispatchEvent(children3, 'mouseenter');
+          _context2.next = 16;
+          return wait();
+        case 16:
+          expect(children3.classList.contains('k-dropdown-open')).to.be.true;
+        case 17:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2);
+  })));
+});

package/es/components/ellipsis/index.vdt.js

@@ -0,0 +1,50 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import { createElementVNode as _$ce, className as _$cn, createVNode as _$cv, createUnknownComponentVNode as _$cc, extend as _$ex, EMPTY_OBJ as _$em } from 'intact';
+import { makeStyles } from './styles';
+import { Tooltip } from '../tooltip';
+import { getRestProps, addStyle } from '../utils';
+export default function ($props, $blocks, $__proto__) {
+  var _$cn2, _$cn3;
+  $blocks || ($blocks = {});
+  $props || ($props = {});
+  var $this = this;
+  var _this$get = this.get(),
+    children = _this$get.children,
+    className = _this$get.className,
+    maxLines = _this$get.maxLines,
+    disabled = _this$get.disabled,
+    position = _this$get.position,
+    theme = _this$get.theme,
+    style = _this$get.style;
+  var k = this.config.k;
+  var _this$ellipsis = this.ellipsis,
+    showTooltip = _this$ellipsis.showTooltip,
+    ellipsisRef = _this$ellipsis.ellipsisRef;
+  var tooltip = showTooltip.value && !disabled;
+  var wrapper = _$ce(2, 'div', children, 0, _$cn((_$cn2 = {
+    'c-ellipsis': true
+  }, _$cn2[k + "-ellipsis-wrapper"] = true, _$cn2[className] = className && !tooltip, _$cn2)));
+  return _$cv('div', _extends({}, getRestProps(this), {
+    'className': _$cn((_$cn3 = {}, _$cn3[k + "-ellipsis"] = true, _$cn3[k + "-multiline"] = maxLines, _$cn3[makeStyles(k, maxLines)] = true, _$cn3)),
+    'ref': ellipsisRef
+  }), tooltip ? _$cc(Tooltip, {
+    'position': position,
+    'theme': theme,
+    'className': _$cn(className),
+    'children': wrapper,
+    '$blocks': function ($blocks) {
+      var _$blocks = {},
+        __$blocks = _$ex({}, $blocks);
+      return (_$blocks['content'] = function ($super) {
+        return children;
+      }, __$blocks['content'] = function ($super, data) {
+        var block = $blocks['content'];
+        var callBlock = function callBlock() {
+          return _$blocks['content'].call($this, $super, data);
+        };
+        return block ? block.call($this, callBlock, data) : callBlock();
+      }), __$blocks;
+    }.call($this, _$em)
+  }) : wrapper);
+}
+;

package/es/components/ellipsis/styles.d.ts

@@ -0,0 +1,5 @@
+import '../../styles/global';
+export declare const makeStyles: {
+    (k: string, maxLines: number): string;
+    clearCache(): {};
+};

package/es/components/ellipsis/styles.js

@@ -0,0 +1,10 @@
+import { css } from '@emotion/css';
+import { setDefault } from '../../styles/theme';
+import '../../styles/global';
+import { cache } from '../utils';
+setDefault(function () {
+  makeStyles == null || makeStyles.clearCache();
+});
+export var makeStyles = cache(function makeStyles(k, maxLines) {
+  return /*#__PURE__*/css("width:100%;&.", k, "-multiline{.k-ellipsis-wrapper{white-space:normal;display:-webkit-box;-webkit-line-clamp:", maxLines, ";-webkit-box-orient:vertical;}}");
+});

package/es/components/ellipsis/useEllipsis.d.ts

@@ -0,0 +1,4 @@
+export declare function useEllipsis(): {
+    ellipsisRef: import("intact").RefObject<HTMLDivElement>;
+    showTooltip: import("../../hooks/useState").State<boolean>;
+};