@hi-ui/check-select 4.0.0-alpha.4 → 4.0.0-alpha.43

package/lib/esm/hooks/use-data.js

@@ -0,0 +1,94 @@
+/** @LICENSE
+ * @hi-ui/check-select
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/check-select#readme
+ *
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { __rest } from 'tslib';
+import { useMemo, isValidElement } from 'react';
+import { toArray } from '@hi-ui/use-children';
+var NOOP_ARRAY = [];
+
+var useData = function useData(_ref) {
+  var data = _ref.data,
+      children = _ref.children;
+  return useMemo(function () {
+    var mergedData; // data 优先级大于内嵌式组合
+
+    if (Array.isArray(data)) {
+      mergedData = data;
+    } else if (children) {
+      mergedData = parseChildren(children);
+    }
+
+    return mergedData || NOOP_ARRAY;
+  }, [children, data]);
+};
+
+var parseChildren = function parseChildren(children) {
+  var data = [];
+  var list = toArray(children);
+  list.forEach(function (item) {
+    if (! /*#__PURE__*/isValidElement(item)) return;
+    if (!item.type) return;
+    var HiName = item.type.HiName;
+
+    switch (HiName) {
+      case 'CheckSelectOption':
+        var option = parseOption(item);
+        data.push(option);
+        break;
+
+      case 'CheckSelectOptionGroup':
+        var optGroup = parseOptionGroup(item);
+        data.push(optGroup);
+        break;
+    }
+  });
+  return data;
+};
+
+var parseOption = function parseOption(node) {
+  var _a = node.props,
+      value = _a.value,
+      children = _a.children,
+      disabled = _a.disabled,
+      rest = __rest(_a, ["value", "children", "disabled", "groupTitle"]);
+
+  var option = {
+    id: value,
+    title: children,
+    disabled: disabled,
+    // TODO:使用 Symbol 注入，避免 data 传入使用
+    rootProps: rest
+  };
+  return option;
+};
+
+var parseOptionGroup = function parseOptionGroup(node) {
+  var key = node.key,
+      _a = node.props,
+      groupId = _a.groupId,
+      label = _a.label,
+      children = _a.children,
+      rest = __rest(_a, ["groupId", "label", "children"]);
+
+  var optGroup = {
+    groupId: groupId !== null && groupId !== void 0 ? groupId : key,
+    groupTitle: label,
+    rootProps: rest,
+    children: []
+  };
+
+  if (children) {
+    optGroup.children = parseChildren(children);
+  }
+
+  return optGroup;
+};
+
+export { parseChildren, useData };
+//# sourceMappingURL=use-data.js.map

package/lib/esm/hooks/use-data.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-data.js","sources":["../../../src/hooks/use-data.ts"],"sourcesContent":[null],"names":["NOOP_ARRAY","useData","data","children","useMemo","mergedData","Array","isArray","parseChildren","list","toArray","forEach","item","isValidElement","type","HiName","option","parseOption","push","optGroup","parseOptionGroup","node","_a","value","disabled","rest","id","title","rootProps","key","groupId","label","groupTitle"],"mappings":";;;;;;;;;;;;AAIA,IAAMA,UAAU,GAAG,EAAnB;;IAEaC,OAAO,GAAG,SAAVA,OAAU,KAAA;MAAGC,YAAAA;MAAMC,gBAAAA;SACvBC,OAAO,CAAC;QACTC;;QAGAC,KAAK,CAACC,OAAND,CAAcJ,IAAdI,GAAqB;AACvBD,MAAAA,UAAU,GAAGH,IAAbG;AADF,WAEO,IAAIF,QAAJ,EAAc;AACnBE,MAAAA,UAAU,GAAGG,aAAa,CAACL,QAAD,CAA1BE;;;WAGKA,UAAU,IAAIL;AAVT,GAAA,EAWX,CAACG,QAAD,EAAWD,IAAX,CAXW;;;IAcHM,aAAa,GAAG,SAAhBA,aAAgB,CAACL,QAAD;MACrBD,IAAI,GAAG;MACPO,IAAI,GAAGC,OAAO,CAACP,QAAD;AAEpBM,EAAAA,IAAI,CAACE,OAALF,CAAa,UAACG,IAAD;QACP,eAACC,cAAc,CAACD,IAAD,GAAQ;QACvB,CAACA,IAAI,CAACE,MAAM;QAGNC,MADV,GAEIH,IAFJ,CACEE,IACEF,CADMG;;YAGFA;WACD;YACGC,MAAM,GAAGC,WAAW,CAACL,IAAD;AAC1BV,QAAAA,IAAI,CAACgB,IAALhB,CAAUc,MAAVd;;;WAEG;YACGiB,QAAQ,GAAGC,gBAAgB,CAACR,IAAD;AACjCV,QAAAA,IAAI,CAACgB,IAALhB,CAAUiB,QAAVjB;;;AAfN,GAAAO;SAoBOP;;;AAGT,IAAMe,WAAW,GAAG,SAAdA,WAAc,CAACI,IAAD;MAEhBC,KACED,IAAI;MADGE,KAAT,KAAA,CAASA;MAAOpB,QAAhB,KAAA,CAAgBA;MAAUqB,QAA1B,KAAA,CAA0BA;MAAyBC,IAAnD,cAAO,QAAA,YAAA,YAAA,cAAA;;MAGHT,MAAM,GAAG;AACbU,IAAAA,EAAE,EAAEH,KADS;AAEbI,IAAAA,KAAK,EAAExB,QAFM;AAGbqB,IAAAA,QAAQ,EAAEA,QAHG;;AAKbI,IAAAA,SAAS,EAAEH;AALE;SAQRT;AAbT,CAAA;;AAgBA,IAAMI,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,IAAD;MAErBQ,GADI,GAGFR,IAHE,CACJQ;MACAP,EAFI,GAGFD,IAAI;MADGS,OAFL,KAAA,CAEKA;MAASC,KAFd,KAAA,CAEcA;MAAO5B,QAFrB,KAAA,CAEqBA;MAAasB,IAFlC,cAEG,UAAA,SAAA,YAAA;;MAGHN,QAAQ,GAAG;AACfW,IAAAA,OAAO,EAAEA,OAAO,SAAPA,IAAAA,OAAO,WAAPA,GAAAA,OAAAA,GAAWD,GADL;AAEfG,IAAAA,UAAU,EAAED,KAFG;AAGfH,IAAAA,SAAS,EAAEH,IAHI;AAIftB,IAAAA,QAAQ,EAAE;AAJK;;MAObA,UAAU;AACZgB,IAAAA,QAAQ,CAAChB,QAATgB,GAAoBX,aAAa,CAACL,QAAD,CAAjCgB;;;SAGKA;AAjBT,CAAA;;"}

package/lib/esm/hooks/use-flatten-data.js

@@ -0,0 +1,69 @@
+/** @LICENSE
+ * @hi-ui/check-select
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/check-select#readme
+ *
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { useMemo } from 'react';
+import { baseFlattenTree } from '@hi-ui/tree-utils';
+var NOOP_ARRAY = [];
+var DEFAULT_FIELD_NAMES = {};
+
+var useFlattenData = function useFlattenData(_ref) {
+  var _ref$data = _ref.data,
+      data = _ref$data === void 0 ? NOOP_ARRAY : _ref$data,
+      _ref$fieldNames = _ref.fieldNames,
+      fieldNames = _ref$fieldNames === void 0 ? DEFAULT_FIELD_NAMES : _ref$fieldNames;
+  var flattedData = useMemo(function () {
+    return flattenData({
+      data: data,
+      fieldNames: fieldNames
+    });
+  }, [data, fieldNames]);
+  return flattedData;
+};
+
+var flattenData = function flattenData(_ref2) {
+  var _ref2$data = _ref2.data,
+      data = _ref2$data === void 0 ? NOOP_ARRAY : _ref2$data,
+      _ref2$fieldNames = _ref2.fieldNames,
+      fieldNames = _ref2$fieldNames === void 0 ? DEFAULT_FIELD_NAMES : _ref2$fieldNames; // 转换对象
+
+  var getKeyFields = function getKeyFields(node, key) {
+    return node[fieldNames[key] || key];
+  };
+
+  return baseFlattenTree({
+    tree: data,
+    childrenFieldName: function childrenFieldName(node) {
+      return getKeyFields(node, 'children');
+    },
+    transform: function transform(node) {
+      var _a; // 不对外暴露
+
+
+      delete node.parent;
+      var raw = node.raw;
+
+      if ('groupId' in raw) {
+        // 用于虚拟列表唯一 id
+        node.id = raw.groupId;
+        node.groupId = raw.groupId;
+        node.groupTitle = raw.groupTitle;
+      } else {
+        // 支持 fieldNames 转换
+        node.id = getKeyFields(raw, 'id');
+        node.title = getKeyFields(raw, 'title');
+        node.disabled = (_a = getKeyFields(raw, 'disabled')) !== null && _a !== void 0 ? _a : false;
+      }
+
+      return node;
+    }
+  });
+};
+
+export { flattenData, useFlattenData };
+//# sourceMappingURL=use-flatten-data.js.map

package/lib/esm/hooks/use-flatten-data.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-flatten-data.js","sources":["../../../src/hooks/use-flatten-data.ts"],"sourcesContent":[null],"names":["NOOP_ARRAY","DEFAULT_FIELD_NAMES","useFlattenData","data","fieldNames","flattedData","useMemo","flattenData","getKeyFields","node","key","baseFlattenTree","tree","childrenFieldName","transform","parent","raw","id","groupId","groupTitle","title","disabled"],"mappings":";;;;;;;;;;;AAIA,IAAMA,UAAU,GAAG,EAAnB;AACA,IAAMC,mBAAmB,GAAG,EAA5B;;IAEaC,cAAc,GAAG,SAAjBA,cAAiB,KAAA;uBAAGC;MAAAA,8BAAOH;6BAAYI;MAAAA,0CAAaH;MACzDI,WAAW,GAAGC,OAAO,CAAC;WACnBC,WAAW,CAAC;AAAEJ,MAAAA,IAAI,EAAJA,IAAF;AAAQC,MAAAA,UAAU,EAAVA;AAAR,KAAD;AADO,GAAA,EAExB,CAACD,IAAD,EAAOC,UAAP,CAFwB;SAIpBC;;;IAGIE,WAAW,GAAG,SAAdA,WAAc,MAAA;yBAAGJ;MAAAA,+BAAOH;+BAAYI;MAAAA,2CAAaH;;MAEtDO,YAAY,GAAG,SAAfA,YAAe,CAACC,IAAD,EAAYC,GAAZ;WAAyCD,IAAI,CAACL,UAAU,CAACM,GAAD,CAAVN,IAAmBM,GAApB;AAAlE;;SAEOC,eAAe,CAAC;AACrBC,IAAAA,IAAI,EAAET,IADe;AAErBU,IAAAA,iBAAiB,EAAE,0BAAA,CAACJ,IAAD;aAAUD,YAAY,CAACC,IAAD,EAAO,UAAP;AAFpB,KAAA;AAGrBK,IAAAA,SAAS,EAAE,kBAAA,CAACL,IAAD;;;;aAEFA,IAAI,CAACM;UAEJC,GAAR,GAAgBP,IAAhB,CAAQO;;UAEJ,aAAaA,KAAK;;AAEpBP,QAAAA,IAAI,CAACQ,EAALR,GAAUO,GAAG,CAACE,OAAdT;AACAA,QAAAA,IAAI,CAACS,OAALT,GAAeO,GAAG,CAACE,OAAnBT;AACAA,QAAAA,IAAI,CAACU,UAALV,GAAkBO,GAAG,CAACG,UAAtBV;AAJF,aAKO;;AAELA,QAAAA,IAAI,CAACQ,EAALR,GAAUD,YAAY,CAACQ,GAAD,EAAM,IAAN,CAAtBP;AACAA,QAAAA,IAAI,CAACW,KAALX,GAAaD,YAAY,CAACQ,GAAD,EAAM,OAAN,CAAzBP;AACAA,QAAAA,IAAI,CAACY,QAALZ,GAAgB,MAAAD,YAAY,CAACQ,GAAD,EAAM,UAAN,CAAZ,UAAA,iBAAA,KAAA,GAAiC,KAAjDP;;;aAEKA;;AApBY,GAAD;;;"}

package/lib/esm/index.js

@@ -8,5 +8,5 @@
  * LICENSE file in the root directory of this source tree.
  */
 import './styles/index.scss.js';
-export { CheckSelect, CheckSelectOption, SelectSearch, CheckSelect as default } from './CheckSelect.js';
+export { CheckSelect, CheckSelectOption, CheckSelectOptionGroup, CheckSelect as default } from './CheckSelect.js';
 //# sourceMappingURL=index.js.map

package/lib/esm/styles/index.scss.js

@@ -7,7 +7,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var css_248z = ".hi-v4-check-select {\n  margin: 0;\n  padding: 0;\n  border: none;\n  outline: none;\n  font-size: 14px;\n  vertical-align: middle;\n  list-style: none;\n  width: auto;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  -ms-flex-negative: 0;\n      flex-shrink: 0;\n  display: inline-block;\n  min-width: 160px;\n  max-height: 260px;\n  overflow: auto;\n  padding-bottom: 10px; }\n  .hi-v4-check-select--open .hi-v4-mock-input {\n    border-color: var(--color-primary); }\n  .hi-v4-check-select-item {\n    width: 100%;\n    padding: 4px 0;\n    position: relative;\n    cursor: pointer;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex; }\n  .hi-v4-check-select-option {\n    padding: 0 10px;\n    -webkit-box-sizing: border-box;\n            box-sizing: border-box;\n    min-height: 32px;\n    width: 100%;\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -webkit-box-align: center;\n        -ms-flex-align: center;\n            align-items: center;\n    position: relative;\n    -webkit-box-pack: justify;\n        -ms-flex-pack: justify;\n            justify-content: space-between; }\n  .hi-v4-check-select-option:hover {\n      background-color: var(--color-primary-20); }\n  .hi-v4-check-select-option--selected {\n      background-color: var(--color-primary-20);\n      font-weight: 700;\n      color: var(--color-primary); }\n  .hi-v4-check-select-option--focused {\n      background-color: var(--color-primary-10); }\n  .hi-v4-check-select-option--disabled {\n      cursor: not-allowed;\n      color: var(--color-gray-50);\n      font-weight: 400; }\n  .hi-v4-check-select-option--disabled .hi-v4-check-select-menu-switcher {\n        color: var(--color-gray-50); }\n  .hi-v4-check-select .title__text {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1;\n            flex: 1 1; }\n  .hi-v4-check-select-panel {\n  white-space: nowrap;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box; }\n  .hi-v4-check-select-search {\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  padding: 0 10px 10px;\n  position: relative; }\n  .hi-v4-check-select-search .hi-v4-input__prefix {\n    font-size: 16px;\n    padding-left: 0; }\n  .hi-v4-check-select-search__empty {\n    display: inline-block;\n    margin-top: 20px;\n    font-size: 14px;\n    font-weight: 400;\n    color: #999;\n    line-height: 20px; }\n";
+var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-check-select-option {\n  margin-top: 4px;\n  margin-top: var(--hi-v4-spacing-2, 4px);\n  margin-bottom: 4px;\n  margin-bottom: var(--hi-v4-spacing-2, 4px);\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  width: 100%;\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-align: center;\n      -ms-flex-align: center;\n          align-items: center;\n  position: relative;\n  border-radius: 4px;\n  border-radius: var(--hi-v4-border-radius-normal, 4px);\n  cursor: pointer;\n  font-size: 0.875rem;\n  font-size: var(--hi-v4-text-size-normal, 0.875rem);\n  font-weight: 400;\n  font-weight: var(--hi-v4-text-weight-normal, 400);\n  color: #1f2733;\n  color: var(--hi-v4-color-gray-700, #1f2733);\n  line-height: 1.25rem;\n  line-height: var(--hi-v4-text-lineheight-sm, 1.25rem); }\n.hi-v4-check-select-option__indent {\n    display: inline-block;\n    width: 16px;\n    height: 100%; }\n.hi-v4-check-select-option__title {\n    display: inline-block;\n    -webkit-box-sizing: border-box;\n            box-sizing: border-box;\n    width: 100%;\n    padding: 6px;\n    padding: var(--hi-v4-spacing-3, 6px);\n    font-size: inherit;\n    font-weight: inherit;\n    color: inherit;\n    line-height: inherit; }\n.hi-v4-check-select-option:hover {\n    background-color: #f2f4f7;\n    background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-check-select-option--focused {\n    background-color: #f2f4f7;\n    background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-check-select-option--disabled {\n    cursor: not-allowed;\n    color: #929aa6;\n    color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-check-select-option-group {\n  display: inline-block;\n  margin-top: 12px;\n  margin-top: var(--hi-v4-spacing-6, 12px);\n  margin-bottom: 4px;\n  margin-bottom: var(--hi-v4-spacing-2, 4px);\n  padding: 6px 0 6px 6px;\n  padding: var(--hi-v4-spacing-3, 6px) 0 var(--hi-v4-spacing-3, 6px) var(--hi-v4-spacing-3, 6px);\n  font-size: 0.875rem;\n  font-size: var(--hi-v4-text-size-normal, 0.875rem);\n  font-weight: 400;\n  font-weight: var(--hi-v4-text-weight-normal, 400);\n  color: #929aa6;\n  color: var(--hi-v4-color-gray-500, #929aa6);\n  line-height: 1.25rem;\n  line-height: var(--hi-v4-text-lineheight-sm, 1.25rem); }\n.hi-v4-check-select-option-group:first-child {\n    margin-top: 4px;\n    margin-top: var(--hi-v4-spacing-2, 4px); }\n";
 
 var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
 

package/lib/esm/use-check-select.js

@@ -8,12 +8,15 @@
  * LICENSE file in the root directory of this source tree.
  */
 import { __rest } from 'tslib';
-import React, { useMemo, useCallback } from 'react';
+import { useRef, useCallback } from 'react';
 import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state';
-import { useSearch } from './hooks/use-search.js';
+import { uniqBy } from 'lodash';
 import { useCheck } from '@hi-ui/use-check';
-import { useLatestCallback } from '@hi-ui/use-latest';
-import { toArray } from '@hi-ui/use-children';
+import { useLatestRef, useLatestCallback } from '@hi-ui/use-latest';
+import { useData } from './hooks/use-data.js';
+import { useFlattenData } from './hooks/use-flatten-data.js';
+import '@hi-ui/env';
+import '@hi-ui/type-assertion';
 var NOOP_ARRAY = [];
 var NOOP_VALUE = [];
 
@@ -28,58 +31,51 @@ var useCheckSelect = function useCheckSelect(_a) {
       defaultValue = _a$defaultValue === void 0 ? NOOP_VALUE : _a$defaultValue,
       onChangeProp = _a.onChange,
       onSelect = _a.onSelect,
-      _a$emptyContent = _a.emptyContent,
-      emptyContent = _a$emptyContent === void 0 ? '无匹配选项' : _a$emptyContent,
-      searchPlaceholder = _a.searchPlaceholder,
-      titleRender = _a.titleRender,
-      rest = __rest(_a, ["data", "children", "disabled", "value", "defaultValue", "onChange", "onSelect", "emptyContent", "searchPlaceholder", "titleRender"]);
+      fieldNames = _a.fieldNames,
+      rest = __rest(_a, ["data", "children", "disabled", "value", "defaultValue", "onChange", "onSelect", "fieldNames"]);
 
-  var data = useMemo(function () {
-    if (children) {
-      var list = toArray(children);
-      var arr = [];
-
-      var dfs = function dfs(list) {
-        list.forEach(function (item) {
-          if (! /*#__PURE__*/React.isValidElement(item)) return; // @ts-ignore
-
-          if (item.type && item.type.HiName === 'CheckSelectOption') {
-            arr.push(item); // @ts-ignore
-          } else if (item.type && item.type.HiName === 'CheckSelectOptionGroup') {
-            // @ts-ignore
-            if (item.props && item.props.children) {
-              // @ts-ignore
-              var _list = toArray(item.props.children);
-
-              dfs(_list);
-            }
-          }
-        });
-      };
-
-      dfs(list);
-      return arr.map(function (_ref) {
-        var props = _ref.props;
-        return {
-          id: props.value,
-          title: props.children,
-          disabled: props.disabled || false
-        };
-      });
-    }
-
-    return dataProp;
-  }, [children, dataProp]);
+  var data = useData({
+    data: dataProp,
+    children: children
+  });
+  var flattedData = useFlattenData({
+    data: data,
+    fieldNames: fieldNames
+  });
+  var flattedDataRef = useLatestRef(flattedData);
 
   var _useUncontrolledState = useUncontrolledState(defaultValue, valueProp, onChangeProp),
       value = _useUncontrolledState[0],
       tryChangeValue = _useUncontrolledState[1];
 
   var onSelectLatest = useLatestCallback(onSelect);
+  var selectedItemsRef = useRef([]);
   var proxyTryChangeValue = useCallback(function (value, item, shouldChecked) {
-    tryChangeValue(value, item, shouldChecked);
-    onSelectLatest(value, item, shouldChecked);
-  }, [tryChangeValue, onSelectLatest]);
+    var changedItems = item;
+
+    if (!Array.isArray(item)) {
+      changedItems = [item];
+
+      if (shouldChecked) {
+        selectedItemsRef.current.push(item);
+      }
+
+      onSelectLatest(value, item, shouldChecked);
+    }
+
+    var selectedItems = uniqBy([].concat(changedItems, selectedItemsRef.current, flattedDataRef.current), 'id'); // 调用用户的select
+
+    var checkedItems = selectedItems // 使用最新的value
+    .filter(function (item) {
+      return value.includes(item.id);
+    }).map(function (item) {
+      return 'raw' in item ? item.raw : item;
+    });
+    tryChangeValue(value, // TODO: 处理脏数据
+    changedItems.map(function (item) {
+      return 'raw' in item ? item.raw : item;
+    }), checkedItems);
+  }, [tryChangeValue, onSelectLatest, flattedDataRef, selectedItemsRef]);
 
   var _useCheckDefault = useCheck({
     disabled: disabled,
@@ -88,34 +84,16 @@ var useCheckSelect = function useCheckSelect(_a) {
     allowCheck: allowCheck
   }),
       onOptionCheck = _useCheckDefault[0],
-      isSelectedId = _useCheckDefault[1];
-
-  var _useSearch = useSearch(data),
-      inSearch = _useSearch[0],
-      matchedItems = _useSearch[1],
-      inputProps = _useSearch[2],
-      isEmpty = _useSearch[3],
-      resetSearch = _useSearch[4];
+      isCheckedId = _useCheckDefault[1];
 
-  var getSearchInputProps = useCallback(function () {
-    return {
-      placeholder: searchPlaceholder,
-      value: inputProps.value,
-      onChange: inputProps.onChange
-    };
-  }, [searchPlaceholder, inputProps]);
   return {
     rootProps: rest,
-    data: inSearch ? matchedItems : data,
+    data: data,
+    flattedData: flattedData,
     value: value,
+    tryChangeValue: proxyTryChangeValue,
     onSelect: onOptionCheck,
-    isSelectedId: isSelectedId,
-    emptyContent: emptyContent,
-    getSearchInputProps: getSearchInputProps,
-    tryChangeValue: tryChangeValue,
-    isEmpty: isEmpty,
-    resetSearch: resetSearch,
-    titleRender: titleRender
+    isCheckedId: isCheckedId
   };
 };
 

package/lib/esm/use-check-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-check-select.js","sources":["../../src/use-check-select.ts"],"sourcesContent":[null],"names":["NOOP_ARRAY","NOOP_VALUE","useCheckSelect","_a","data","dataProp","children","disabled","valueProp","value","defaultValue","onChangeProp","onChange","onSelect","emptyContent","searchPlaceholder","titleRender","rest","useMemo","list","toArray","arr","dfs","forEach","item","React","isValidElement","type","HiName","push","props","map","id","title","useUncontrolledState","tryChangeValue","onSelectLatest","useLatestCallback","proxyTryChangeValue","useCallback","shouldChecked","useCheckDefault","checkedIds","onCheck","allowCheck","onOptionCheck","isSelectedId","useSearch","inSearch","matchedItems","inputProps","isEmpty","resetSearch","getSearchInputProps","placeholder","rootProps","option"],"mappings":"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"}
+{"version":3,"file":"use-check-select.js","sources":["../../src/use-check-select.ts"],"sourcesContent":[null],"names":["NOOP_ARRAY","NOOP_VALUE","useCheckSelect","_a","data","dataProp","children","disabled","valueProp","value","defaultValue","onChangeProp","onChange","onSelect","fieldNames","rest","useData","flattedData","useFlattenData","flattedDataRef","useLatestRef","useUncontrolledState","tryChangeValue","onSelectLatest","useLatestCallback","selectedItemsRef","useRef","proxyTryChangeValue","useCallback","item","shouldChecked","changedItems","Array","isArray","current","push","selectedItems","uniqBy","checkedItems","filter","includes","id","map","raw","useCheckDefault","checkedIds","onCheck","allowCheck","onOptionCheck","isCheckedId","rootProps","option"],"mappings":";;;;;;;;;;;;;;;;;;;AASA,IAAMA,UAAU,GAAG,EAAnB;AACA,IAAMC,UAAU,GAAG,EAAnB;;IAEaC,cAAc,GAAG,SAAjBA,cAAiB,CAACC,EAAD;mBAC5BC;MAAMC,gCAAWL;MACjBM,cAAAA;uBACAC;MAAAA,oCAAW;MACJC,eAAPC;2BACAC;MAAAA,4CAAeT;MACLU,kBAAVC;MACAC,cAAAA;MACAC,gBAAAA;MACGC,kBAT0B,OAAA,YAAA,YAAA,SAAA,gBAAA,YAAA,YAAA,cAAA;;MAWvBX,IAAI,GAAGY,OAAO,CAAC;AAAEZ,IAAAA,IAAI,EAAEC,QAAR;AAAkBC,IAAAA,QAAQ,EAARA;AAAlB,GAAD;MACdW,WAAW,GAAGC,cAAc,CAAC;AAAEd,IAAAA,IAAI,EAAJA,IAAF;AAAQU,IAAAA,UAAU,EAAVA;AAAR,GAAD;MAC5BK,cAAc,GAAGC,YAAY,CAACH,WAAD;;8BAEHI,oBAAoB,CAACX,YAAD,EAAeF,SAAf,EAA0BG,YAA1B;MAA7CF,KAAP;MAAca,cAAd;;MAEMC,cAAc,GAAGC,iBAAiB,CAACX,QAAD;MAElCY,gBAAgB,GAAGC,MAAM,CAAQ,EAAR;MAEzBC,mBAAmB,GAAGC,WAAW,CACrC,UACEnB,KADF,EAEEoB,IAFF,EAGEC,aAHF;QAKMC,YAAY,GAAGF;;QAEf,CAACG,KAAK,CAACC,OAAND,CAAcH,IAAdG,GAAqB;AACxBD,MAAAA,YAAY,GAAG,CAACF,IAAD,CAAfE;;UAEID,eAAe;AACjBL,QAAAA,gBAAgB,CAACS,OAAjBT,CAAyBU,IAAzBV,CAA8BI,IAA9BJ;;;AAEFF,MAAAA,cAAc,CAACd,KAAD,EAAQoB,IAAR,EAAcC,aAAd,CAAdP;;;QAGIa,aAAa,GAAGC,MAAM,WACtBN,cAAiBN,gBAAgB,CAACS,SAAYf,cAAc,CAACe,QADvC,EAE1B,IAF0B;;QAMtBI,YAAY,GAAGF,aAAa;AAAA,KAE/BG,MAFkBH,CAEX,UAACP,IAAD;aAAUpB,KAAK,CAAC+B,QAAN/B,CAAeoB,IAAI,CAACY,EAApBhC;AAFC,KAAA2B,EAGlBM,GAHkBN,CAGd,UAACP,IAAD;aAAW,SAASA,IAAT,GAAgBA,IAAI,CAACc,GAArB,GAA2Bd;AAHxB,KAAAO;AAKrBd,IAAAA,cAAc,CACZb,KADY;AAGZsB,IAAAA,YAAY,CAACW,GAAbX,CAAiB,UAACF,IAAD;aAAW,SAASA,IAAT,GAAgBA,IAAI,CAACc,GAArB,GAA2Bd;AAAvD,KAAAE,CAHY,EAIZO,YAJY,CAAdhB;AA5BmC,GAAA,EAmCrC,CAACA,cAAD,EAAiBC,cAAjB,EAAiCJ,cAAjC,EAAiDM,gBAAjD,CAnCqC;;yBAsCFmB,QAAe,CAAC;AACnDrC,IAAAA,QAAQ,EAARA,QADmD;AAEnDsC,IAAAA,UAAU,EAAEpC,KAFuC;AAGnDqC,IAAAA,OAAO,EAAEnB,mBAH0C;AAInDoB,IAAAA,UAAU,EAAVA;AAJmD,GAAD;MAA7CC,aAAP;MAAsBC,WAAtB;;SAOO;AACLC,IAAAA,SAAS,EAAEnC,IADN;AAELX,IAAAA,IAAI,EAAJA,IAFK;AAGLa,IAAAA,WAAW,EAAXA,WAHK;AAILR,IAAAA,KAAK,EAALA,KAJK;AAKLa,IAAAA,cAAc,EAAEK,mBALX;AAMLd,IAAAA,QAAQ,EAAEmC,aANL;AAOLC,IAAAA,WAAW,EAAXA;AAPK;;;AA4DT,IAAMF,UAAU,GAAG,SAAbA,UAAa,CAACI,MAAD;SAAiB,CAACA,MAAM,CAAC5C;AAA5C,CAAA;;"}

package/lib/types/CheckSelect.d.ts

@@ -1,28 +1,28 @@
 import React from 'react';
-import type { HiBaseHTMLProps } from '@hi-ui/core';
-import { PopperProps } from '@hi-ui/popper';
-import { CheckSelectItem } from './types';
+import { UseCheckSelectProps } from './use-check-select';
+import type { HiBaseAppearanceEnum, HiBaseHTMLProps } from '@hi-ui/core';
+import { CheckSelectDataItem, CheckSelectEventData } from './types';
+import { PickerProps } from '@hi-ui/picker';
+import { UseDataSource } from '@hi-ui/use-data-source';
 /**
  * TODO: What is CheckSelect
  */
 export declare const CheckSelect: React.ForwardRefExoticComponent<CheckSelectProps & React.RefAttributes<HTMLDivElement | null>>;
-export interface CheckSelectProps extends Omit<HiBaseHTMLProps<'div'>, 'onChange' | 'onSelect' | 'defaultValue'> {
+export interface CheckSelectProps extends Omit<PickerProps, 'trigger'>, UseCheckSelectProps {
     /**
-     * 设置当前选中值
+     * 设置虚拟滚动容器的可视高度。暂不对外暴露
+     * @private
      */
-    value?: React.ReactText[];
+    height?: number;
     /**
-     * 设置当前选中值默认值
+     * 设置虚拟列表每项的固定高度。暂不对外暴露
+     * @private
      */
-    defaultValue?: React.ReactText[];
+    itemHeight?: number;
     /**
-     * 选中值改变时的回调
+     * 	设置 `true` 开启虚拟滚动
      */
-    onChange?: (value: React.ReactText[], targetOption?: CheckSelectItem, shouldChecked?: boolean) => void;
-    /**
-     * 选中值时回调
-     */
-    onSelect?: (value: React.ReactText[], targetOption?: CheckSelectItem, shouldChecked?: boolean) => void;
+    virtual?: boolean;
     /**
      * 是否可搜索（仅在 title 为字符串时支持）
      */
@@ -32,45 +32,85 @@ export interface CheckSelectProps extends Omit<HiBaseHTMLProps<'div'>, 'onChange
      */
     clearable?: boolean;
     /**
-     * 是否禁止使用
+     * 是否开启换行全展示
+     */
+    wrap?: boolean;
+    /**
+     * 是否点击清理 tags
      */
-    disabled?: boolean;
+    onClear?: () => void;
     /**
-     * 设置选项为空时展示的内容
+     * 自定义尺寸
      */
-    emptyContent?: React.ReactNode;
+    size?: 'sm' | 'md' | 'lg';
     /**
      * 自定义渲染节点的 title 内容
      */
-    titleRender?: (item: CheckSelectItem) => React.ReactNode;
+    render?: (item: CheckSelectEventData) => React.ReactNode;
     /**
      * 自定义选择后触发器所展示的内容，只在 title 为字符串时有效
      */
-    displayRender?: (option: CheckSelectItem) => React.ReactNode;
+    displayRender?: (option: CheckSelectEventData) => React.ReactNode;
     /**
      * 触发器输入框占位符
      */
     placeholder?: string;
     /**
-     * 搜索输入框占位符
+     * 设置展现形式
      */
-    searchPlaceholder?: string;
+    appearance?: HiBaseAppearanceEnum;
     /**
-     * 自定义控制 popper 行为
+     * 节点搜索模式，仅在mode=normal模式下生效
      */
-    popper?: PopperProps;
+    searchMode?: 'highlight' | 'filter';
     /**
-     * 搜索数据
+     * 自定义搜索过滤器，仅在 searchable 为 true 时有效
+     * 第一个参数为输入的关键字，
+     * 第二个为数据项，返回值为 true 时将出现在结果项
      */
-    onSearch?: (item: CheckSelectItem) => Promise<CheckSelectItem[] | void> | void;
+    filterOption?: (keyword: string, item: CheckSelectDataItem) => boolean;
     /**
-     * 选项数据
+     * 异步加载数据
      */
-    data?: CheckSelectItem[];
-}
-export declare const SelectSearch: React.ForwardRefExoticComponent<Pick<SelectSearchProps, string | number> & React.RefAttributes<HTMLInputElement | null>>;
-export interface SelectSearchProps extends HiBaseHTMLProps {
+    dataSource?: UseDataSource<CheckSelectDataItem>;
+    /**
+     * 自定义下拉菜单底部渲染
+     */
+    renderExtraFooter?: () => React.ReactNode;
+    /**
+     * 自定义 input 后缀 icon
+     */
+    suffixIcon?: React.ReactNode;
+    /**
+     * 自定义清除 tags 的 icon
+     */
+    clearIcon?: React.ReactNode;
+    /**
+     * 面板打开时回调
+     */
+    onOpen?: () => void;
+    /**
+     * 面板关闭时回调
+     */
+    onClose?: () => void;
+    /**
+     * 是否开启全选功能
+     */
+    showCheckAll?: boolean;
+    /**
+     * 是否开启查看仅已选功能
+     */
+    showOnlyShowChecked?: boolean;
 }
+/**
+ * TODO: What is CheckSelectOption
+ */
 export declare const CheckSelectOption: React.ForwardRefExoticComponent<Pick<CheckSelectOptionProps, string | number> & React.RefAttributes<HTMLDivElement | null>>;
 export interface CheckSelectOptionProps extends HiBaseHTMLProps {
 }
+/**
+ * TODO: What is CheckSelectOptionGroup
+ */
+export declare const CheckSelectOptionGroup: React.ForwardRefExoticComponent<Pick<CheckSelectOptionGroupProps, string | number> & React.RefAttributes<HTMLDivElement | null>>;
+export interface CheckSelectOptionGroupProps extends HiBaseHTMLProps {
+}