linkmore-design 1.0.35 → 1.0.38

package/lib/LmSelect/GhostSelect.js

@@ -0,0 +1,545 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/cascader/style");
+
+var _cascader = _interopRequireDefault(require("antd/es/cascader"));
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _hooks = require("../hooks");
+
+var _ahooks = require("ahooks");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _linkmoreDesign = require("linkmore-design");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _IconFont = _interopRequireDefault(require("../IconFont"));
+
+var _VirtualList = _interopRequireDefault(require("../VirtualList"));
+
+var _utils = require("./utils");
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var imgEmpty = require('./icon_placeholder.png');
+
+var FilterEmpty = function FilterEmpty() {
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_empty"
+  }, /*#__PURE__*/_react.default.createElement("img", {
+    src: imgEmpty,
+    alt: "empty",
+    width: 81
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_empty_text"
+  }, "\u6682\u65E0\u6570\u636E"));
+}; // 下拉单选过滤器
+
+
+var SelectFilter = function SelectFilter(_ref) {
+  var _ref$filters = _ref.filters,
+      filters = _ref$filters === void 0 ? [] : _ref$filters,
+      getFilterValue = _ref.getFilterValue,
+      setFilterValue = _ref.setFilterValue;
+  var inputRef = (0, _react.useRef)(null); // 搜索后的筛选项
+
+  var _useState = (0, _react.useState)(filters),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      options = _useState2[0],
+      setOptions = _useState2[1]; // 是否存在搜索, 当数据大于8时存在搜索
+
+
+  var isSearch = (0, _react.useMemo)(function () {
+    return filters.length > 8;
+  }, [filters.length]); // 搜索
+
+  var handleFilter = (0, _hooks.useEvent)(function (val) {
+    return setOptions(filters.filter(function (v) {
+      return (0, _utils.onStringSearch)(val, v.label);
+    }));
+  }); // 单选事件
+
+  var onChange = function onChange(e, item) {
+    e.preventDefault();
+    setFilterValue(item.value);
+  };
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_dropdown"
+  }, isSearch && /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_header"
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Input.Search, {
+    ref: inputRef,
+    allowClear: true,
+    size: "small",
+    placeholder: "\u8BF7\u8F93\u5165",
+    onSearch: handleFilter,
+    onChange: function onChange(e) {
+      return handleFilter(e.target.value);
+    }
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_body"
+  }, /*#__PURE__*/_react.default.createElement(_VirtualList.default, {
+    options: options,
+    className: "filter_list"
+  }, function (_a) {
+    var item = _a.item,
+        resetProps = __rest(_a, ["item"]);
+
+    return /*#__PURE__*/_react.default.createElement("div", Object.assign({}, resetProps, {
+      className: (0, _classnames.default)('filter_item', {
+        checked: item.value === getFilterValue
+      }),
+      onClick: function onClick(e) {
+        return onChange(e, item);
+      }
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: "filter_item-content"
+    }, item.label));
+  }), !options.length && /*#__PURE__*/_react.default.createElement(FilterEmpty, null)));
+}; // 下拉多选过滤器: 要过滤的数据, 当前选中项, 触发过滤, 过滤前的数据
+
+
+var CheckboxFilter = function CheckboxFilter(_ref2) {
+  var _ref2$filters = _ref2.filters,
+      filters = _ref2$filters === void 0 ? [] : _ref2$filters,
+      _ref2$getFilterValue = _ref2.getFilterValue,
+      getFilterValue = _ref2$getFilterValue === void 0 ? [] : _ref2$getFilterValue,
+      setFilterValue = _ref2.setFilterValue;
+  var onValuesChange = (0, _hooks.useEvent)(function (checkedValues) {
+    return setFilterValue(checkedValues, false);
+  }); // 父组件和子组件同步checked状态
+
+  var _useControllableValue = (0, _ahooks.useControllableValue)({
+    value: getFilterValue,
+    onChange: onValuesChange
+  }),
+      _useControllableValue2 = (0, _slicedToArray2.default)(_useControllableValue, 2),
+      checkedValues = _useControllableValue2[0],
+      setCheckedValues = _useControllableValue2[1]; // 搜索后的筛选项：[{value: '', ... }, ...]
+
+
+  var _useState3 = (0, _react.useState)(filters),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      options = _useState4[0],
+      setOptions = _useState4[1]; // 是否存在搜索, 当数据大于8时存在搜索
+
+
+  var isSearch = (0, _react.useMemo)(function () {
+    return filters.length > 8;
+  }, [filters.length]); // 是否全选: 选中的数据大于等于筛选后的数据 && 筛选后的数据全部存在于选中的数据中
+
+  var checkAll = (0, _react.useMemo)(function () {
+    var isLen = checkedValues.length >= options.length;
+    return isLen && options.every(function (_ref3) {
+      var value = _ref3.value;
+      return checkedValues.includes(value);
+    });
+  }, [checkedValues.length, options]); // 是否半选: 存在选中的数据 && 未全选
+
+  var indeterminate = (0, _react.useMemo)(function () {
+    return checkedValues.length && !checkAll;
+  }, [checkedValues.length, checkAll]); // 全选事件
+
+  var onCheckAllChange = function onCheckAllChange(e) {
+    var nValue = checkAll ? checkedValues.filter(function (v) {
+      return !options.some(function (_ref4) {
+        var value = _ref4.value;
+        return v === value;
+      });
+    }) : Array.from(new Set([].concat((0, _toConsumableArray2.default)(checkedValues), (0, _toConsumableArray2.default)(options.map(function (v) {
+      return v.value;
+    })))));
+    setCheckedValues(nValue);
+  }; // 搜索
+
+
+  var handleFilter = (0, _hooks.useEvent)(function (val) {
+    return setOptions(filters.filter(function (v) {
+      return (0, _utils.onStringSearch)(val, v.label);
+    }));
+  }); // 单选事件
+
+  var onChange = function onChange(e, item) {
+    e.preventDefault();
+    e.stopPropagation();
+    var arr = checkedValues.includes(item.value) ? checkedValues.filter(function (v) {
+      return v !== item.value;
+    }) : [].concat((0, _toConsumableArray2.default)(checkedValues), [item.value]);
+    setCheckedValues(arr || undefined);
+  };
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "select_dropdown"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_header"
+  }, isSearch && /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Input.Search, {
+    allowClear: true,
+    size: "small",
+    placeholder: "\u8BF7\u8F93\u5165",
+    onSearch: handleFilter,
+    onChange: function onChange(e) {
+      var _a;
+
+      return handleFilter((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value);
+    }
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_header_operate"
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
+    indeterminate: indeterminate,
+    onChange: onCheckAllChange,
+    checked: checkAll,
+    className: "filter_tip"
+  }, "\u5168\u90E8"), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", {
+    className: "filter_tip"
+  }, "\u5DF2\u9009: ", checkedValues.length)))), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox.Group, {
+    value: checkedValues,
+    className: "filter_body"
+  }, /*#__PURE__*/_react.default.createElement(_VirtualList.default, {
+    options: options,
+    className: "filter_list"
+  }, function (_a) {
+    var item = _a.item,
+        resetProps = __rest(_a, ["item"]);
+
+    return /*#__PURE__*/_react.default.createElement("div", Object.assign({}, resetProps, {
+      className: (0, _classnames.default)('filter_item', {
+        checked: checkedValues.includes(item.value)
+      }),
+      onClick: function onClick(e) {
+        return onChange(e, item);
+      }
+    }), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Checkbox, {
+      value: item.value,
+      className: "filter_item-content"
+    }, item.label));
+  }), !options.length && /*#__PURE__*/_react.default.createElement(FilterEmpty, null)));
+}; // 级联选择器
+
+
+var CascaderFilter = function CascaderFilter(props) {
+  var title = props.title,
+      filters = props.filters,
+      getFilterValue = props.getFilterValue,
+      setFilterValue = props.setFilterValue,
+      _props$itemProps = props.itemProps,
+      itemProps = _props$itemProps === void 0 ? {} : _props$itemProps,
+      isFiltering = props.isFiltering;
+
+  var _useState5 = (0, _react.useState)(false),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      visible = _useState6[0],
+      setVisible = _useState6[1];
+
+  var _useState7 = (0, _react.useState)(filters),
+      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+      options = _useState8[0],
+      setOptions = _useState8[1];
+
+  var _useState9 = (0, _react.useState)('全部'),
+      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+      text = _useState10[0],
+      setText = _useState10[1];
+
+  var _useState11 = (0, _react.useState)(getFilterValue || itemProps.multiple ? [] : ''),
+      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+      checkedValues = _useState12[0],
+      setCheckedValues = _useState12[1]; // const isSearch = useMemo(() => filters.length > 8, [filters.length]);
+
+
+  var handleFilter = (0, _hooks.useEvent)(function (val) {
+    return setOptions(filters.filter(function (v) {
+      return (0, _utils.onStringSearch)(val, v.label);
+    }));
+  }); // 重置级联弹框
+
+  var dropdownRender = function dropdownRender(menus) {
+    var inputRef = (0, _react.useRef)(null); // 确定
+
+    var handleSure = function handleSure() {
+      setFilterValue(itemProps.multiple ? checkedValues.map(function (v) {
+        return v[v.length - 1];
+      }) : checkedValues);
+      setVisible(false);
+    }; // 取消
+
+
+    var handleReset = function handleReset() {
+      if (inputRef.current) {
+        inputRef.current.input.value = '';
+      }
+
+      setFilterValue(undefined);
+      setCheckedValues(itemProps.multiple ? [] : '');
+    };
+
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "filter_cascader_container filter_dropdown"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "filter_header"
+    }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Input.Search, {
+      ref: inputRef,
+      allowClear: true,
+      size: "small",
+      placeholder: "\u8BF7\u8F93\u5165",
+      onSearch: handleFilter,
+      onChange: function onChange(e) {
+        return handleFilter(e.target.value);
+      }
+    })), menus, itemProps.multiple && /*#__PURE__*/_react.default.createElement("div", {
+      className: "filter_footer"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "footer_clear",
+      onClick: handleReset
+    }, "\u53D6\u6D88"), /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Button, {
+      type: "primary",
+      size: "small",
+      onClick: handleSure
+    }, "\u786E\u5B9A")));
+  };
+
+  var onChange = function onChange(item, selectedOptions) {
+    if (!item.length) {
+      setText('全部');
+      setCheckedValues(itemProps.multiple ? [] : '');
+      setFilterValue(undefined);
+      return;
+    }
+
+    if (itemProps.multiple) {
+      var arr = [];
+      selectedOptions.map(function (vals) {
+        return vals.length > 1 ? arr.push(vals.map(function (v) {
+          return v.label;
+        }).join('/')) : vals[0].children.map(function (v) {
+          return arr.push("".concat(vals[0].label, "/").concat(v.label));
+        });
+      });
+      var showLabel = arr.length < 3 ? arr.join('、') : "".concat(arr[0], "\u3001+").concat(arr.length);
+      setText(showLabel);
+      setCheckedValues(item);
+    } else {
+      setText(selectedOptions.map(function (v) {
+        return v.label;
+      }).join('/'));
+      setFilterValue(item);
+      setCheckedValues(item);
+    }
+  };
+
+  var handleClear = function handleClear(e) {
+    if (isFiltering) {
+      e.stopPropagation();
+      setText('全部');
+      setCheckedValues(itemProps.multiple ? [] : '');
+      setFilterValue(undefined);
+    }
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_cascader.default, Object.assign({}, itemProps, {
+    options: options,
+    value: checkedValues,
+    onChange: onChange,
+    open: visible,
+    // showCheckedStrategy="Cascader.SHOW_CHILD"
+    dropdownRender: dropdownRender,
+    onDropdownVisibleChange: function onDropdownVisibleChange(v) {
+      return setVisible(v);
+    }
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('filter_item', {
+      isfiltering: isFiltering || visible,
+      active: !isFiltering && visible
+    })
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_item_label"
+  }, title, ":"), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_item_value"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "checked"
+  }, isFiltering ? text : '全部'), /*#__PURE__*/_react.default.createElement(_IconFont.default, {
+    type: isFiltering ? 'lmweb-close-circle-fill' : 'lmweb-down',
+    className: "addonAfter",
+    onClick: handleClear
+  })))));
+};
+
+var FilterComp = function FilterComp(props) {
+  var type = props.type,
+      resetProps = __rest(props, ["type"]);
+
+  switch (type) {
+    case 'select':
+      return /*#__PURE__*/_react.default.createElement(SelectFilter, Object.assign({}, resetProps));
+
+    case 'checkbox':
+      return /*#__PURE__*/_react.default.createElement(CheckboxFilter, Object.assign({}, resetProps));
+
+    case 'cascader':
+      return /*#__PURE__*/_react.default.createElement(CascaderFilter, Object.assign({}, resetProps));
+
+    default:
+      return /*#__PURE__*/_react.default.createElement(SelectFilter, Object.assign({}, resetProps));
+  }
+};
+
+var Index = function Index(props) {
+  var className = props.className,
+      dropdownClassName = props.dropdownClassName,
+      title = props.title,
+      type = props.type,
+      options = props.options,
+      children = props.children,
+      style = props.style,
+      comProps = props.props;
+
+  var _useState13 = (0, _react.useState)(false),
+      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
+      visible = _useState14[0],
+      setVisible = _useState14[1];
+
+  var _useState15 = (0, _react.useState)(),
+      _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
+      value = _useState16[0],
+      setValue = _useState16[1];
+
+  var data = (0, _react.useMemo)(function () {
+    if (options) return options;
+    return (0, _utils.getArray)(children).map(function (item) {
+      return {
+        label: item.props.children,
+        value: item.props.value
+      };
+    });
+  }, [options, children]); // 判断是否正在过滤,普通过滤 && 嵌套过滤
+
+  var isFiltering = (0, _react.useMemo)(function () {
+    return (0, _utils.getIsHas)(value);
+  }, [value]); // 设置过滤的内容 filterType: 'single' 存在时 单个勾选时触发, 默认按钮触发
+
+  var setFilterValue = (0, _hooks.useEvent)(function (val) {
+    var close = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+
+    var _a;
+
+    setValue(val);
+    (_a = props === null || props === void 0 ? void 0 : props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, val);
+    close && setVisible(false);
+  }); // 展示的内容
+
+  var checkedValue = (0, _react.useMemo)(function () {
+    if (!isFiltering) return '全部'; // select & checkbox
+
+    if (['select', 'checkbox'].includes(type)) {
+      var findItem = data.find(function (v) {
+        return Array.isArray(value) ? value.includes(v.value) : value === v.value;
+      });
+
+      if (!findItem) {
+        setFilterValue(type === 'checkbox' ? [] : '');
+        return '全部';
+      }
+
+      var filterLabel = findItem.label;
+
+      if (Array.isArray(value)) {
+        if (value.length > 1) {
+          return "".concat(filterLabel, "\u3001+").concat(value.length - 1, "...");
+        }
+
+        return filterLabel;
+      }
+
+      return filterLabel;
+    }
+
+    return value;
+  }, [comProps, data, isFiltering, setFilterValue, type, value]); // 下拉组件渲染
+
+  var FilterControl = function FilterControl() {
+    var obj = {
+      filters: data,
+      getFilterValue: value,
+      setFilterValue: setFilterValue
+    };
+    return (0, _utils.render)(function () {
+      return /*#__PURE__*/_react.default.createElement(FilterComp, Object.assign({
+        type: type
+      }, obj));
+    }());
+  }; // 清除筛选项
+
+
+  var handleClear = function handleClear(e) {
+    if (isFiltering) {
+      e.stopPropagation();
+      setFilterValue(type === 'checkbox' ? [] : '');
+    }
+  };
+
+  if (['cascader'].includes(type)) {
+    return /*#__PURE__*/_react.default.createElement(FilterComp, Object.assign({}, props, {
+      itemProps: comProps,
+      filters: data,
+      isFiltering: isFiltering,
+      getFilterValue: value,
+      setFilterValue: setFilterValue,
+      handleClear: handleClear
+    }));
+  }
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('lm_select_dropdown_base', className),
+    style: style
+  }, /*#__PURE__*/_react.default.createElement(_linkmoreDesign.Dropdown, {
+    trigger: ['click'],
+    visible: visible,
+    placement: "bottomLeft",
+    overlay: FilterControl,
+    onVisibleChange: setVisible,
+    className: (0, _classnames.default)(dropdownClassName)
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('filter_item', {
+      isfiltering: isFiltering || visible,
+      active: !isFiltering && visible
+    })
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_item_label"
+  }, title && "".concat(title, ":")), /*#__PURE__*/_react.default.createElement("div", {
+    className: "filter_item_value"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "checked"
+  }, checkedValue), /*#__PURE__*/_react.default.createElement(_IconFont.default, {
+    type: isFiltering ? 'lmweb-close-circle-fill' : 'lmweb-down',
+    className: "addonAfter",
+    onClick: handleClear
+  })))));
+};
+
+var _default = Index;
+exports.default = _default;

package/lib/LmSelect/NormalSelect.d.ts

@@ -0,0 +1,11 @@
+import { Select, SelectProps } from 'antd';
+import React from 'react';
+import GhostSelect from './GhostSelect';
+export interface ISelectProps extends SelectProps {
+    type?: 'select' | 'checkbox' | 'cascader';
+    Option?: typeof Select.Option;
+    OptGroup?: typeof Select.OptGroup;
+    GhostSelect?: typeof GhostSelect;
+}
+declare const NormalSelect: React.FC<ISelectProps>;
+export default NormalSelect;

package/lib/LmSelect/NormalSelect.js

@@ -0,0 +1,116 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/select/style");
+
+var _select = _interopRequireDefault(require("antd/es/select"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _hooks = require("../hooks");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _useCheckboxOptions = require("./useCheckboxOptions");
+
+var _utils = require("./utils");
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var prefixCls = 'lm_select'; // 不同类型Select, 不同的默认配置
+
+var config = {
+  select: {
+    placeholder: '请选择',
+    size: 'middle'
+  },
+  checkbox: {
+    mode: 'multiple',
+    placeholder: '请选择',
+    size: 'middle'
+  },
+  cascader: {}
+}; // 基于 antd 的 Select 组件
+
+var NormalSelect = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+  var children = props.children,
+      className = props.className,
+      dropdownClassName = props.dropdownClassName,
+      _props$type = props.type,
+      type = _props$type === void 0 ? 'select' : _props$type,
+      options = props.options,
+      showSearch = props.showSearch,
+      others = __rest(props, ["children", "className", "dropdownClassName", "type", "options", "showSearch"]);
+
+  var _React$useState = _react.default.useState([]),
+      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+      checkedValues = _React$useState2[0],
+      setCheckedValues = _React$useState2[1];
+
+  var _React$useState3 = _react.default.useState(''),
+      _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
+      search = _React$useState4[0],
+      setSearch = _React$useState4[1]; // 支持options和children渲染，优先级options > children, 计算时需要把children转换为options
+
+
+  var renderOptions = (0, _react.useMemo)(function () {
+    return options || (0, _utils.getOptions)(children);
+  }, [options, children]);
+  var onChange = (0, _hooks.useEvent)(function (v) {
+    var _a;
+
+    setCheckedValues(v);
+    (_a = props === null || props === void 0 ? void 0 : props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, v, renderOptions.filter(function (item) {
+      return v.includes(item.value);
+    }));
+  });
+  var isSearch = (0, _react.useMemo)(function () {
+    return showSearch || renderOptions.length > 8;
+  }, [renderOptions.length, showSearch]); // 获取dropdown
+
+  var _dropdownRender = (0, _useCheckboxOptions.useCheckboxOptions)(renderOptions, {
+    value: checkedValues,
+    onChange: onChange
+  }, search);
+
+  return /*#__PURE__*/_react.default.createElement(_select.default, Object.assign({
+    allowClear: true,
+    showArrow: true,
+    className: (0, _classnames.default)(className, prefixCls),
+    ref: ref,
+    options: options,
+    showSearch: isSearch,
+    dropdownRender: function dropdownRender(o) {
+      return type === 'checkbox' ? _dropdownRender : o;
+    },
+    value: checkedValues,
+    searchValue: search,
+    onSearch: isSearch && setSearch
+  }, config[type], others, {
+    onChange: onChange,
+    dropdownClassName: (0, _classnames.default)('lm_select_dropdown', dropdownClassName)
+  }), children);
+});
+var _default = NormalSelect;
+exports.default = _default;

package/lib/LmSelect/index.d.ts

@@ -0,0 +1,14 @@
+import { Select, SelectProps } from 'antd';
+import React from 'react';
+import GhostSelect from './GhostSelect';
+export interface ISelectProps extends SelectProps {
+    title?: string;
+    ghost?: boolean;
+    type?: 'select' | 'checkbox' | 'cascader';
+}
+declare const LMSelect: React.FC<ISelectProps> & {
+    Option?: typeof Select.Option;
+    OptGroup?: typeof Select.OptGroup;
+    GhostSelect?: typeof GhostSelect;
+};
+export default LMSelect;