@sheinx/base 3.0.0-alpha.1 → 3.0.0-alpha.11

package/cjs/select/list-columns-option.d.ts

@@ -1,2 +1,5 @@
-export {};
+/// <reference types="react" />
+import { ListColumnsOptionProps } from './list-columns-option.type';
+declare const ListColumnsOption: <DataItem, Value>(props: ListColumnsOptionProps<DataItem, Value>) => JSX.Element;
+export default ListColumnsOption;
 //# sourceMappingURL=list-columns-option.d.ts.map

package/cjs/select/list-columns-option.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list-columns-option.d.ts","sourceRoot":"","sources":["list-columns-option.tsx"],"names":[],"mappings":""}
+{"version":3,"file":"list-columns-option.d.ts","sourceRoot":"","sources":["list-columns-option.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAIpE,QAAA,MAAM,iBAAiB,kFAuEtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/cjs/select/list-columns-option.js

@@ -1 +1,76 @@
-"use strict";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _simpleCheckbox = _interopRequireDefault(require("../checkbox/simple-checkbox"));
+var _simpleRadio = _interopRequireDefault(require("../radio/simple-radio"));
+var _jsxRuntime = require("react/jsx-runtime");
+var ListColumnsOption = function ListColumnsOption(props) {
+  var _jssStyle$select;
+  var jssStyle = props.jssStyle,
+    data = props.data,
+    datum = props.datum,
+    size = props.size,
+    multiple = props.multiple,
+    _props$columnWidth = props.columnWidth,
+    columnWidth = _props$columnWidth === void 0 ? 160 : _props$columnWidth,
+    renderItemProp = props.renderItem,
+    closePop = props.closePop;
+  var styles = jssStyle === null || jssStyle === void 0 ? void 0 : (_jssStyle$select = jssStyle.select) === null || _jssStyle$select === void 0 ? void 0 : _jssStyle$select.call(jssStyle);
+  var style = {
+    width: columnWidth
+  };
+  var isChecked = datum.check(data);
+  var isDisabled = datum.disabledCheck(data);
+  var handleChange = function handleChange() {
+    if (isDisabled) return;
+    if (isChecked) {
+      datum.remove(data);
+      return;
+    }
+    datum.add(data);
+    if (!multiple) closePop();
+  };
+  var renderCheckbox = function renderCheckbox(d) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_simpleCheckbox.default, {
+      theme: "dark",
+      className: styles.columnsCheckbox,
+      jssStyle: jssStyle,
+      size: size,
+      checked: isChecked,
+      disabled: isDisabled,
+      onChange: handleChange,
+      children: renderItemProp(d)
+    });
+  };
+  var renderRadio = function renderRadio(d) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_simpleRadio.default, {
+      theme: "dark",
+      style: {
+        height: '100%',
+        margin: 0
+      },
+      className: styles.columnsRadio,
+      jssStyle: jssStyle,
+      size: size,
+      checked: isChecked,
+      disabled: isDisabled,
+      onChange: handleChange,
+      children: renderItemProp(d)
+    });
+  };
+  var renderItem = function renderItem() {
+    if (multiple) return renderCheckbox(data);
+    return renderRadio(data);
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    style: style,
+    className: styles === null || styles === void 0 ? void 0 : styles.columnsOption,
+    children: renderItem()
+  });
+};
+var _default = ListColumnsOption;
+exports.default = _default;

package/cjs/select/list-columns-option.type.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { JssStyleType, SelectProps, DatumType } from './select.type';
+export interface ListColumnsOptionProps<DataItem, Value> extends Pick<SelectProps<DataItem, Value>, 'multiple' | 'columnWidth' | 'size'> {
+    jssStyle?: JssStyleType;
+    data: DataItem;
+    datum: DatumType<DataItem, Value>;
+    renderItem: (data: DataItem, index?: number) => React.ReactNode;
+    closePop: () => void;
+}
+//# sourceMappingURL=list-columns-option.type.d.ts.map

package/cjs/select/list-columns-option.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"list-columns-option.type.d.ts","sourceRoot":"","sources":["list-columns-option.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAErE,MAAM,WAAW,sBAAsB,CAAC,QAAQ,EAAE,KAAK,CACrD,SAAQ,IAAI,CAAC,WAAW,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,UAAU,GAAG,aAAa,GAAG,MAAM,CAAC;IAC/E,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,SAAS,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IAClC,UAAU,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IAChE,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB"}

package/cjs/select/list-columns-option.type.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/cjs/select/list-columns.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
-declare const ColumnsList: () => JSX.Element;
+import { BaseListProps } from './select.type';
+declare const ColumnsList: <DataItem, Value>(props: BaseListProps<DataItem, Value>) => JSX.Element;
 export default ColumnsList;
 //# sourceMappingURL=list-columns.d.ts.map

package/cjs/select/list-columns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list-columns.d.ts","sourceRoot":"","sources":["list-columns.tsx"],"names":[],"mappings":";AAEA,QAAA,MAAM,WAAW,mBAEhB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"list-columns.d.ts","sourceRoot":"","sources":["list-columns.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAI9C,QAAA,MAAM,WAAW,yEAgMhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/cjs/select/list-columns.js

@@ -1,15 +1,187 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+require("core-js/modules/web.dom-collections.for-each.js");
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/es.array.map.js");
+require("core-js/modules/es.array.concat.js");
+require("core-js/modules/es.array.reduce.js");
+var _react = _interopRequireDefault(require("react"));
+var _hooks = require("@sheinx/hooks");
+var _virtualScroll = require("../virtual-scroll");
+var _listColumnsOption = _interopRequireDefault(require("./list-columns-option"));
+var _simpleCheckbox = _interopRequireDefault(require("../checkbox/simple-checkbox"));
 var _jsxRuntime = require("react/jsx-runtime");
-// import { BaseListProps } from './select.type';
+var ColumnsList = function ColumnsList(props) {
+  var _jssStyle$select;
+  var jssStyle = props.jssStyle,
+    data = props.data,
+    height = props.height,
+    header = props.header,
+    keygen = props.keygen,
+    datum = props.datum,
+    multiple = props.multiple,
+    _props$itemsInView = props.itemsInView,
+    itemsInView = _props$itemsInView === void 0 ? 10 : _props$itemsInView,
+    lineHeightProp = props.lineHeight,
+    loading = props.loading,
+    value = props.value,
+    size = props.size,
+    _props$columns = props.columns,
+    columns = _props$columns === void 0 ? 1 : _props$columns,
+    columnWidth = props.columnWidth,
+    columnsTitle = props.columnsTitle,
+    groupKeyProp = props.groupKey,
+    renderItemProp = props.renderItem,
+    closePop = props.closePop;
+  var groupKey = groupKeyProp;
+  var styles = jssStyle === null || jssStyle === void 0 ? void 0 : (_jssStyle$select = jssStyle.select) === null || _jssStyle$select === void 0 ? void 0 : _jssStyle$select.call(jssStyle);
 
-var ColumnsList = function ColumnsList() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    children: "ColumnsList"
+  // columns 模式无上下边距，故而 lineHeight 需要调整
+  var getLineHeight = function getLineHeight() {
+    if (lineHeightProp) return lineHeightProp;
+    if (size === 'small') return 24;
+    if (size === 'default') return 32;
+    if (size === 'large') return 40;
+    return 32;
+  };
+  var lineHeight = getLineHeight();
+  var getChecked = function getChecked() {
+    if (!value) return false;
+    if (_hooks.util.isArray(value) && value.length === 0) {
+      return false;
+    }
+    var every = true;
+    var some = false;
+    if (data.length === 0) return false;
+    data.forEach(function (item) {
+      if (groupKey && item[groupKey]) return;
+      if (!datum.check(item)) {
+        every = false;
+      } else {
+        some = true;
+      }
+    });
+    if (every) return true;
+    if (some) return 'indeterminate';
+    return false;
+  };
+  var checked = getChecked();
+  var handleChange = function handleChange(isChecked) {
+    if (!isChecked) {
+      var _next = data.filter(function (item) {
+        return !item[groupKey] && datum.check(item) && !datum.disabledCheck(item);
+      });
+      datum.remove(_next);
+      return;
+    }
+    var next = data.filter(function (item) {
+      return !item[groupKey] && !datum.check(item) && !datum.disabledCheck(item);
+    });
+    datum.add(next);
+  };
+  var renderLoading = function renderLoading() {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      children: "loading"
+    });
+  };
+  var renderHeader = function renderHeader() {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      children: "header"
+    });
+  };
+  var renderGroupTitle = function renderGroupTitle(item, key) {
+    if (item[groupKey]) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: styles.optionGroupTitle,
+        children: item[groupKey]
+      }, key);
+    }
+    return null;
+  };
+  var renderItem = function renderItem(data, currentIndex) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: styles === null || styles === void 0 ? void 0 : styles.columns,
+      style: {
+        height: lineHeight
+      },
+      children: data.map(function (item, index) {
+        var isGroupTitleRow = groupKey && Object.keys(item).length === 0 || item[groupKey];
+        if (isGroupTitleRow) {
+          return renderGroupTitle(item, "__".concat(currentIndex, "__").concat(index, "__").concat(item[groupKey], "__"));
+        }
+        var key = _hooks.util.getKey(keygen, item, currentIndex + index);
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_listColumnsOption.default, {
+          jssStyle: jssStyle,
+          data: item,
+          size: size,
+          datum: datum,
+          multiple: multiple,
+          columnWidth: columnWidth,
+          renderItem: renderItemProp,
+          closePop: closePop
+        }, key);
+      })
+    }, currentIndex);
+  };
+  var renderList = function renderList() {
+    if (loading) return renderLoading();
+    var sliceData = data.reduce(function (red, item) {
+      var lastItem = red[red.length - 1];
+
+      // 如果item有groupKey属性，创建一个新的数组，只包含这个item，剩余位置用空对象填充
+      if (item[groupKey]) {
+        var newItemArray = new Array(columns).fill({});
+        newItemArray[0] = item;
+        red.push(newItemArray);
+        return red;
+      }
+      if (!lastItem) {
+        lastItem = [];
+        red.push(lastItem);
+      }
+      if (lastItem.length >= columns) red.push([item]);else {
+        lastItem.push(item);
+      }
+      return red;
+    }, []);
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_virtualScroll.VirtualScrollList, {
+      data: sliceData,
+      tag: 'ul',
+      keygen: keygen,
+      groupKey: groupKey,
+      tagClassName: styles.virtualList,
+      height: height,
+      colNum: columns,
+      lineHeight: lineHeight,
+      rowsInView: itemsInView,
+      renderItem: renderItem
+    });
+  };
+  var renderSelectAll = function renderSelectAll() {
+    if (!multiple) return;
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: styles.header,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_simpleCheckbox.default, {
+        className: styles.columnsCheckbox,
+        size: size,
+        jssStyle: jssStyle,
+        checked: checked,
+        onChange: handleChange,
+        children: "\u5168\u9009"
+      }), columnsTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: styles.columnsTitle,
+        children: columnsTitle
+      })]
+    });
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: styles.list,
+    children: [header && renderHeader(), multiple && renderSelectAll(), renderList()]
   });
 };
 var _default = ColumnsList;

package/cjs/select/list-option.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list-option.d.ts","sourceRoot":"","sources":["list-option.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAGrD,QAAA,MAAM,UAAU,2EAiCf,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"list-option.d.ts","sourceRoot":"","sources":["list-option.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAGrD,QAAA,MAAM,UAAU,2EA8Df,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/cjs/select/list-option.js

@@ -10,24 +10,35 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _icons = _interopRequireDefault(require("../icons"));
 var _jsxRuntime = require("react/jsx-runtime");
 var ListOption = function ListOption(props) {
-  var _jssStyle$select, _classNames;
+  var _jssStyle$select, _classNames2;
   var jssStyle = props.jssStyle,
     datum = props.datum,
     index = props.index,
     data = props.data,
     multiple = props.multiple,
-    renderItem = props.renderItem;
+    isHover = props.isHover,
+    closePop = props.closePop,
+    renderItem = props.renderItem,
+    onHover = props.onHover,
+    onOptionClick = props.onOptionClick;
   var styles = jssStyle === null || jssStyle === void 0 ? void 0 : (_jssStyle$select = jssStyle.select) === null || _jssStyle$select === void 0 ? void 0 : _jssStyle$select.call(jssStyle);
   var isChecked = datum.check(data);
   var isDisabled = datum.disabledCheck(data);
-  var rootClass = (0, _classnames.default)(styles === null || styles === void 0 ? void 0 : styles.option, "option-".concat(index), {});
-  var innerClass = (0, _classnames.default)(styles === null || styles === void 0 ? void 0 : styles.optionInner, (_classNames = {}, (0, _defineProperty2.default)(_classNames, styles === null || styles === void 0 ? void 0 : styles.optionActive, isChecked), (0, _defineProperty2.default)(_classNames, styles === null || styles === void 0 ? void 0 : styles.optionDisabled, isDisabled), _classNames));
+  var rootClass = (0, _classnames.default)(styles === null || styles === void 0 ? void 0 : styles.option, "option-".concat(index), (0, _defineProperty2.default)({}, styles === null || styles === void 0 ? void 0 : styles.optionHover, isHover));
+  var innerClass = (0, _classnames.default)(styles === null || styles === void 0 ? void 0 : styles.optionInner, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, styles === null || styles === void 0 ? void 0 : styles.optionActive, isChecked), (0, _defineProperty2.default)(_classNames2, styles === null || styles === void 0 ? void 0 : styles.optionDisabled, isDisabled), _classNames2));
+  var handleEnter = function handleEnter() {
+    onHover(index);
+  };
   var handleClick = function handleClick() {
     if (isChecked) {
-      datum.remove(data);
+      if (multiple) datum.remove(data);
     } else {
       datum.add(data);
     }
+    if (!multiple) {
+      closePop();
+    }
+    onOptionClick(data, index);
   };
   var renderCheckedIcon = function renderCheckedIcon() {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
@@ -35,12 +46,17 @@ var ListOption = function ListOption(props) {
       children: _icons.default.Check
     });
   };
+  var result = renderItem(data);
+  var title = typeof result === 'string' ? result : '';
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+    tabIndex: -1,
     className: rootClass,
+    title: title,
     onClick: handleClick,
+    onMouseEnter: handleEnter,
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: innerClass,
-      children: [renderItem(data), multiple && isChecked && renderCheckedIcon()]
+      children: [result, multiple && isChecked && renderCheckedIcon()]
     })
   });
 };

package/cjs/select/list-option.type.d.ts

@@ -1,8 +1,14 @@
+/// <reference types="react" />
 import { JssStyleType, SelectProps, DatumType } from './select.type';
-export interface ListOptionProps<DataItem, Value> extends Pick<SelectProps<DataItem, Value>, 'renderItem' | 'multiple'> {
+export interface ListOptionProps<DataItem, Value> extends Pick<SelectProps<DataItem, Value>, 'multiple'> {
     jssStyle?: JssStyleType;
     index: number;
     data: DataItem;
     datum: DatumType<DataItem, Value>;
+    isHover: boolean;
+    closePop: () => void;
+    renderItem: (data: DataItem, index?: number) => React.ReactNode;
+    onHover: (index: number, force?: boolean) => void;
+    onOptionClick: (data: DataItem, index: number) => void;
 }
 //# sourceMappingURL=list-option.type.d.ts.map

package/cjs/select/list-option.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list-option.type.d.ts","sourceRoot":"","sources":["list-option.type.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAErE,MAAM,WAAW,eAAe,CAAC,QAAQ,EAAE,KAAK,CAC9C,SAAQ,IAAI,CAAC,WAAW,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACrE,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,SAAS,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;CACnC"}
+{"version":3,"file":"list-option.type.d.ts","sourceRoot":"","sources":["list-option.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAErE,MAAM,WAAW,eAAe,CAAC,QAAQ,EAAE,KAAK,CAC9C,SAAQ,IAAI,CAAC,WAAW,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC;IACtD,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,SAAS,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IAClC,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IAChE,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACxD"}

package/cjs/select/list-tree.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
-declare const TreeList: () => JSX.Element;
+import { ListTreeProps } from './list-tree.type';
+declare const TreeList: <DataItem, Value>(props: ListTreeProps<DataItem, Value>) => JSX.Element;
 export default TreeList;
 //# sourceMappingURL=list-tree.d.ts.map

package/cjs/select/list-tree.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list-tree.d.ts","sourceRoot":"","sources":["list-tree.tsx"],"names":[],"mappings":";AAAA,QAAA,MAAM,QAAQ,mBAEb,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"list-tree.d.ts","sourceRoot":"","sources":["list-tree.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAGjD,QAAA,MAAM,QAAQ,yEA2Eb,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/cjs/select/list-tree.js

@@ -1,13 +1,81 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _classnames = _interopRequireDefault(require("classnames"));
+var _tree = _interopRequireDefault(require("../tree"));
 var _jsxRuntime = require("react/jsx-runtime");
-var TreeList = function TreeList() {
+var TreeList = function TreeList(props) {
+  var _jssStyle$select;
+  var jssStyle = props.jssStyle,
+    data = props.data,
+    keygen = props.keygen,
+    multiple = props.multiple,
+    height = props.height,
+    allowOnFilter = props.allowOnFilter,
+    renderItemProp = props.renderItem,
+    datum = props.datum,
+    expanded = props.expanded,
+    childrenKey = props.childrenKey,
+    defaultExpanded = props.defaultExpanded,
+    defaultExpandAll = props.defaultExpandAll,
+    onExpand = props.onExpand,
+    closePop = props.closePop;
+  var styles = jssStyle === null || jssStyle === void 0 ? void 0 : (_jssStyle$select = jssStyle.select) === null || _jssStyle$select === void 0 ? void 0 : _jssStyle$select.call(jssStyle);
+  var rootClass = (0, _classnames.default)(styles.tree);
+  var style = {
+    maxHeight: height
+  };
+  var getContentClass = function getContentClass(data) {
+    var isDisabled = datum.disabledCheck(data);
+    if (isDisabled) {
+      return (0, _classnames.default)(styles.optionDisabled);
+    }
+    var isCheck = datum.check(data);
+    if (isCheck) {
+      return (0, _classnames.default)(styles.optionActive);
+    }
+    return '';
+  };
+  var handleClick = function handleClick(data) {
+    if (datum.disabledCheck(data)) return;
+    var isCheck = datum.check(data);
+    if (isCheck) {
+      datum.remove(data);
+      return;
+    }
+    datum.add(data);
+    if (!multiple) {
+      closePop();
+    }
+  };
+
+  // tree 的 renderItem 与 list 的 renderItem 不同，需要转换，且 tree 无 index 返回
+  var renderItem = function renderItem(item) {
+    return renderItemProp(item);
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    children: "treeList"
+    className: rootClass,
+    style: style,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tree.default, {
+      line: false,
+      jssStyle: jssStyle,
+      onClick: handleClick,
+      data: data,
+      expanded: allowOnFilter ? expanded : undefined,
+      keygen: keygen,
+      defaultExpanded: defaultExpanded,
+      defaultExpandAll: defaultExpandAll,
+      childrenKey: childrenKey,
+      onExpand: onExpand,
+      nodeClass: (0, _classnames.default)(styles.treeOption),
+      contentClass: getContentClass,
+      renderItem: renderItem,
+      isControlled: 'expanded' in props
+    })
   });
 };
 var _default = TreeList;

package/cjs/select/list-tree.type.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { KeygenType, ObjectKey } from '@sheinx/hooks';
+import { JssStyleType, SelectProps, DatumType } from './select.type';
+export interface ListTreeProps<DataItem, Value> extends Pick<SelectProps<DataItem, Value>, 'multiple' | 'defaultExpandAll' | 'defaultExpanded' | 'onExpand' | 'expanded'> {
+    jssStyle?: JssStyleType;
+    height: number;
+    data: DataItem[];
+    keygen: KeygenType<DataItem>;
+    childrenKey: ObjectKey<DataItem>;
+    allowOnFilter: boolean;
+    datum: DatumType<DataItem, Value>;
+    closePop: () => void;
+    renderItem: (data: DataItem, index?: number) => React.ReactNode;
+}
+//# sourceMappingURL=list-tree.type.d.ts.map

package/cjs/select/list-tree.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"list-tree.type.d.ts","sourceRoot":"","sources":["list-tree.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAErE,MAAM,WAAW,aAAa,CAAC,QAAQ,EAAE,KAAK,CAC5C,SAAQ,IAAI,CACV,WAAW,CAAC,QAAQ,EAAE,KAAK,CAAC,EAC5B,UAAU,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,UAAU,GAAG,UAAU,CAC9E;IACD,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAC7B,WAAW,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;IACjC,aAAa,EAAE,OAAO,CAAC;IACvB,KAAK,EAAE,SAAS,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IAClC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CACjE"}

package/cjs/select/list-tree.type.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/cjs/select/list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["list.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAI9C,QAAA,MAAM,IAAI,yEAoET,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["list.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAK9C,QAAA,MAAM,IAAI,yEAmMT,CAAC;AAEF,eAAe,IAAI,CAAC"}