@king-design/react 2.0.0-beta.0

package/components/tree/index.spec.js

@@ -0,0 +1,428 @@
+import _asyncToGenerator from "@babel/runtime-corejs3/helpers/asyncToGenerator";
+import _JSON$stringify from "@babel/runtime-corejs3/core-js/json/stringify";
+import _regeneratorRuntime from "@babel/runtime-corejs3/regenerator";
+import BasicDemo from '~/components/tree/demos/basic';
+import CheckboxDemo from '~/components/tree/demos/checkbox';
+import LoadingDemo from '~/components/tree/demos/loading';
+import CustomDemo from '~/components/tree/demos/custom';
+import FilterableDemo from '~/components/tree/demos/filterable';
+import SelectDemo from '~/components/tree/demos/select';
+import DraggableDemo from '~/components/tree/demos/draggable';
+import { mount, unmount, dispatchEvent, wait } from '../../test/utils';
+import { RANGE } from './useDraggable';
+describe('Tree', function () {
+  afterEach(function () {
+    return unmount();
+  });
+  it('expand and shrink', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var _mount, instance, element, _element$querySelecto, icon1, icon2;
+
+    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-icon'), icon1 = _element$querySelecto[1], icon2 = _element$querySelecto[2];
+            icon2.click();
+            _context.next = 5;
+            return wait(300);
+
+          case 5:
+            expect(element.outerHTML).to.matchSnapshot();
+            icon1.click();
+            _context.next = 9;
+            return wait(300);
+
+          case 9:
+            expect(element.outerHTML).to.matchSnapshot();
+            icon1.click();
+            _context.next = 13;
+            return wait(300);
+
+          case 13:
+            expect(element.outerHTML).to.matchSnapshot();
+
+          case 14:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  })));
+  it('checkbox', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+    var _mount2, instance, element, tree, _element$querySelecto2, checkbox1, checkbox2, data1, _element$querySelecto3, firstIcon, icon, _element$querySelecto4, icon1, data2, _element$querySelecto5, checkbox3, checkbox4;
+
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            _mount2 = mount(CheckboxDemo), instance = _mount2[0], element = _mount2[1];
+            tree = instance.refs.tree;
+            expect(_JSON$stringify(tree.getCheckedData())).to.matchSnapshot();
+            _element$querySelecto2 = element.querySelectorAll('.k-checkbox'), checkbox1 = _element$querySelecto2[0], checkbox2 = _element$querySelecto2[1];
+            checkbox2.click();
+            _context2.next = 7;
+            return wait();
+
+          case 7:
+            expect(element.outerHTML).to.matchSnapshot();
+            data1 = tree.getCheckedData();
+            expect(data1.length).to.eql(4);
+            expect(_JSON$stringify(data1)).to.matchSnapshot();
+            _element$querySelecto3 = element.querySelectorAll('.k-icon'), firstIcon = _element$querySelecto3[0], icon = _element$querySelecto3[1]; // expand
+
+            icon.click();
+            _context2.next = 15;
+            return wait();
+
+          case 15:
+            _element$querySelecto4 = element.querySelectorAll('.k-icon'), icon1 = _element$querySelecto4[2]; // expand
+
+            icon1.click();
+            _context2.next = 19;
+            return wait(300);
+
+          case 19:
+            expect(element.outerHTML).to.matchSnapshot();
+            data2 = tree.getCheckedData(true);
+            expect(data2.length).to.eql(2);
+            expect(_JSON$stringify(data2)).to.matchSnapshot(); // uncheck a leaf checkbox
+
+            _element$querySelecto5 = element.querySelectorAll('.k-checkbox'), checkbox3 = _element$querySelecto5[2], checkbox4 = _element$querySelecto5[3];
+            checkbox4.click();
+            _context2.next = 27;
+            return wait();
+
+          case 27:
+            expect(element.outerHTML).to.matchSnapshot();
+            checkbox4.click();
+            _context2.next = 31;
+            return wait();
+
+          case 31:
+            expect(element.outerHTML).to.matchSnapshot();
+            checkbox3.click();
+            _context2.next = 35;
+            return wait();
+
+          case 35:
+            expect(element.outerHTML).to.matchSnapshot();
+
+          case 36:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2);
+  })));
+  it('async load', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
+    var _mount3, instance, element, icon, _element$querySelecto6, icon1, checkbox, _element$querySelecto7, icon2;
+
+    return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+      while (1) {
+        switch (_context3.prev = _context3.next) {
+          case 0:
+            this.timeout(0);
+            _mount3 = mount(LoadingDemo), instance = _mount3[0], element = _mount3[1];
+            icon = element.querySelector('.k-icon');
+            icon.click();
+            _context3.next = 6;
+            return wait();
+
+          case 6:
+            expect(element.outerHTML).to.matchSnapshot();
+            _context3.next = 9;
+            return wait(500);
+
+          case 9:
+            _element$querySelecto6 = element.querySelectorAll('.k-icon'), icon1 = _element$querySelecto6[1];
+            icon1.click();
+            _context3.next = 13;
+            return wait();
+
+          case 13:
+            expect(element.outerHTML).to.matchSnapshot(); // loaded
+
+            _context3.next = 16;
+            return wait(1500);
+
+          case 16:
+            expect(element.outerHTML).to.matchSnapshot(); // check
+
+            checkbox = element.querySelector('.k-checkbox');
+            checkbox.click();
+            _context3.next = 21;
+            return wait();
+
+          case 21:
+            _element$querySelecto7 = element.querySelectorAll('.k-icon'), icon2 = _element$querySelecto7[2];
+            icon2.click();
+            _context3.next = 25;
+            return wait(1500);
+
+          case 25:
+            expect(element.outerHTML).to.matchSnapshot();
+
+          case 26:
+          case "end":
+            return _context3.stop();
+        }
+      }
+    }, _callee3, this);
+  })));
+  it('append and remove node', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
+    var _mount4, instance, element, _element$querySelecto8, btn1, btn2, _element$querySelecto9, checkbox, _element$querySelecto10, btn3, _element$querySelecto11, checkbox1;
+
+    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+      while (1) {
+        switch (_context4.prev = _context4.next) {
+          case 0:
+            this.timeout(0);
+            _mount4 = mount(CustomDemo), instance = _mount4[0], element = _mount4[1];
+            _element$querySelecto8 = element.querySelectorAll('.k-btn'), btn1 = _element$querySelecto8[0], btn2 = _element$querySelecto8[1];
+            btn1.click();
+            _context4.next = 6;
+            return wait(300);
+
+          case 6:
+            expect(element.outerHTML).to.matchSnapshot();
+            expect(instance.get('data')).to.have.length(3);
+            expect(instance.get('data')).to.matchSnapshot();
+            btn2.click();
+            _context4.next = 12;
+            return wait(300);
+
+          case 12:
+            expect(element.outerHTML).to.matchSnapshot();
+            _element$querySelecto9 = element.querySelectorAll('.k-checkbox'), checkbox = _element$querySelecto9[1];
+            checkbox.click();
+            _context4.next = 17;
+            return wait();
+
+          case 17:
+            _element$querySelecto10 = element.querySelectorAll('.k-btn'), btn3 = _element$querySelecto10[3];
+            btn3.click();
+            _context4.next = 21;
+            return wait(300);
+
+          case 21:
+            expect(element.outerHTML).to.matchSnapshot(); // uncheck and remove
+
+            _element$querySelecto11 = element.querySelectorAll('.k-checkbox'), checkbox1 = _element$querySelecto11[2];
+            checkbox1.click();
+            _context4.next = 26;
+            return wait();
+
+          case 26:
+            checkbox1.parentNode.querySelector('.k-btn:nth-child(2)').click();
+            _context4.next = 29;
+            return wait(300);
+
+          case 29:
+            expect(element.outerHTML).to.matchSnapshot();
+            expect(instance.get('data')).to.matchSnapshot();
+
+          case 31:
+          case "end":
+            return _context4.stop();
+        }
+      }
+    }, _callee4, this);
+  })));
+  it('filterable', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5() {
+    var _mount5, instance, element;
+
+    return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+      while (1) {
+        switch (_context5.prev = _context5.next) {
+          case 0:
+            _mount5 = mount(FilterableDemo), instance = _mount5[0], element = _mount5[1];
+            instance.set('keywords', 'First');
+            _context5.next = 4;
+            return wait(500);
+
+          case 4:
+            expect(element.outerHTML).to.matchSnapshot();
+            instance.set('keywords', '2.1.1');
+            _context5.next = 8;
+            return wait(500);
+
+          case 8:
+            expect(element.outerHTML).to.matchSnapshot();
+
+          case 9:
+          case "end":
+            return _context5.stop();
+        }
+      }
+    }, _callee5);
+  })));
+  it('select', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6() {
+    var _mount6, instance, element, tree, _element$querySelecto12, text1, text2, disabledText;
+
+    return _regeneratorRuntime.wrap(function _callee6$(_context6) {
+      while (1) {
+        switch (_context6.prev = _context6.next) {
+          case 0:
+            _mount6 = mount(SelectDemo), instance = _mount6[0], element = _mount6[1];
+            tree = instance.refs.tree;
+            expect(tree.getSelectedData().length).to.eql(1);
+            _element$querySelecto12 = element.querySelectorAll('.k-tree-text'), text1 = _element$querySelecto12[2], text2 = _element$querySelecto12[3], disabledText = _element$querySelecto12[5];
+            text1.click();
+            _context6.next = 7;
+            return wait();
+
+          case 7:
+            expect(tree.getSelectedData().length).to.eql(2);
+            text1.click();
+            text2.click();
+            _context6.next = 12;
+            return wait();
+
+          case 12:
+            expect(tree.getSelectedData().length).to.eql(0);
+            disabledText.click();
+            _context6.next = 16;
+            return wait();
+
+          case 16:
+            expect(tree.getSelectedData().length).to.eql(0); // disable select and click on disabled selectable text should expand the tree
+
+            tree.set('selectable', false);
+            text1.click();
+            _context6.next = 21;
+            return wait(300);
+
+          case 21:
+            expect(tree.getSelectedData().length).to.eql(0);
+            expect(element.outerHTML).to.matchSnapshot();
+
+          case 23:
+          case "end":
+            return _context6.stop();
+        }
+      }
+    }, _callee6);
+  })));
+  it('draggable', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee7() {
+    var onDenyDrag, onDenyDrop, onDragEnd, _mount7, instance, element, disabled, nodes, notAllowed;
+
+    return _regeneratorRuntime.wrap(function _callee7$(_context7) {
+      while (1) {
+        switch (_context7.prev = _context7.next) {
+          case 0:
+            this.timeout(0);
+            onDenyDrag = sinon.spy();
+            onDenyDrop = sinon.spy();
+            onDragEnd = sinon.spy();
+            DraggableDemo.prototype.onDenyDrag = onDenyDrag;
+            DraggableDemo.prototype.onDenyDrop = onDenyDrop;
+            DraggableDemo.prototype.onDragEnd = onDragEnd;
+            _mount7 = mount(DraggableDemo), instance = _mount7[0], element = _mount7[1];
+            instance.set('expandedKeys', ['2', '2-1', '1', '1-1']);
+            _context7.next = 11;
+            return wait(300);
+
+          case 11:
+            // can not drag disabled item
+            disabled = element.querySelector('.k-disabled'); // dispatchEvent(disabled, 'mousedown');
+
+            dispatchEvent(disabled, 'dragstart');
+            expect(onDenyDrag.callCount).to.eql(1);
+            nodes = element.querySelectorAll('.k-tree-label'); // can not drag not-allowed item
+
+            notAllowed = nodes[2]; // dispatchEvent(notAllowed, 'mousedown');
+
+            dispatchEvent(notAllowed, 'dragstart');
+            expect(onDenyDrag.callCount).to.eql(2); // drag insert
+
+            return _context7.abrupt("return", dragInsert(nodes[6], nodes[6]).then(function () {
+              // drag to self will do nothing
+              expect(element.innerHTML).to.matchSnapshot();
+              expect(onDragEnd.callCount).to.eql(0);
+              return dragInsert(nodes[6], notAllowed);
+            }).then(function () {
+              // drag to not-allowed item will do nothing
+              expect(element.innerHTML).to.matchSnapshot();
+              expect(onDragEnd.callCount).to.eql(0);
+              return dragInsert(nodes[6], disabled);
+            }).then(function () {
+              // drag to disabled item will do nothing
+              expect(element.innerHTML).to.matchSnapshot();
+              expect(onDragEnd.callCount).to.eql(0);
+              return dragInsert(nodes[6], nodes[5], 'before');
+            }).then(function () {
+              expect(element.innerHTML).to.matchSnapshot();
+              expect(onDragEnd.callCount).to.eql(1);
+              expect(instance.get('data')).to.matchSnapshot();
+              return dragInsert(nodes[6], nodes[5], 'after');
+            }).then(function () {
+              expect(element.innerHTML).to.matchSnapshot();
+              expect(instance.get('data')).to.matchSnapshot();
+              return dragInsert(nodes[6], nodes[5]);
+            }).then(function () {
+              expect(element.innerHTML).to.matchSnapshot();
+              expect(instance.get('data')).to.matchSnapshot();
+            }));
+
+          case 19:
+          case "end":
+            return _context7.stop();
+        }
+      }
+    }, _callee7, this);
+  })));
+});
+
+function dragInsert(_x, _x2, _x3) {
+  return _dragInsert.apply(this, arguments);
+}
+
+function _dragInsert() {
+  _dragInsert = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee8(srcElement, toElement, mode) {
+    var _toElement$getBoundin, top, bottom, height, des;
+
+    return _regeneratorRuntime.wrap(function _callee8$(_context8) {
+      while (1) {
+        switch (_context8.prev = _context8.next) {
+          case 0:
+            // dispatchEvent(srcElement, 'mousedown');
+            dispatchEvent(srcElement, 'dragstart', {
+              dataTransfer: new DataTransfer()
+            });
+            _toElement$getBoundin = toElement.getBoundingClientRect(), top = _toElement$getBoundin.top, bottom = _toElement$getBoundin.bottom, height = _toElement$getBoundin.height;
+            des = height * RANGE;
+
+            if (mode === 'before') {
+              dispatchEvent(toElement, 'dragover', {
+                clientY: top + des - 1
+              });
+            } else if (mode === 'after') {
+              dispatchEvent(toElement, 'dragover', {
+                clientY: bottom - des + 1
+              });
+            } else {
+              dispatchEvent(toElement, 'dragover', {
+                clientY: top + des + 1
+              });
+            }
+
+            _context8.next = 6;
+            return wait(700);
+
+          case 6:
+            dispatchEvent(toElement, 'dragend');
+            _context8.next = 9;
+            return wait(300);
+
+          case 9:
+          case "end":
+            return _context8.stop();
+        }
+      }
+    }, _callee8);
+  }));
+  return _dragInsert.apply(this, arguments);
+}
+
+export {normalize} from 'intact-react';

package/components/tree/index.vdt.js

@@ -0,0 +1,134 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
+import _filterInstanceProperty from "@babel/runtime-corejs3/core-js/instance/filter";
+import { createElementVNode as _$ce, createUnknownComponentVNode as _$cc, noop as _$no, className as _$cn, createVNode as _$cv } from 'intact-react';
+import { Transition, TransitionGroup, linkEvent } from 'intact';
+import { Checkbox } from '../checkbox';
+import { getRestProps } from '../utils';
+import { makeStyles } from './styles';
+import { Icon } from '../icon';
+import { Mode } from './useDraggable';
+var _$tmp0 = {
+  'className': 'k-tree-icon ion-load-c',
+  'rotate': true
+};
+export default function ($props, $blocks, $__proto__) {
+  var _this = this,
+      _classNameObj;
+
+  $blocks || ($blocks = {});
+  $props || ($props = {});
+  var $this = this;
+  var _$blocks = {};
+  var __$blocks = {};
+
+  var _this$get = this.get(),
+      className = _this$get.className,
+      checkbox = _this$get.checkbox,
+      showLine = _this$get.showLine,
+      selectable = _this$get.selectable,
+      draggable = _this$get.draggable;
+
+  var expandedKeys = this.expanded.get();
+  var toggleExpanded = this.expanded.toggle;
+  var toggleChecked = this.checked.toggle;
+  var selectedKeys = this.selected.get();
+  var toggleSelected = this.selected.toggle;
+  var _this$draggable = this.draggable,
+      onDragStart = _this$draggable.onDragStart,
+      onDragOver = _this$draggable.onDragOver,
+      onDragEnd = _this$draggable.onDragEnd,
+      draggingKey = _this$draggable.draggingKey,
+      overKey = _this$draggable.overKey,
+      mode = _this$draggable.mode;
+
+  var treeNodes = function treeNodes(nodes) {
+    return _mapInstanceProperty(nodes).call(nodes, function (node, index) {
+      if (!_filterInstanceProperty(node)) return;
+      var key = node.key;
+      var expanded = expandedKeys.has(key);
+      var data = node.data;
+      var disabled = data.disabled;
+      var selected = selectable && selectedKeys.has(key);
+      var classNameObj = {
+        'k-tree-node': true,
+        'k-expanded': expanded,
+        'k-disabled': disabled,
+        'k-selected': selected,
+        'k-dragging': key === draggingKey.value
+      };
+      var labelClassNameObj = {
+        'k-tree-label': true,
+        'k-tree-leaf': !node.children
+      };
+
+      if (key === overKey.value) {
+        switch (mode.value) {
+          case Mode.Before:
+            labelClassNameObj['k-before'] = true;
+            break;
+
+          case Mode.After:
+            labelClassNameObj['k-after'] = true;
+            break;
+
+          case Mode.Inner:
+            labelClassNameObj['k-inner'] = true;
+            break;
+        }
+      }
+
+      return _$ce(2, 'div', [_$ce(2, 'div', [node.children && node.loaded !== false ? _$cc(Icon, {
+        'className': 'k-tree-icon ion-android-arrow-dropdown',
+        'ev-click': function evClick(e) {
+          // it may be in dropdownMenu, e.g. TreeSelect
+          e._ignore = true;
+          toggleExpanded(node);
+        }
+      }) : undefined, node.loaded === false ? _$cc(Icon, _$tmp0) : undefined, checkbox ? _$cc(Checkbox, {
+        'value': node.checked,
+        'disabled': disabled,
+        'indeterminate': node.indeterminate,
+        'ev-$change:value': function ev$changeValue() {
+          return toggleChecked(node);
+        },
+        'className': 'k-tree-checkbox'
+      }) : undefined, _$ce(2, 'div', (_$blocks['label'] = function ($super) {
+        return data.label;
+      }, __$blocks['label'] = function ($super, data) {
+        var block = $blocks['label'];
+
+        var callBlock = function callBlock() {
+          return _$blocks['label'].call($this, $super, data);
+        };
+
+        return block ? block.call($this, callBlock, data) : callBlock();
+      }, __$blocks['label'](_$no, [data, node, index])), 0, 'k-tree-text c-ellipsis', {
+        'ev-click': linkEvent(node, _this.onClick)
+      })], 0, _$cn(labelClassNameObj)), _$cc(Transition, _extends({}, _this.transition, {
+        'children': expanded && node.children ? _$ce(2, 'div', _$cc(TransitionGroup, _extends({}, _this.transition, {
+          'children': treeNodes(node.children)
+        })), 2, 'k-tree') : undefined
+      }))], 4, _$cn(classNameObj), {
+        'draggable': draggable ? true : null,
+        'ev-dragstart': draggable && linkEvent(node, onDragStart),
+        'ev-dragover': draggable && linkEvent(node, onDragOver),
+        'ev-dragend': draggable && onDragEnd
+      }, key);
+    });
+  };
+
+  var classNameObj = (_classNameObj = {
+    'k-tree': true,
+    'k-line': showLine,
+    'k-selectable': selectable
+  }, _classNameObj[className] = className, _classNameObj[makeStyles()] = true, _classNameObj);
+  return _$cv('div', _extends({
+    'className': _$cn(classNameObj)
+  }, getRestProps(this)), _$cc(TransitionGroup, _extends({}, this.transition, {
+    'children': treeNodes(this.nodes.getNodes())
+  })));
+}
+;
+
+export {normalize} from 'intact-react';

package/components/tree/styles.d.ts

@@ -0,0 +1,5 @@
+import '../../styles/global';
+export declare function makeStyles(): string;
+
+
+export {normalize} from 'intact-react';

package/components/tree/styles.js

@@ -0,0 +1,71 @@
+import { css } from '@emotion/css';
+import { theme, setDefault } from '../../styles/theme';
+import { deepDefaults, palette } from '../../styles/utils';
+import '../../styles/global';
+var defaults = {
+  fontSize: '12px',
+  lineHeight: '24px',
+
+  get hoverColor() {
+    return theme.color.primary;
+  },
+
+  get disabledColor() {
+    return theme.color.disabled;
+  },
+
+  textPadding: "0 3px",
+  marginLeft: '10px',
+  paddingLeft: '6px',
+  iconWidth: '21px',
+
+  get iconColor() {
+    return theme.color.placeholder;
+  },
+
+  checkboxGap: "8px",
+
+  get leafIndent() {
+    return tree.iconWidth;
+  },
+
+  get borderRadius() {
+    return theme.borderRadius;
+  },
+
+  // selected
+  selected: {
+    get bgColor() {
+      return palette(theme.color.primary, -4);
+    }
+
+  },
+  // draggable
+  dragging: {
+    get border() {
+      return "1px solid " + theme.color.primary;
+    },
+
+    get bgColor() {
+      return theme.color.bg;
+    } // get bgColor() { return palette(theme.color.warning, -4) },
+
+
+  },
+
+  get line() {
+    return "1px dashed " + theme.color.border;
+  }
+
+};
+var tree;
+setDefault(function () {
+  tree = deepDefaults(theme, {
+    tree: defaults
+  }).tree;
+});
+export function makeStyles() {
+  return /*#__PURE__*/css("font-size:", tree.fontSize, ";line-height:", tree.lineHeight, ";position:relative;.k-tree-label{position:relative;display:flex;align-items:center;&.k-before,&.k-after{&:before{position:absolute;content:'';display:block;border-top:", tree.dragging.border, ";width:100%;left:0;}}&.k-before:before{top:0;}&.k-after:before{bottom:0;}&.k-inner{background:", tree.selected.bgColor, ";}}.k-tree-icon,.k-tree-text{cursor:pointer;}.k-tree-text{padding:", tree.textPadding, ";border-radius:", tree.borderRadius, ";flex:1;}.k-tree-leaf{padding-left:", tree.leafIndent, ";}.k-tree-icon{width:", tree.iconWidth, ";text-align:center;color:", tree.iconColor, ";transform:rotate(-90deg);transition:transform ", theme.transition, ";}.k-tree-checkbox{margin-right:", tree.checkboxGap, ";}&.k-selectable{.k-tree-node{&.k-selected{>.k-tree-label .k-tree-text{background:", tree.selected.bgColor, "!important;}}}}.k-tree-node{background:#fff;&:not(.k-disabled){>.k-tree-label .k-tree-text:hover{background:", theme.color.bg, ";}}&.k-expanded{>.k-tree-label .k-tree-icon{transform:rotate(0);}}&.k-disabled{>.k-tree-label{color:", tree.disabledColor, ";.k-tree-text{cursor:not-allowed;}}}&.k-dragging{background:", tree.dragging.bgColor, ";.k-tree-node{background:", tree.dragging.bgColor, ";}}}.k-tree{margin-left:", tree.marginLeft, ";padding-left:", tree.paddingLeft, ";}&.k-line .k-tree{border-left:", tree.line, ";}");
+}
+
+export {normalize} from 'intact-react';

package/components/tree/useChecked.d.ts

@@ -0,0 +1,9 @@
+import { Key } from 'intact-react';
+import type { Node, DataItem } from './useNodes';
+export declare function useChecked(getNodes: () => Node<Key>[]): {
+    toggle: (node: Node<Key>) => void;
+    getCheckedData: (leafOnly: boolean) => DataItem<Key>[];
+};
+
+
+export {normalize} from 'intact-react';