shineout 3.0.0-alpha.2 → 3.0.0-alpha.4

package/esm/select/__example__/10-01-filter.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 过滤数据（本地）
+ *    -- 设置`onFilter`属性且返回内容为函数时，会根据返回的过滤函数对本地数据进行过滤
+ * en - Filter data (local)
+ *    -- Set the `onFilter` property and return the content as a function, the local data will be filtered according to the returned filter function
+ */
+var _default = function _default() {
+  var data = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet', 'pink'];
+  var handleFilter = function handleFilter(v) {
+    return function (d) {
+      return d.indexOf(v) >= 0;
+    };
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      width: 300,
+      data: data,
+      keygen: true,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return d;
+      },
+      onFilter: handleFilter
+    })
+  });
+};
+exports.default = _default;

package/esm/select/__example__/10-02-filter.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/10-02-filter.js

@@ -0,0 +1,65 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.array.concat.js");
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _ = require("../..");
+var _mock = require("@sheinx/mock");
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/**
+ * cn - 过滤数据（服务端）
+ *    -- 设置`onFilter`属性且不返回内容时，可以根据输入的内容自行进行过滤，并根据后端接口返回的数据重新设置data
+ * en - Filter data (server)
+ *    -- Set the `onFilter` property and do not return the content, you can filter according to the input content, and reset the data according to the data returned by the backend interface
+ */
+var _default = function _default() {
+  var _useState = (0, _react.useState)([]),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    data = _useState2[0],
+    setData = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    loading = _useState4[0],
+    setLoading = _useState4[1];
+  var getData = function getData(text) {
+    _mock.user.fetch.get('user', {
+      username: text,
+      sorter: {}
+    }).then(function (res) {
+      setData(res.data);
+      setLoading(false);
+    });
+  };
+  var handleFilter = function handleFilter(text) {
+    setLoading(true);
+    getData(text);
+  };
+  (0, _react.useEffect)(function () {
+    getData('');
+  }, []);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      loading: loading,
+      width: 300,
+      data: data,
+      keygen: "id",
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return "".concat(d.firstName, "-").concat(d.lastName);
+      },
+      onFilter: handleFilter
+    })
+  });
+};
+exports.default = _default;

package/esm/select/__example__/10-03-max-length.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/10-03-max-length.js

@@ -0,0 +1,38 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 限制过滤字符长度
+ *    -- 设置`maxLength`属性可以限制输入过滤字符的长度
+ * en - maxLength
+ *    -- Set `maxLength` property can limit the length of the input filter characters
+ */
+var _default = function _default() {
+  var data = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet', 'pink'];
+  var handleFilter = function handleFilter(v) {
+    return function (d) {
+      return d.indexOf(v) >= 0;
+    };
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      maxLength: 2,
+      width: 300,
+      data: data,
+      keygen: true,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return d;
+      },
+      onFilter: handleFilter
+    })
+  });
+};
+exports.default = _default;

package/esm/select/__example__/10-04-tree.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/10-04-tree.js

@@ -0,0 +1,72 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 树形数据过滤
+ *    -- 通过设置`onFilter`和`treeData`可以对树形数据进行过滤
+ * en - Tree data filter
+ *    -- Set onFilter and treeData to filter tree data
+ */
+var _default = function _default() {
+  var treeData = [{
+    id: '1',
+    title: 'node 1',
+    children: [{
+      id: '1-1',
+      title: 'node 1-1',
+      children: [{
+        id: '1-1-1',
+        title: 'node 1-1-1'
+      }, {
+        id: '1-1-2',
+        title: 'node 1-1-2'
+      }]
+    }, {
+      id: '1-2',
+      title: 'node 1-2'
+    }]
+  }, {
+    id: '2',
+    title: 'node 2'
+  }, {
+    id: '3',
+    title: 'node 3',
+    children: [{
+      id: '3-1',
+      title: 'node 3-1'
+    }]
+  }, {
+    id: '4',
+    title: 'node 4'
+  }];
+  var handleFilter = function handleFilter(text) {
+    return function (d) {
+      return d.title.indexOf(text) >= 0;
+    };
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      width: 260,
+      childrenKey: "children",
+      treeData: treeData,
+      keygen: "id",
+      format: "id",
+      onFilter: handleFilter,
+      placeholder: "Select Color",
+      prediction: function prediction(v, d) {
+        return v === d.id;
+      },
+      renderItem: function renderItem(d) {
+        return d.title;
+      }
+    })
+  });
+};
+exports.default = _default;

package/esm/select/__example__/11-absolute.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/11-absolute.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 绝对定位
+ *    -- 如果选项弹出层的父容器被遮挡，可以设置 absolute 属性使弹出选项在单独层中渲染。（非必要情况下不建议）
+ * en - Absolute
+ *    -- If the parent container of the option popup layer is blocked, you can set the absolute property to render the popup option in a separate layer. (Not recommended unless necessary)
+ */
+
+var data = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet'];
+var styleAbsolute = {
+  padding: 10,
+  height: 100,
+  width: '100%',
+  overflow: 'hidden'
+};
+var _default = function _default() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    style: styleAbsolute,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      width: 120,
+      renderItem: function renderItem(d) {
+        return d;
+      },
+      keygen: true,
+      data: data,
+      placeholder: "default"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      style: {
+        marginLeft: 16
+      },
+      width: 300,
+      absolute: true,
+      multiple: true,
+      keygen: true,
+      data: data,
+      renderItem: function renderItem(d) {
+        return d;
+      },
+      placeholder: "Select user"
+    })]
+  });
+};
+exports.default = _default;

package/esm/select/__example__/12-columns.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/12-columns.js

@@ -0,0 +1,67 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.array.concat.js");
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _ = require("../..");
+var _mock = require("@sheinx/mock");
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/**
+ * cn - 多列选择
+ *    -- 基础的使用方法
+ * en - Basic
+ *    -- Basic usage
+ */
+var _default = function _default() {
+  var _useState = (0, _react.useState)([]),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    data = _useState2[0],
+    setData = _useState2[1];
+  (0, _react.useEffect)(function () {
+    _mock.user.fetch.get('user', {
+      username: '',
+      sorter: {}
+    }).then(function (res) {
+      setData(res.data);
+    });
+  }, []);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      width: 300,
+      data: data,
+      keygen: "id",
+      columns: 4,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return "".concat(d.firstName, "-").concat(d.lastName);
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      style: {
+        marginLeft: 32
+      },
+      multiple: true,
+      compressed: true,
+      compressedBound: 2,
+      width: 300,
+      data: data,
+      keygen: "id",
+      columns: 4,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return "".concat(d.firstName, "-").concat(d.lastName);
+      }
+    })]
+  });
+};
+exports.default = _default;

package/esm/select/__example__/13-group.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/13-group.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 选项分组
+ *    -- 基础的使用方法
+ * en - Basic
+ *    -- Basic usage
+ */
+
+var data = [{
+  value: 'Mars',
+  group: '3'
+}, {
+  value: 'China',
+  group: '2'
+}, {
+  value: 'Beijing',
+  group: '1'
+}, {
+  value: 'Shanghai',
+  group: '1'
+}, {
+  value: 'shenzhen',
+  group: '1'
+}];
+var _default = function _default() {
+  var groupBy = function groupBy(d) {
+    if (d.group === '1') return 'City';
+    if (d.group === '2') return 'Country';
+    return 'Other';
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      width: 300,
+      data: data,
+      groupBy: groupBy,
+      keygen: "value",
+      placeholder: "Select City",
+      renderItem: function renderItem(d) {
+        return d.value;
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      multiple: true,
+      compressed: true,
+      style: {
+        marginLeft: 32
+      },
+      width: 300,
+      groupBy: groupBy,
+      data: data,
+      keygen: "value",
+      placeholder: "Select City",
+      renderItem: function renderItem(d) {
+        return d.value;
+      }
+    })]
+  });
+};
+exports.default = _default;

package/esm/select/__example__/14-inner-title.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/14-inner-title.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 内嵌标题
+ *    -- 通过配置`innerTitle`可以渲染内嵌标题
+ * en - Inner title
+ *    -- Set `innerTitle` to render inner title
+ */
+var _default = function _default() {
+  var data = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet', 'pink'];
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      innerTitle: "Select Color",
+      width: 300,
+      data: data,
+      keygen: true,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return d;
+      }
+    })
+  });
+};
+exports.default = _default;

package/esm/select/__example__/15-loading.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/15-loading.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 加载中
+ *    -- 设置`loading`为true时会展示一个默认的Spin组件，可以传入一个自定义的Spin代替
+ * en - Loading
+ *    -- Set `loading` to true will show a default Spin component, you can pass a custom Spin to replace it
+ */
+var _default = function _default() {
+  var data = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet', 'pink'];
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      loading: true,
+      width: 300,
+      data: data,
+      keygen: true,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return d;
+      }
+    })
+  });
+};
+exports.default = _default;

package/esm/select/__example__/16-custom-render.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/16-custom-render.js

@@ -0,0 +1,72 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 自定义列表布局
+ *    -- 通过设置`header`属性可以自定义列表头部区域内容
+ *    -- 通过设置`footer`属性可以自定义列表底部区域内容
+ *    -- `renderOptionList`可以自定义列表内容，并将列表实例抛出
+ * en - Header
+ *    -- Set `header` to customize the content of the header area
+ */
+var _default = function _default() {
+  var data = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet', 'pink'];
+  var shein = /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    style: {
+      background: 'black',
+      color: 'white'
+    },
+    children: "SHEIN"
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    style: {
+      display: 'flex',
+      gap: '24px 32px',
+      flexWrap: 'wrap'
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      header: shein,
+      width: 300,
+      data: data,
+      keygen: true,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return d;
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      footer: shein,
+      width: 300,
+      data: data,
+      keygen: true,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return d;
+      }
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      keygen: true,
+      header: shein,
+      footer: shein,
+      width: 300,
+      data: data,
+      renderItem: function renderItem(d) {
+        return d;
+      },
+      placeholder: "Select Color",
+      renderOptionList: function renderOptionList(s) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          children: [shein, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            children: s
+          }), shein]
+        });
+      }
+    })]
+  });
+};
+exports.default = _default;

package/esm/select/__example__/16-max-length.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/16-max-length.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 筛选限制字符长度
+ *    -- 设置`loading`为true时会展示一个默认的Spin组件，可以传入一个自定义的Spin代替
+ * en - Loading
+ *    -- Set `loading` to true will show a default Spin component, you can pass a custom Spin to replace it
+ */
+var _default = function _default() {
+  var data = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet', 'pink'];
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      loading: true,
+      width: 300,
+      data: data,
+      keygen: true,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return d;
+      }
+    })
+  });
+};
+exports.default = _default;

package/esm/select/__example__/17-custom-result.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;

package/esm/select/__example__/17-custom-result.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require("../..");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * cn - 自定义选中结果
+ *    -- 通过`renderResult`可以自定义选中结果的渲染
+ * en - renderResult
+ *    -- Set `renderResult` to custom render the result
+ */
+var _default = function _default() {
+  var data = ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'violet', 'pink'];
+  var renderResult = function renderResult(d) {
+    return "i love ".concat(d);
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.Select, {
+      width: 300,
+      renderResult: renderResult,
+      data: data,
+      keygen: true,
+      placeholder: "Select Color",
+      renderItem: function renderItem(d) {
+        return d;
+      }
+    })
+  });
+};
+exports.default = _default;

package/esm/select/__example__/18-custom-unmatch.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+export default _default;